Per descomptat, aquí teniu una visió general detallada de com podeu canviar la mida d'un commutador SwiftUI a Swift.
SwiftUI és el marc d'Apple per crear interfícies d'usuari a totes les plataformes d'Apple amb el poder de Swift. De vegades, els desenvolupadors poden trobar-se amb la necessitat d'ajustar la mida de components específics de la interfície d'usuari, com ara un interruptor. Per defecte, SwiftUI no permet canviar directament la mida d'un Switch, però podem utilitzar algunes solucions per aconseguir-ho.
Aprofundim en la solució del problema.
Creació d'un commutador personalitzat a SwiftUI
Per ajustar la mida d'un Switch a SwiftUI, un enfocament és crear un Switch personalitzat. Això us permet tenir un control complet sobre l'aparença i la mida de l'interruptor.
Aquí teniu un exemple de codi que crea un commutador personalitzat:
struct CustomSwitch: View {
@Binding var isOn: Bool
var body: some View {
Button(action: {
self.isOn.toggle()
}) {
Rectangle()
.fill(self.isOn ? Color.green : Color.gray)
.frame(width: 50, height: 30)
.overlay(Circle()
.fill(Color.white)
.offset(x: self.isOn ? 10 : -10),
alignment: self.isOn ? .trailing : .leading)
.cornerRadius(15)
.animation(.spring())
}
}
}
Entendre el codi de commutació personalitzat
Desglossem què fa aquest codi:
- L'estructura CustomSwitch: Això defineix la nostra vista SwiftUI personalitzada. Té una vinculació a un valor booleà: l'estat del commutador.
- Acció del botó: Aquest bloc de codi Swift especifica el comportament quan es prem el botó. Aquí, simplement canvieu l'estat "isOn".
- Rectangle: Una instància de l'estructura Rectangle de SwiftUI, que defineix les propietats de la forma.
- Color de farciment: El color del rectangle depèn de si "isOn" és cert o fals.
- Marc: El modificador de marc aquí indica l'amplada i l'alçada de l'interruptor personalitzat.
- Superposició: El modificador de superposició us permet posar una altra vista SwiftUI a sobre de l'existent: aquí, un cercle blanc que serveix com a botó de l'interruptor.
- Desplaçament: El modificador de desplaçament s'utilitza aquí per moure el cercle en funció de si "isOn" és cert o fals, donant la il·lusió que l'interruptor s'està alternant.
- cornerRadius: Això s'aplica a l'arrodoniment de les cantonades del rectangle subjacent.
- animació: El modificador d'animació aplica una animació spring() a tot el botó, de manera que quan canvieu, es canviarà sense problemes.
Ajustar cap amunt
Tenir la capacitat de personalitzar la mida d'un commutador SwiftUI pot ser un avantatge a l'hora d'adaptar la interfície d'usuari per adaptar-se a les necessitats específiques de l'aplicació. Hem après un enfocament per aconseguir-ho mitjançant la creació d'un Switch personalitzat. Feliç codificació!
Recordeu: SwiftUI és bastant flexible i personalitzable. No dubteu a ajustar els valors i les propietats del codi anterior per adaptar-vos millor al vostre projecte i necessitats de disseny. Si necessiteu canviar la mida de qualsevol altre component de la interfície d'usuari, l'enfocament de creació personalitzada es pot aplicar pràcticament de la mateixa manera.
