View Controller arası geçiş (show, present, popover, dismiss)

Merhaba Arkadaşlar,
mobilhanem.com da iOS Uygulama Geliştirme eğitim serimize kaldığımız yerden View Controller arası geçiş (segue, pop, push, dismiss) dersi ile devam ediyoruz. Bir önceki derste iOS Navigation Controller Kullanımı ve Örnekleri konusunu işledik. Birden fazla sayfalı iOS uygulamaları geliştirirken sıklıkla sayfalar arası geçiş yaptığımız senaryolarla karşılaşacağız. Bu yazımızda sayfalar arası geçişin alternatif yollarını anlatacağız. Bu yazının sonunda;

• Oluşturduğumuz iki view controller’ı birbirine bağlamak
• Bu view controller’a segue eklemek
• İlk View controller’dan buton yardımıyla ikinci view controller’a gitmek için segue’yi tetiklemek (Segue)
• İkinci View Controller’dan yine bir buton yardımıyla önceki sayfaya dönmek (Dismiss)

konularını öğrenmiş olacaksınız. Hazırsanız gelin hemen başlayalım.

Daha önceki derslerimizde anlattığımız gibi yeni bir Xcode projesi oluşturalım. Ardından resimdeki gibi ikinci bir view controller ekliyoruz.

Şimdi, bu iki view controller’ı Segue kullanarak birleştireceğiz. Resimdeki gibi view controller’ın tepesindeki sarı küçük butona bastığımızdan emin olup meşhur Control tuşumuza basılı tutup ikinci view controller’ın üzerine sürükleyelim.

Eliniz hala Control’a basılıyken mouse’dan parmağınızı çektiğinizde karşınıza aşağıdaki gibi segue tipleri çıkacak.

Gelin bu segue türlerini sırasıyla inceleyelim.

• Show Segue — Eğer oluşturduğunuz view controller’lar daha önceki dersimizde anlattığımız UINavigationController pushViewController metodunun segue’ye uyarlanmış şeklidir. Segue sıradaki View Controller’ı navigation stack’ine ekler ve bir sonraki sayfaya geçirir. Eğer birbirinden bağımsız iki sayfaysa o sayfaya geçiş yapmanızı sağlar. Gelin bunu bir örnekle pekiştirelim. Biraz önceki küçük sarı butondan Control tuşuyla Show segue’yi seçelim ve arada oluşan bağlantının üzerine tıklayalım. Bu noktada oluşturduğumuz segue’ye benzersiz bir tanımlayıcı vermemiz gerekiyor. Ben bu örnek için ‘goToPinkPage‘ olarak belirledim.

NOT 1: iOS 13 ve Xcode 11 ile birlikte yapılan değişikliklerle oluşturduğunuz segue’nin tam ekran olarak gözükmesini istiyorsanız gideceğiniz view controller üzerinde bulunan sarı butona tıklayıp  seçeceğini Automatic’ten Full Screen olarak değiştirmeniz gerekiyor.Şimdi segue’yi oluşturduğunuz view controller’ın Swift dosyasına gidelim. Show butonu için ben bir action tanımladım. Bu action aşağıdaki gibi gözükmeli.

    @IBAction func showBtnPressed() {
        performSegue(withIdentifier: "goToPinkPage", sender: nil)
    }

NOT 2: Biraz önce belirlediğiniz benzersiz tanımlayıcı ile metodda verdiğiniz tanımlayıcı aynı olmalı yoksa uygulamanız crash olacaktır.

Eğer adımları doğru takip ettiyseniz örneğimiz  bu şekilde çalışacaktır.

• Show Detail — Bu özellik daha ziyade iPad’lere geliştirilen uygulamalarda kullanılan UISplitViewController içeren durumlarda karşımıza çıkar. Aşağıdaki ekranda gördüğünüz gibi ekran iki parçadan oluşuyor. Soldan herhangi bir butona tıklandığında sağdaki detay ekranı değişir bunu da show detail yardımıyla yapabiliriz.

• Present Modally — Bu seçenek göstermek istediğimiz view controller’ı halihazırda gösterdiğimiz view controller’ın üzerinde gösterir. Herhangi bir UISplitViewController veya UINavigationController’ın parçası olmasına gerek yoktur. Gitmek istediğiniz view controller’ı bir öncekinin tam üstünde gösterir. iPhone telefonlarınızı rehberinde yeni bir kayıt ekleyeceğiniz zaman açılan ekran tam olarak Present Modally yardımıyla yapılmıştır. Bu sefer örneğimizde biraz önceki show butonunun altına yeni bir buton ekledim. Segue oluştururken bu sefer Show seçeneğini değil de Present Modally’i işaretleyin ve biraz önceki gibi benzersiz bir tanımlayıcı oluşturun.

Şimdi segue’yi oluşturduğunuz view controller’ın Swift dosyasına gidelim. Show butonu için ben bir action tanımladım. Bu action aşağıdaki gibi gözükmeli.

    @IBAction func modallyBtnPressed() {
        performSegue(withIdentifier: "modally", sender: nil)
    }

