Günümüzde kullandığımız çoğu uygulama en az iki ekrandan oluşuyor. Bu sayede kullanıcı birçok işlem arasında kaybolmayıp, istediği işlemi kolayca yapabiliyor. Bu yüzden bir mobil uygulama geliştirilirken geliştiricinin birden fazla ekranı kullanabilmesi ve yönetebilmesi büyük önem arz ediyor. Bu durum diğer programlama dillerinde olduğu gibi Swift içinde geçerli. Bu yüzden Swift 101 serimizin son konuğu iki ekranla çalışmak. Hazırsanız bağlayalım!
Adım 1: İkinci Ekranı Oluşturalım
Uygulama tasarımımızı yapmadan önce gelin ikinci bir ViewController nasıl oluşturulur ona bakalım. Öncelikle normal bir obje ekleyecekmiş gibi main.storyboard ekranında bulunan + tuşuna basalım. Buradan ViewController objesini tutup main.storyboard ekranımıza sürükleyelim. Ekran eklendi fakat halen yeterli değil. Çünkü bu ekranın kendine ait bir ViewController’ı olması ve ekranın bu sayfaya bağlanması gerekir. Peki bunu nasıl yapacağız? Öncelikle File kısmından New File seçeneğine tıklıyoruz. Buradan Cocoa Touch Class seçeneğine tıklıyoruz. Ardından sayfamıza bir isim ve UIViewController olduğunu belirterek Next diyoruz. Son çıkan ekranda da Create dedikten sonra artık ikinci ViewController sayfamız da hazır. Şimdi ise son adım olarak ekranı bu sayfaya bağlamakta. Bunun için yeni oluşturduğumuz ViewController seçiliyken sağ köşede bulunan Identity Inspector sekmesine tıklayalım. Burada bulunan Class sekmesine gelip ikinci oluşturduğumuz ViewController sayfamızın adını seçelim. Bu işlemle birlikte artık ikinci ekranımız üzerinde çalışmaya hazır bir halde. Şimdi gelin tasarıma başlayalım.
Adım 2: Uygulama Tasarımı
Uygulamamız bir üniversite sonuç öğrenme ekranını temsil edecek. Kullanıcı ilk sayfaya ismini girip butona tıkladığında ikinci sayfada kazandığı üniversiteyi görebilecek. Bunun için ilk sayfada bir Label, kullanıcının isim girebilmesi için bir TextField ve ikinci ekrana geçebilmesi için bir TintedButton bulunuyor. İkinci ekranda ise kullanıcının isminin yazacağı bir Label ve kazandığı üniversitenin logosunu göreceği bir ImageView bulunuyor.
Adım 3: Tasarımı Kodla Bağlayalım
Tasarımı kodla bağlamak oldukça kolay. Bunun için kullandığımız objelere tıklayıp, Control tuşuna basılı tutarak ait olduğu sayfalara sürüklemeliyiz. Fakat butonu bağlarken Action olarak bağlamayı unutmamalıyız. Aksi takdirde butonumuzu tıklanabilir bir şekilde kullanamayız.
Adım 4: Kod Kullanmadan Segue Yapmak
İkinci ekrana geçiş yapmanın hem kodla hem de kodsuz geçişi mümkün. Fakat kodsuz geçiş yaptığımızda eğer geçiş esnasında kullanmamız gereken bir sorgu varsa bunu maalesef yapamayız. Fakat herhangi bir sorgu yok, sadece basit bir geçişse kodsuz tarafı da kullanabiliriz. Bunun için öncelikle main.storyboard sayfasında bulunan ViewController objelerinin önünde bulunan oka yakından bakalım. Uygulama Tasarımı adımımızda da görünen bu ok “entry point” olarak isimlendirilir ve uygulamanın giriş noktasıdır. Eğer bu oku ikinci ViewController objesine getirirseniz uygulama bu ekrandan açılmaya başlar. Fakat bizim asıl amacımız uygulama birinci sayfadan başlamalı ve biz butonla ikinci sayfaya geçmeliyiz. Bunun için butonumuza tıklayıp Control tuşuna basılı tutarak ikinci ekranımıza sürükleyelim. Burada Segue penceresi açılıyor. Bu pencerede de Show seçeneğine tıklayalım. Ve mutlu son. Artık geçiş yapabiliyoruz. Fakat açılan sayfayı bir türlü kapatamıyoruz. Günlük kullandığımız uygulamalarda bir Back tuşu olur fakat bunda yok. Bunun için butona tıkladıktan sonra Editor seçeneğine tıklıyoruz ve burada bulunan Embed In sekmesine tıklıyoruz. Burada açılan pencereden Navigation Controller özelliğine tıklıyoruz. Bu bize bir geri gelme tuşu yaratıyor ve artık Segue yapabiliriz.
Adım 5: Kod Kullanarak Segue Yapmak
Kod kullanarak Segue yapmadan önce birinci ekranımızı ikinci ekranımıza bağlayıp bir identifier vermeliyiz. Bunun için birinci ekranımıza tıklayalım. Üstte beliren sarı noktaya tıklayıp Control tuşu ile ikinci ekrana sürükleyelim. Identifier belirledikten sonra şimdi koda geçebiliriz.
Segue işlemini başlatmak için ilk olarak performsegue yapısını kullanıyoruz. Bu yapı bize gitmek istenilen ekranın Identifier adını soruyor. Az önce belirlediğimiz adı bu özelliğe yazıyoruz. Bir diğer özellik ise sender. Bu göndericiden herhangi bir bilgi taşınıp taşınmayacağını soruyor. Biz şimdilik taşımayacağımız için nil olarak bıraktık.
performSegue(withIdentifier: "toSecondVC", sender: nil)Şimdi sıra geldi birinci ekrandaki verinin ikinci ekrana taşınmasına. Bunun için Swift ile gelen prepare fonksiyonunu kullanacağız. Burada öncelikle segue.identifier metodu ile gidilen ekranı kontrol etmeliyiz. Kontrol tamamlandıktan sonra ikinci ekranı bir değişkene atayarak ikinci ekrandaki değişkenlere ulaşmalıyız. Bunun için segue.destination metodunu kullanırız. Yalnız bu metodu cast etmemiz gerekiyor. SecondViewController ile cast işlemini de gerçekleştirdikten sonra artık değişkenin adını yazıp nokta koyarak ikinci sayfadaki değişkenlere ulaşabiliriz.
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if segue.identifier == "toSecondVC" {
let destinationVC = segue.destination as! SecondViewController
destinationVC.studentName = userName
}
}İkinci ekranı da uygulamaya göre ayarladıysak final için hazırız.
Final
//ViewController
import UIKit
class ViewController: UIViewController {
@IBOutlet weak var homeLabel: UILabel!
@IBOutlet weak var nameTextFiedl: UITextField!
var userName = ""
override func viewDidLoad() {
super.viewDidLoad()
}
@IBAction func learnButton(_ sender: Any) {
if nameTextFiedl.text != "" {
userName = nameTextFiedl.text!
performSegue(withIdentifier: "toSecondVC", sender: nil)
}
}
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if segue.identifier == "toSecondVC" {
let destinationVC = segue.destination as! SecondViewController
destinationVC.studentName = userName
}
}
}// SecondViewController
import UIKit
class SecondViewController: UIViewController {
@IBOutlet weak var secondPageLabel: UILabel!
@IBOutlet weak var uniLogo: UIImageView!
var studentName = ""
var uniArray = ["boun","itü","odtü","ku","saü","ytü","iü"]
override func viewDidLoad() {
super.viewDidLoad()
secondPageLabel.text = "Congratulations,\(studentName)"
changePic()
}
func changePic () {
let random = Int(arc4random_uniform(UInt32(uniArray.count)))
uniLogo.image = UIImage(named: "\(uniArray[random])")
}
}
Birden fazla ekran kullanmak bir geliştirici için en önemli konulardan biri. Biraz karmaşık gibi görünsede alışınca kolaylaşan bu yapı taşı, Swift 101 serimizin en önemli konuklarından biriydi. Hemen hemen her uygulamada kullanacağınız bu özelliği sizlerde sevdiniz mi?
