Ana sayfa Mobil iOS Swift – Navigation Bara activity Indicator Ekleme

Swift – Navigation Bara activity Indicator Ekleme

6931
802
PAYLAŞ

Merhaba arkadaşlar,

Bugünkü dersimizde Navigation Bara nasıl bir text eşliğinde activity Indicator ekleyebileceğimizi göreceğiz.

Storyboard çok basit olduğu için hızlıca geçeceğim.

Öncelikle bir Single View Application oluşturun, storyboard dosyanızı açın ve ViewControllerı yukarda editor kısmından Emberd In -> Navigation Controller’a tıklayarak bir navigation controller içine alın.

Ardından iki tane button ekleyin ve constraintleri dilediğiniz gibi ayarlayın. Ben butonlarımın title kısımlarını Start ve Stop olarak ayarladım. Daha sonra Assistant Editor yardımıyla Storyboard’dan ViewController’a her button için ayrı action outletleri ekleyin.

Benim storyboard ve ViewController.swift dosyam aşağıdaki gibi görünüyor. Sizinde buna benzer bir görüntüye sahip olmanız gerekir.

Şimdi gelin activityIndicator(yükleme belirteci) için bir sınıf oluşturalım. ActivityIndicator adında yeni bir Swift dosyası oluşturalım ve projemize ekleyelim.

Sonra dosyamızın içine aşağıdaki kodu kopyalayalım.

  1. Singleton oluşturuyoruz, daha detaylı açıklaması mevcut ancak kısaca, bir obje oluşturma ihtiyacı duymadan direk o objeye refer ederek işlemler yapmamızı sağlayan bir yapı. (Yakında singletonlar ve swift ile nasıl yazılacağıyla ilgili detaylı ders geliyor)
  2. activityLabel adında bir UILabel oluşturuyoruz, koordinatlarını genişlik ve yükseklik bilgisini giriyoruz.
  3. activityIndicator adında bir UIActivityIndicatorView oluşturuyoruz, koordinat ve boyutları girerek.
  4. activityView adında boş bir UIView objesi oluşturuyoruz.

Şimdi animasyonumuzu tasarlayabileceğimiz ve başlatabileceğimiz animateActivity adında title, view, ve navigationItem adlarında 3 parametre alan bir metod tanımlayalım.

  1. İlk önce daha önce oluşturduğumuz activityIndicator’ün stilini belirliyoruz. Ardından gene daha önce oluşturduğumuz activityLabel’ın text özelliğini, metodumuza aldığımız title parametresine eşitliyoruz.
  2. .sizeToFit() metoduyla Labelimizin boyutunun verilen title uzunluğuna eşit olmasını sağlıyoruz.
  3. xPoint ve yPoint adında iki sabit oluşturuyoruz. x noktasını view’ımızın çerçevesinin tam ortası olarak ayarken, y noktasını ise metodumuza parametre olarak aldığımız navigationItem’ın erişilebilen çerçevesinin tam orta noktasının y si olarak ayarlıyoruz. widtyForActivity sabitiylede, indicator ve label genişliklerini toplayarak activityView’e eşitliyoruz. (Not: navigationItem Navigation Controllerın yukardaki bar kısmının Swiftteki tanımlaması)
  4. activityIndicator ve activityLabel objelerini activityView’ımıza subview(alt view) olarak ekliyoruz.
  5. Daha sonra navigationItem parametresinin titleView özelliğini oluşturduğumuz activityView objemize eşitliyoruz, ve ardından activityIndicator.startAnimating() diyerek yükleniyor görüntümüzü navigasyon barımızda görüntülemeye başlıyoruz.

Şimdi ise stopAnimating adında gene navigationItem parametresi alan bir metod tanımlayalım. Bu metodumuzun amacı herhangi yükleme işlemimiz sona erdikten sonra, navigasyon barımızdaki yükleniyor ibarelerini ortadan kaldırmaya yarayacak.

Bu metodda ilk önce activityIndicator objemizi .stopAnimating() metodu ile durduruyoruz, ve ardından navigationItem’in titleView özelliğini nil’e eşitleyerek, daha önceden eklediğimiz activityView objesini silmiş oluyoruz.

Şimdi tekrar ViewController dosyamıza gidelim ve activityIndicator adında oluşturduğumuz ActivityIndicator sınıfından bir obje oluşturalım.

Sonra startTapped metodumuzun içersinde oluşturduğumuz objemizin .animateActivity metodunu tetikleyelim. title olarak dilediğimizi gönderebiliyoruz, ne yazdırmak istersek. View olarak self.view yazmamız gerekiyor çünkü activityIndicator’ü göstermek istediğimiz view, ViewController’ın kendi viewı. navigationItem olarakta, ViewControllerımız zaten bir navigation controller içerisinde gömülü olduğu için direk navigationItem diyoruz.

stopTapped metodumuzdada durdurma işlemini gerçekleştirelim:

Şimdi uygulamamızı çalıştıralım ve Start Stop butonlarına basarak nasıl çalıştığını görelim.

Navigation Bar Loading GIF - Find & Share on GIPHY

Bu dersimizinde sonuna geldik, artık dilediğiniz zaman projelerinizde, navigation bar üzerinde de activityIndicator kullanabilirsiniz.

BİR CEVAP BIRAK

Please enter your comment!
Please enter your name here