Swift Context Menu Kullanımı

Apple’ın iPhone 6s ile duyurduğu 3D Touch özelliğiyle arayüzde bazı elementlere sert basma ile kısa yollar tanımlamamıza olanak sağladı. Ancak son cihazlarla birlikte bu 3D Touch özelliği kaldırıldı yerine ise Haptic Touch adı verilen uzun basma ile tetiklenen özellik geldi. iOS 13 ile birlikte 3D Touch Menüsü yerine Context Menu getirildi. Bu yazıda aşama aşama Table View ile Context menu kullanımına bakalım.

Aslında yapacağımız şey oldukça basit olacak. Bu basit bi Table View cell’ine uzun basarak bir menü açılmasını ardından menüden ya detay sayfasına gitmeyi ya da açılan menünün üzerine başka menü açmaya bakalım ve bu ikinci menüde silme ve ekleme özellikleri olsun.

Hadi Başlayalım ?

Single View Application Projesi oluşturup StoryBoard kullanarak bir Table View sürükleyip bırakıyorum ve Table View’umu View Controller sınıfıma bağlıyorum.

Basit bir array oluşturuyorum içerisinde çeşitli meyve isimler mevcut.

var array = ["Armut", "Üzüm", "İncir", "Karpuz", "Muz", "Erik", "Elma", "Portakal", "Kavun"]

Şimdi Table View işlemlerimize geçebiliriz.

override func viewDidLoad() {
        super.viewDidLoad()
        
        myTableView.delegate = self
        myTableView.dataSource = self
    }

extension ViewController: UITableViewDelegate, UITableViewDataSource
{
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return array.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = UITableViewCell()
        cell.textLabel?.text = array[indexPath.row]
        return cell
    }
}

ViewDidLoad Metodunda delegate ve data source için ayarlamalar yaptım ve ardından “numberOfRowsInSection” metoduyla table view’um için cell sayımı belirledim. Son olarak “cellForRowAt” fonksiyonumuzda basit bir cell yapısı oluşturdum. Nasıl göründüğüne bakalım:

Şimdi bir adet View Controller daha oluşturuyorum, içerisinde sadece Label var tıkladığımız hücredeki yazıyı yeni View Controllerımızda göreceğiz. Bu view controller‘ı kod ile tasarlıyorum eğer StoryBoard kullanmak isterseniz öncelikle bir StoryBoard nesnesi oluşturmak ardından identifier kullanarak StoryBoarddaki view controller‘ınıza erişmeniz gerekiyor.

Şimdi sıra geldi Context Menu ayarlamalarına. Kullanacağımız fonksiyon “contextMenuConfigurationForRowAt” olacak ve bu TableViewDelegate protokolünden geliyor. Bu metot bizden geriye bir nullable UIContextMenuConfiguration istiyor ve bize Table View, indexPath gibi referansları sağlıyor.

Nullable olmasının avantajı dilediğiniz cell için görünmemesini sağlayabilirsiniz. Örneğin bir header gibi cell tasarladınız ve bunun için görünmemeli.

func tableView(_ tableView: UITableView, contextMenuConfigurationForRowAt indexPath: IndexPath, point: CGPoint) -> UIContextMenuConfiguration? {
        // CODE
    }

Şimdi bir UIContextMenuConfiguration oluşturalım ve burada bir identifier, bir provider ki bu ön izleme ekranımız yani DetailVC olacak ve son olarak actionları tanımlayacağız. Bu aksiyonlar ise UIAction tipinde olacak.

Burada ekstra olarak menünün içinde bir menü daha ekledim bunu da konfigürasyonumuzun geriye istediği tip olan UIMenu içerisindeki children’a bir UIMenu daha ekleyerek yaptım. Şimdi herhangi bir cell‘e uzun basarsak ne oluyor bakalım:

Peki Edit butonuna tıklarsak bizi nasıl bir ekran karşılıyor bakalım:

Eğer bu işlemleri CollectionView ile yapmak isterseniz fonksiyonlar aynı şekilde kullanılacaktır. Delegate protokolü bu metotlara sahiptir.

İlk aşamamızı bitirdik bu yazıda Context Menu’nun nasıl yapılacağına göz attık ilerleyen yazılarımda bu Context Menu için yazılarım olacak. Sorularınız için yorumlar ya da iletişim sayfasını kullanabilirsiniz. Teşekkür ederim.

Projenin kaynak kodlarına ulaşmak için: GitHub Hesabım

Leave a comment

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

20 − one =