Els guions gràfics es van presentar per primera vegada als desenvolupadors amb la versió d’iOS 5. Estalvien al desenvolupador la dificultat de dissenyar la interfície de cada pantalla en un fitxer diferent. El guió gràfic us permet veure la maqueta conceptual de la vostra aplicació en conjunt i les interaccions entre cada pantalla. Mitjançant seguiments, podeu definir com transitarà l’aplicació entre pantalles donades i transmetrà dades. En aquest tutorial, us mostraré com fer una pantalla d'inici de sessió simple per a una aplicació.
Començant
El primer que voldreu fer és fer un projecte nou. Voleu una nova aplicació de pantalla única que defineixi l’idioma a Swift i els dispositius a universal. Si navegueu fins al guió gràfic, hauríeu de veure una escena de controlador de visualització buida. La fletxa del costat esquerre del controlador de visualització indica que és el controlador arrel.
Per afegir etiquetes per al nom d'usuari i la contrasenya, heu d'anar al quadre situat a la part inferior dreta de la pantalla, seleccionar el cercle amb un quadrat i arrossegar i deixar anar dues etiquetes a la vista. En triar les preferències de la barra lateral, podeu especificar molts paràmetres importants. N’hi ha massa per repassar, però la majoria s’expliquen per si mateixos.
Els dos importants per a nosaltres són el text del marcador de posició i la casella de selecció de text segur. Volem utilitzar text de marcador de posició per fer saber a l’usuari quina informació se li requereix i l’entrada segura per ocultar la contrasenya de l’usuari. Un cop fet això, necessitem un botó per activar el nostre segu. En podem arrossegar un de la mateixa manera que vam fer un camp de text. Després de donar títol al botó i disposar els objectes a la pantalla, hauria de tenir el següent aspecte:
Ara la nostra primera pantalla de l'aplicació s'ha acabat, de manera que hem de fer-ne una altra a la que passar. Feu això arrossegant a la pantalla un segon controlador de visualització. Per connectar les dues pantalles heu de fer dues coses. Primer haureu de controlar feu clic al botó i arrossegueu-lo a la nova pantalla que heu afegit. A continuació, haureu de seleccionar el cercle entre les dues vistes. A continuació, haureu de canviar l'identificador per seguir; per a aquest exemple utilitzaré 'nextScreen'
Per últim, posarem una etiqueta a la nova pantalla perquè puguem veure l’usuari i veure si la nostra aplicació funciona. Per poder accedir als camps des del storyboard per programació, haurem de crear punts de venda per a ells a la classe que els faci servir així:
classe FirstScreen: UIViewController {
@IBOutlet nom d'usuari var feble: UITextField!
@IBAction func loginButton (remitent: AnyObject) {
perfromSegueWithIdentifier ('nextScreen', remitent: auto)
}
}
classe SecondScreen: UIViewController {
var usuari: Cadena!
@IBOutlet nom d'usuari var feble: UILabel!
sobreescriu func viewDidload () {
nom d’usuari.text = usuari
}
}
Un cop fet això, assegureu-vos d'enllaçar els objectes del storyboard mitjançant l'inspector de connexions de cada pantalla. Els vostres punts de venda haurien d'aparèixer i podeu fer clic al cercle situat a la dreta per enllaçar-los.
L’última funció que s’implementarà és la funció prepareForSegue de la classe de la primera pantalla. Això us permet transmetre dades a la nova visualització de la manera següent:
anul·lar la diversió prepareForSegue (següent: UIStoryboardFollow, remitent: AnyObject?) {
si segue.identifier == “nextScreen” {
deixem destVC = continues.destinationViewController com a UIViewController
destVC.user = nom.usuari auto
}
}
Ara teniu una comprensió bàsica de com canviar de pantalla i passar dades entre elles. Això us donarà un bon començament a fer aplicacions funcionals, una programació feliç.
2 minuts de lectura
