Android ListView Özelleştirme ve Tasarım

Merhaba, bu yazımızda Android’de görsel öğelerden olan ListView’ı özelleştirmeyi ve tasarım yapmayı öğreneceğiz. Örnek projemde ekranda kişiler listesi olacak. Kişilerin profil resmi, adı, soyadı, şehri ve ilgi alanı yer alacak. Hadi başlayalım…

ListView’ı özelleştirmek için ihtiyacımız olanlar,

  • Her bir satır için geçerli olacak layout tasarımı. (satir_tasarimi.xml)
  • Tasarımı gerçekleyecek bir adaptör yazımı. (ListAdapter.java)
  • Ayrıca profil resimleri için Shape Image View kütüphanesini kullanacağız. Bu resimlerimizin yuvarlak, poligon benzeri şekillerle gösterilmesini sağlayacak.

Not: Shape Image View kütüphanesini kullanmak için build.gradle app dosyanızda dependencies içine
compile com.github.siyamed:android-shape-imageview:0.9.+@aar yazmanız gerekmektedir.

Adım 1 – Satır tasarımımızı yapalım

Satır tasarımı yapmak için layout klasörünün içine yeni bir layout xml dosyası oluşturalım. Burada yapacağımız tasarım her bir liste satırı için geçerli olacak. Burada küçük simgeler için 2 resim kullandım. Bunları Github hesabımdan indirebilirsiniz.(city.png, interests.png) Dosyamızın adı bu proje için satir_tasarimi.xml ve şu şekilde bir tasarıma sahip:

Adım 2 – Satırın arka planı

Satırlarımızın arka planı için yuvarlatılmış bir dikdörtgen tercih ettim. Drawable klasörümüzde satir_arkaplan.xml şeklinde bir layout dosyası açalım. İçeriği şöyle:

Adım 3 – Verilerimizi hazırlayalım Başta belirttiğimiz gibi liste elemanları bir resim, ad, soyad, şehir ve ilgi alanı bilgilerine sahip. Bunun için Kisi adında bir sınıf oluşturuyoruz. Kisi.java sınıfım şu şekilde:

Adım 4 – Özel liste adaptörümüz

Şimdi verilerimiz ile tasarım arasında bir köprü oluşturacak olan adaptörümüzü yazalım. ListAdapter.java sınıfım şu şekilde:

Adım 5 – ListView ekleyelim

Ekranda nerde olmasını istiyorsak oraya bir ListView ekleyelim. Benim MainActivity’imde bir ListView mevcut. content_main.xml şu şekilde:

Adım 6 – Kullanalım

Şimdi MainActivity.java sınıfımda ListView, ListAdapter ve kişiler listemi oluşturdum. Yine deneme amaçlı kullanılan resimleri GitHub hesabımdan edinebilirsiniz. İçeriği şu şekilde:

 

Adım 7 – Sonuç

Uygulamamızı çalıştırdığımızda görünüm şu şekilde olacaktır:

device-2016-03-10-012342

Artık Android uygulamalarımız için görsel olarak iyileştirilmiş listeler oluşturabiliriz.
Projeye ait tüm kodları GitHub hesabımdan elde edebilirsiniz.

2 Comments

  1. YAKUP

    Merhabalar, gerçekten çok anlaşılır bir dille açıklamışsınız teşekkürler.

    bu listeyi uygulamamda kullanmaya karar verdim, fakat “kisilerin” herhangi bir elemanına erişemedim, setOnItemClickListener ile eklenen kişinin adına erişmek için nasıl bir yol izlemeyeliyim

    • Nihat Yıldız

      gerçekten banada lazım

      setOnItemClickListener ile şehri veyada yazılım dilini nasıl çekebiliriz bilen biri yardımcı olsun lütfen uzun süre araştırmama rağmen düzgün bir kaynak bulamadım

Bir Cevap Yazın

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