UIKit: UITextView
UITextView elemanı, uzun metinleri uygulamanızın içerisinde göstermek için iyi bir yoldur.
Merhaba TurkishKit okuyucuları, bu yazımızda UITextView ile nasıl kaydırılabilir ve çok satırlı metinler oluşturabileceğimizi öğreneceğiz. Eğer sizler de hazırsanız başlayalım! 🤙🏻
UITextView Nedir?
UITextView ile özel stil bilgileri kullanarak metinlerin uygulamamızda görüntülenmesini sağlarız. Ayrıca, metinlerin düzenlemesini de gerçekleştirebiliriz. Büyük metinlerde ise metin belgesinin gövdesini görünülemek için kullanılabilir. Buna ek olarak, genellikle birden çok metin satırını bir araya toparlamak için de UITextView elemanını kullanırız.
Projeyi Oluşturma
Create a new Xcode Project diyerek projemizi oluşturalım. “Single View App” seçeneğinden devam ederek uygulamamıza “UITextView” adını verelim.
UITextView Elemanını Oluşturmak
Main.storyboard dosyamıza gelerek sağ üst kısımdaki (+) Swift kütüphanesine tıklayarak UITextView aramasını yapıyoruz. Seçtiğimiz UITextView elemanını, uygulamamızı şekillendirdiğimiz ekran penceresinin tam ortasına yerleştirelim.Ardından, aşağıya ve yanlara tamamen sınır olacak şekilde hizalayalım. Bir de kütüphanemizden Label elemanını seçerek onu da sol yukarıya sağdan soldan ve yukarıdan sınır olacak şekilde hizalayalım. Ardından Textimizi de labela sınır olacak şekilde yukarıdan hizalayalım. Birçok uygulamamızda görüntümüzün sabit yerinde olması için de constraintler ekleyerek düzenimizi sağlayalım. Gördüğünüz üzere Swift’in default olarak verdiği yazıyı görebiliyoruz. Gelin bunun üzerinde birkaç değişiklik yapalım.
Projeyi Şekillendirme ve Tanıma
Text kısmında Plain ve Attributed sekmelerinde yazınızın default ayarlarına sahip olmak istiyorsanız Plain sekmesinde kalabilirsiniz. Eğer bir uygulama geliştiricisiyseniz de tercih edilen sekme Plain sekmesidir. Attributed üzerinden yapacağınız düzenlemeleri, Plain sekmesinde seçili kalıp alt taraftaki ayarlamalardan devamını getirerek yapabilirsiniz.
Color kısmında default olarak verilen metin rengimiz bellidir. Bunu değiştirme işlemini de o sekmeden yapabiliriz. Uygulamalar için önerilen text color ise Xcode’un size default olarak verdiği renktir.
Font sekmesi ile yazınızın boyutunu rahatlıkla ayarlayabilirsiniz.
Alignment sekmesi ile de metninizi metin bloğunuzda nasıl hizalayacağınızı görebilir ve uygulayabilirsiniz.
Main.storyboard dosyamızda elemanımızı tanıdığımıza göre artık projemizi kodlamaya başlayabiliriz. 🤟🏻
Direkt olarak sol taraftaki ViewController.swift dosyamıza geçelim. Artık kod yazma zamanı.🤞🏻
Kodlayalım
Öncelikle Main.storyboard ekranına eklediğimiz label ve textview elemanlarını bağlantı türü olarak Outlet cinsinden kodlayalım.
@IBOutlet weak var label: UILabel!
@IBOutlet weak var textView: UITextView!Kodladıktan sonra, View Controller üzerinden outletlerimizi label ve textimize işaretleyelim. Bunu Main.storyboard dosyamıza geçerek görünen ekran üzerindeki çubuktan sol tarafa tıklayarak gerçekleştirebiliriz.
Ardından uygulamamızı çalıştıralım ve biraz inceleyelim. Textin üzerine tıkladığımızda klavye otomatik bir şekilde ekranımıza gelmiyor değil mi? Bunu düzeltmek için command+shift+K tuşlarına aynı anda basabiliriz fakat bu sefer de klavyemizi kapatmak için de aynı komutu girmemiz gerek. Hadi bunu touchesBegan fonksiyonu yazarak düzeltelim!
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
super.touchesBegan(touches, with: event) self.view.endEditing(true)
self.textView.resignFirstResponder()
}
Uygulamamızı tekrar çalıştırdığımızda ve text üzerine tıkladığımızda klavyemizin açıldığını görebiliyoruz. Ayrıca, text alanının dışında bir yere tıkladığımızda da klavyemizin kapandığını görebiliyoruz. Süper! İlerleme kaydetmeye devam ediyoruz. Şimdi ise textimize efekt verebileceğimiz önemli bir eleman olan UITextViewDelegate elamanını kullanalım!
UITextViewDelegate Nedir?
Delegate, UITextView nesnelerine düzenlemeler yapabilmek için kullanılan bir yöntemidir.
UITextViewDelegate Kullanımı
ViewController.swift dosyamızda kodlamaya devam ederek kullanacağız. ViewController classının içine “,” koyduktan sonra “UITextViewDelegate” yazarak elemanımızı aktif hale getirmiş olacağız. Artık text üzerinde değişiklikler yapabiliriz. 🤟🏻
Öncelikle, textimizi düzenlemek için dokunduğumuzda text alanımızın daha görünür bir hale gelebilmesi için backgrounda renklendirme verebiliriz. Bunu şu şekilde kodlayabiliriz.
viewDidLoad fonksiyonunu içerisine şu kodu ekleyelim.
override func viewDidLoad() {
super.viewDidLoad() self.textView.delegate = self
}
- Ardından textimizi düzenlemeye başlarken oluşması gereken background rengini tanımlamak için touchesBegan fonksiyonunun altına yeni bir fonksiyon oluşturalım.
func textViewDidBeginEditing(_ textView: UITextView) {
textView.backgroundColor = UIColor.lightGray
}- Text düzenlememiz bittikten sonra düzenlemeden çıktığımızda text background renginin eski beyaz rengine dönmesi için yeniden bir fonksiyon oluşturalım!
func textViewDidEndEditing(_ textView: UITextView) {
textView.backgroundColor = UIColor.white
}Son kodlarımızdan sonra uygulamayı çalıştırıp değişikliklere bakabiliriz. Artık uygulamamız eskisine göre daha bir cool değil mi? 🤩
Ekstra Çalışma!
UITextField ile yapacağımız başlıca düzenlemenin birkaçını gerçekleştirdik. Ama farkettiyseniz UILabel elemanımızı hâlâ kullanmadık. Hadi gelin bunu bir Tweet yazıyormuşçasına kullanalım.
Elemanın içerisindeki yazıyı güncel karakter sayısında tutacak şekilde düzenleyebiliriz. Mesela 150 karakteri aşmayacak bir düzenleme yapabiliriz. Bunun için en alt kısma shouldChangeTextIn fonkisyonunu yazalım.
func textView(_ textView: UITextView, shouldChangeTextIn range: NSRange, replacementText text: String) -> Bool {
label.text = "\(textView.text.count)"
return textView.text.count + (text.count - range.length) <= 150
}Main.storyboard üzerinden text içinde bulunan default yazımızı silip uygulamamızı çalıştırabiliriz.
Yazı alanına random şekilde yazmaya devam edin, farkedeceksiniz ki 150 karakterden fazla karakteri istesek de yazamıyoruz.
Gerekli metin düzenlemelerini yaptığınız projemizde, UITextView elemanının kolay ve rahat anlaşılabilir bir metin görüntüleyicisi olduğunu anlayabiliyoruz. UITextViewDelegate ile de çeşitli düzenlemeler yapabilme imkanına erişebiliyoruz.
Bu makalemizin sonuna geldik. Bu makalemizde UITextView yapısını ve nasıl kullanabileceğimizi öğrendik. İyi kod yazmalar! 💻
