Storyboard para sa Pag-unlad ng iOS



Subukan Ang Aming Instrumento Para Sa Pagtanggal Ng Mga Problema

Ang mga storyboard ay unang ipinakilala sa mga developer sa paglabas ng iOS 5. Nai-save nila ang developer ng problema sa pagdidisenyo ng interface ng bawat screen sa ibang file. Pinapayagan ka ng storyboard na makita ang haka-haka na konsepto ng iyong app bilang isang buo at mga pakikipag-ugnayan sa pagitan ng bawat screen. Paggamit ng mga segue, magagawa mong itakda kung paano lilipat ang app sa pagitan ng mga naibigay na screen at ipasa ang data kasama. Sa tutorial na ito, ipapakita ko sa iyo kung paano gumawa ng isang simpleng login screen para sa isang app.



Nagsisimula



Ang unang bagay na nais mong gawin ay gumawa ng isang bagong proyekto. Gusto mo ng isang bagong application ng solong screen na nagtatakda ng wika sa Swift at ang mga aparato sa pangkalahatan. Kung mag-navigate ka sa storyboard dapat mong makita ang isang walang laman na tanawin ng controller ng view. Ang arrow sa kaliwang bahagi ng view controller ay nagpapahiwatig na ito ay ang root controller.



storyboard

Upang magdagdag ng mga label para sa pangalan ng gumagamit at password, kailangan mong pumunta sa kahon sa kanang bahagi sa ibaba ng iyong screen, piliin ang bilog na may isang parisukat dito, at i-drag at i-drop ang dalawang mga label sa iyong view. Sa pamamagitan ng pagpili ng mga kagustuhan sa gilid bar, maaari mong tukuyin ang maraming mahahalagang parameter. Napakaraming dapat talakayin ngunit ang karamihan ay nagpapaliwanag sa sarili.

storyboard2



Ang dalawang mahalagang bagay para sa amin ay ang teksto ng placeholder at ang ligtas na checkbox ng entry ng teksto. Nais naming gumamit ng teksto ng placeholder upang ipaalam sa gumagamit kung anong impormasyon ang kinakailangan sa kanila at ang ligtas na pagpasok upang maitago ang password ng gumagamit na lumabas. Matapos itong magawa, kailangan namin ng isang pindutan upang ma-trigger ang aming segue. Maaari naming i-drag ang isa sa parehong paraan na ginawa namin sa isang text field. Matapos mong bigyan ang pindutan ng isang pamagat at ayusin ang iyong mga object sa screen ay dapat magmukhang ganito:

storyboard3

Ngayon ang aming unang screen ng app ay tapos na kaya kailangan naming gumawa ng isa pa upang ilipat. Gawin ito sa pamamagitan ng pag-drag papunta sa screen ng pangalawang view controller. Upang maiugnay ang dalawang mga screen dapat mong gawin ang dalawang bagay. Una kakailanganin mong kontrolin ang pag-click sa pindutan at i-drag ito sa bagong screen na iyong idinagdag. Susunod kakailanganin mong piliin ang bilog sa pagitan ng dalawang view. Kakailanganin mong baguhin ang identifier sa segue; para sa halimbawang ito gagamitin ko ang 'nextScreen'

storyboard4

Panghuli, maglalagay kami ng isang label sa bagong screen upang maaari naming matingnan ang gumagamit at makita kung gumagana ang aming app. Upang ma-access ang mga patlang mula sa storyboard nang program, kailangan naming lumikha ng mga outlet para sa kanila sa klase na ginagamit ang mga ito tulad ng:

klase FirstScreen: UIViewController {

@IBOutlet mahina var username: UITextField!
@IBAction func login Button (nagpadala: AnyObject) {
perfromSegueWithIdentifier ('nextScreen', nagpadala: sarili)
}
}

klase SecondScreen: UIViewController {
gumagamit ng var: String!
@IBOutlet mahina var username: UILabel!

i-override ang func viewDidload () {
username.text = gumagamit
}
}

Matapos ito ay tapos na siguraduhing i-link ang mga bagay mula sa storyboard gamit ang mga inspektor ng koneksyon ng bawat screen. Dapat ipakita ang iyong mga outlet at maaari mong i-click ang bilog sa kanan ng mga ito upang mai-link ang mga ito.

storyboard5
Ang huling pagpapaandar na ipatutupad ay ang pag-andar ngForForSegue sa klase ng unang screen. Pinapayagan kang ipasa ang data sa bagong view tulad nito:

i-override ang masaya na paghahandaForSegue (sumusunod: UIStoryboardFollow, nagpadala: AnyObject?) {
kung segue.identifier == 'nextScreen' {
hayaan ang destVC = patuloy.destinationViewController bilang UIViewController
destVC.user = self.username
}
}

Ngayon mayroon kang isang pangunahing pag-unawa sa kung paano baguhin ang mga screen at ipasa ang data sa pagitan nila. Bibigyan ka nito ng mahusay na pagsisimula sa paggawa ng mga functional app, masayang programa!

2 minuto basahin