• Popover Presentation — Genelde iPad’lerde kullanılan bu seçenek yeni view controller’ı küçük bir kutu içerisinde minik bir ok yardımıyla gösterir. Örnekle daha iyi anlayacağınızı düşünüyorum. Örnek uygulamamıza üçüncü bir buton ve storyboard’a yeni bir view controller ekledim. Bu sefer view controller üzerindeki sarı buton yardımıyla değil de eklediğimiz yeni butondan Control tuşuna basarak view controller’a Popover Presentation ekleyelim.

Bu kez butona herhangi bir action işlemi tanımlamamıza gerek yok çünkü segue’yi direk buton üzerinden bu şekilde tanımladığımızda performSegue metodunu çağırmaya ya da herhangi bir action’a gerek yok. Butona tıkladığınızda karşınıza çıkacak görüntü ise şöyle olacaktır.

Custom — Eğer ben bu segue tiplerini beğenmedim kendi özel segue ve sayfalar arası geçiş stilimi oluşturayım isterseniz bu seçeneği kullanabilirsiniz.

Evet arkadaşlar şimdiye kadar segue oluşturmayı ve bir sonraki sayfayı nasıl göstereceğimizi anlatmaya çalıştım peki bu açtığımız sayfaları nasıl kapatacağız soru aklınıza gelmiş olabilir işte yazının bundan sonraki bölümünde tam olarak bu soruyu yanıtlayacağım.

Öncelikle açtığımız sayfalardan birine tıkladığımızda sayfayı kapatabileceğimiz bir buton ekleyelim. Ardından eklediğimiz bu butonun action’unu aşağıdaki gibi tanımlayalım.

    @IBAction func dismissBtnPressed() {
        dismiss(animated: true) {
            print("Sayfa dismiss oldu.")
        }
    }

Dismiss metodunu açtığımız sayfadan bir önceki sayfaya dönmek için kullanırız. Bu metod aynı zamanda bir completion handler barındırır. Bunun içerisinde sayfamız kapandığında ne olacağına söyleriz. Ben bu örnekte ufak bir print ekledim ancak siz kendinize göre burayı özelleştirebileceğiniz gibi nil belirleyerek de herhangi bir işlem yaptırtmayabilirsiniz.

Buraya kadar anlattığım geçişler hep segue ile çalıştığımız durumlarda kullandığımız yöntemlerdi. Ancak, segue kullanmadan da view controller’lar arası geçiş yapabiliriz. Bu da çok sık başvurulan ve bir o kadar kolay bir yöntemdir. Hazırsanız lafı çok uzatmadan hemen onu da inceleyelim.

Öncelikle storyboard’umuzun içine tertemiz bir view controller ekleyelim. Sonrasında bu view controller’ın üzerinde bulunan sarı minik butona tıklayalım.

Resimde kırmızı ok ile gösterdiğim yerde yine bu view controller’a özel benzersiz bir Storyboard ID verelim. Ben genelde bunu o view controller’a ait class ile aynı isimde yapıyorum. Ardından ilk view controller’ın içine 4. bir buton olan Without Segue isimli bir buton yerleştirdim. Bu butonun action işlemi aşağıdaki gibi olsun.

@IBAction func withoutSegueBtnPressed() {
        let mainSb = UIStoryboard(name: "Main", bundle: Bundle.main)            // 1
        let thirdVC = mainSb.instantiateViewController(identifier: "ThirdVC")   // 2
        show(thirdVC, sender: self)                                             // 3
    }

Bu kod parçası sırasıyla;

1. Storyboard’un bir değişkenini oluşturuyoruz. Burada storyboard’un adı Main olduğundan öyle kullandık, eğer storyboard’unuzun ismi farklıysa burada name değişkenine onun adını vermelisiniz.
2. Oluşturduğumuz storyboard değişkeni ve biraz önce yeni oluşturduğumuz view controller’a verdiğimiz benzersiz Storyboard ID kullanarak bir değişken oluşturuyoruz.
3. Oluşturduğumuz view controller’ın bir önceki view controller’ın üzerinde görüntülenmesini sağlıyoruz.

UINavigationController kullandığımız durumlarda sayfalarımız arasındaki geçişin yollarını ise bir önceki yazımızda anlatmıştık. İlgili derse buradan ulaşabilirsiniz.

Projenin tamamlanmış halinin kodlarına buradan ulaşabilirsiniz.

ÖZET

Bu yazımızda birden fazla sayfası olan iOS uygulamalarımızda sayfalarımızı birbirine bağlamak için kullanılan farklı yolları inceledik. Yazıyla alakalı değerli görüşlerinizi, soru veya yorumlarınızı yorumlar kısmına ya da buradan soru cevap kısmına yazabilirsiniz. Diğer derste görüşmek dileğiyle.

Tüm iOS Dersleri için tıklayınız.