Tajriba ishi №3

Tajriba ishi №3
Android platformasida foydalanuvchi grafik interfeysini yaratish (Androidda layoutlardan foydalanish)
Ushbu darsda Android Studio Layout Editor-dan layout yaratish uchun qanday foydalanishni o'rganamiz.
Android ilovasi uchun foydalanuvchi interfeysi (UI) layouts va widgets ierarxiyasi sifatida qurilgan. 
Layoutlar - bu ViewGroup obyektlari, ularning bola(child) views-i ekranda qanday joylashishini boshqaruvchi konteynerlar. Vidjetlar(Widgets) - bu View ob'ektlari, tugma va matn kabi foydalanuvchi interfeysi komponentlari.
Android ViewGroup va View sinflari uchun XML - ni taqdim etadi, shuning uchun sizning interfeysingizning ko'p qismi XML fayllarida aniqlanadi. Ammo, sizga XML yozishni o'rgatish o'rniga, ushbu va keyingi darslarda sizga Android Studio-ning Layout Editor-dan foydalanib maket(layout) yaratishni ko'rsataman. O'zingizning maket(layout)ingizni yaratish uchun ko'rinishlarni sudrab tashlaganingizda Layout Editor tahrirlovchisi sizga XML kodini o'zi o'zgartiradi.

Layout Editor-ni ochish.

Quyidagilarni ketma-ket bajaring:
1) Project oynasida app > res > layout > activity_main.xml - ni oching.

2) Layout Editor-ga joy ajratish uchun Project oynasini yashiring. Buning uchun View > Tool Windows > Project -ni tanlang yoki shunchaki Android Studio ekranining chap qismidagi Project tugmasini bosing.

Project-ni bosing

3) Design yorlig'ini bosing.


4) Select Design Surface - ni bosing va Blueprint - ni tanlang.


Select Design Surface - ni bosing va Blueprint - ni tanlang.

5) Layout Editor-ning asboblar panelidagi Show - ni bosing va Show All Constraints belgilanganligiga ishonch hosil qiling.

6) Autoconnect o'chirilganligiga ishonch hosil qiling. Autoconnect o'chirilgan bo'lsa, quyidagicha bo'ladi:

Autoconnect o'chirilgan. Uni yoqib qo'ymang

7) Asboblar panelidagi Default Margins tugmachasini bosing va 16-ni tanlang. Agar kerak bo'lsa, keyinchalik har bir ko'rinish uchun chegaralarni sozlashingiz mumkin.

16-ni yozib Enter-ni bosing
8) Asboblar panelidagi Device for Preview - ni bosing va 5.5, 1440 × 2560, 560 dpi (Pixel XL) - ni tanlang.


Agar xohlasangiz boshqa qurilmani tanlang
Sizning Layout Editor-ingiz endi quyidagidek ko'rinadi:

Pastki chap tomondagi Component Tree paneli ko'rinishlarning ierarxiyasini ko'rsatadi. Bizni holatda, ildiz ko'rinishi ConstraintLayout bo'lib, u faqat bitta TextView ob'ektini o'z ichiga oladi.

Component Tree-ni bosing