Bu yerleşimi yapmak için önce ihtiyacımız
olan görünümler üzerine düşünelim.
Bunun tümünün yapılmak için hazır
olduğunu varsayacağım ve
yerleşimimize eklememiz gereken
yeni şeyler hakkında konuşacağız.
Eklememiz gereken iki yeni
görünüm, Malzemeler için MetinGörünümü
ve Köpük krema için
OnayKutucuğu görünümüdür.
Bu görünümün Android içinde var olduğunu
muhtemelen bilmiyordunuz ama neyse ki
bir Google aramasıyla
cevabı bulabiliriz.
2. adıma geçelim,
görünümleri konumlandırmamız gerek.
Bu görünümlerin doğru biçimde
konumlandırıldığını varsayarak,
Malzemeler ve Köpük krema'yı
dikey olarak aynı sıraya eklemeliyiz.
Ana görünüm bir dikey çizgisel yerleşim
olduğundan dolayı, yalnızca
bu iki Görünümü üst kısmına ekliyoruz.
Üçüncü aşamada,
görünümlere biçim vermemiz gerekiyor.
Malzemeler başlığının biçimi
Miktar ve
Sipariş Özeti başlıklarıyla aynı
bu yüzden var olan başlıkları
kopyala yapıştır yapabiliriz.
OnayKutucuğu görünümü yeni olduğu için,
ona da uygun biçimde bir biçim vermeliyiz.
Metin ve kutucuk arasında 24 dp
boşluk bırakmalıyız,
ve Köpük krema'nın yazı tipi büyüklüğünü
16 sp olarak değiştirmeliyiz.
Bu değişiklikleri şimdi de uygulamamızda
yapalım.
Miktar başlığına benzer bir Malzemeler
başlığı eklemek için, kopyala yapıştır
yapabilirim.
Kopyaladım ve sonra bu dikey çizgisel
yerleşimin üst kısmına ekledim.
Pekala, şimdi
iki tane Miktar olduğunu söylüyor.
Metni değiştireceğim ki,
Malzemeler densin.
alt kenar boşluğunu da kopyaladım ki,
başlık ile altındaki içerik arasında
biraz boşluk olsun.
Daha önce uygulamamıza bir OnayKutucuğu
eklemedik bu nedenle
Google'da nasıl
yapılacağını aratacağım.
onay kutucu android
şeklinde arama yapacağım.
Android kelimesini eklemeyi unutmayın
çünkü web ya da
mobil platformların da
onay kutucuğu seçeneği olabilir.
Dediğim şekilde aratırsanız Android
için spesifik sonuçlar elde edersiniz.
İlk linki deneyelim.
Bu, OnayKutucuğu için bir
başvuru kılavuzu.
Aşağıya doğru kaydırıyorum,
sınıfa genel bakış başlığını görüyorum ve
sonra doğruca
XML niteliklerine doğru gidiyor.
Aslında görmek istediğim OnayKutucuğu
için, bazı XML örnekleri bulmaktı.
Arama sonuçlarına geri dönelim.
İkinci linke tıklayalım.
Güzel, bazı OnayKutucuğu
resimleri gösteriyor.
İşte burada bazı
XML'ler var.
Oldukça iyi görünüyor.
Biz çizgisel yerleşim içinde
iki OnayKutucuğu var.
ilk OnayKutucuğu'nu
kopyalayacağım ve
sonra uygulamamıza yapıştıracağım.
Malzemeler metninden önce
ama Miktar metininden sonra bir yere,
işte buraya yapıştıracağım.
XML'de değişiklikler yapacağım çünkü
kullanım durumumuza tam olarak uymuyor.
Hem kimliği hem de metini
buradan kaldıracağım.
Kafeler et satmadığı için,
etin yerine
Köpük krema yazacağım.
Bu arada, daha önce gördüğünüz
@dizi/et,
dizi.xml dosyası içindeki
kaynak diziye gönderme yapıyordu.
Bunun hakkında daha sonra
konuşacağız fakat şimdilik
diziyi doğrudan
buraya yazalım.
Ve gördüğünüz gibi, ön izleme güncellendi
böylece Köpük krema onay kutucuğu oluştu.
Onay kutucuğu'nun en iyi tarafı
size bir kutucuk ve aynı zamanda
bir metin vermesi, böylece
başka bir metin eklemeniz gerekmez.
üstüneTıklama'dan bahseden bu
satıra da ihtiyacımız yok.
Bu kodlama görevi için önemli olan,
onay kutucuğunun burada görünmesidir.
Bu XML'ye ulaşmanın diğer bir yolu,
genel Android görünüm
kopya kağıtlarıdır.
Bu kopya kağıdı, bir dizi
genel Android görünümü listeler ve
aynı zamanda XML örnekleri içerir.
İşte OnayKutucuğu görünümü ve
neye benzediğine ilişkin bir örnek ve
karşılık gelen XML.
XML'yi buradan kopyalayabilir
ve uygulamaya yapıştırabilirdiniz.
Neye benzediğini görmek için,
uygulamamızda yürütelim.
İşte sonuç.
Oldukça iyi görünüyor.
Malzemeler başlığımız ve
bir Köpük krema OnayKutucuğumuz var.
Kutucuğu işaretlediğimizde ayrıca
bu havalı animasyonu da görebiliyoruz.
Burada yine de bir boşluk bırakmayla
ilgili sorun görünüyor.
Miktar başlığı ile Köpük krema
OnayKutucuğu arası
çok dar, ayrıca burada da
yeterince boşluk yok.
Önceden sağlanan kırmızı
çizgilere dönerek,
buraya 24 dp bir boşluk eklemeliyiz ve
yazı tipi boyutunu 16 sp yapmalıyız.
Önce yazı tipi boyutunu değiştireceğim.
android:metinBoyutu yazacağım
sonra boyutu 16 sp yapacağım.
Ön izlemeyi açacağım ve yazı boyutunun
artıp artmadığını kontrol edeceğim
ve ettim.
Yenilendiğinden emin değilseniz,
her zaman bu tuşu kullanabilirsiniz.
Pekala.
Şimdi boşlukları halletmek için
deneme yanılma yöntemiyle
çalıştıracağım.
Kenar boşluğu değerlerini girmeyi denedim
ve sonra dolgu değerlerini girmeyi denedim,
görüldüğü gibi solDolgu kutucuk ile metin
arasındaki boşluğun
oluşmasını sağlıyor.
Şimdi dolguyu ekleyelim.
Harika, metin kenara doğru kaydı.
Bir sorun daha görüyorum yine de.
Burada yeterli dikey boşluk var
ama burada yok.
Bu OnayKutucuğu'na ya alt dolgu
ya da alt boşluk eklemeliyim ya da
bu Miktar başlığına ya üst dolgu
ya da üst boşluk eklemeliyim.
Her iki yöntem de çalışır,
ben Miktar başlığına
üst boşluk ekleyeceğim.
İşte, şimdi daha iyi görünüyor!
Şimdi her şey eşit olarak
boşluklandırılmış görünüyor.
Bunu cihazımdaki
uygulamada yürüteceğim.
İşte uygulama.
Gerçekten iyi görünüyor.
iyi iş başardık.
Uygulamanıza daha çok UI değişikliği
eklemek istediğini zaman, Google araması
yöntemiyle online bilgi edinebilir
ve uygulamanızda uygulayabilirsiniz.