Android Studio: Layout Layar

Sumber: https://developer.android.com/guide/topics/ui/declaring-layout.html

Layout mendefinisikan struktur virtual untuk interface user, seperti UI untuk activity atau app widget. Kita dapat mendeklarasikan layout dengan dua cara:

• Deklarasikan elemen UI elements di XML. Android memberikan vocabulary XML yang straightforward XML yang berhubungan dengan class View dan subclass, seperti untuk widget dan layout.
• Inisiasi layout elemen saat runtime. Aplikasi kita dapat menggunakan program membuat objek View dan ViewGroup (dan memanipulasi property-nya).

Framework Android memberikan kita flexibilitas untuk menggunakan ke dua metoda tersebut untuk mendeklarasikan dan memanaje UI aplikasi kita. Contoh, kita dapat mendeklarasikan default layout aplikasi kita di XML, termasuk elemen screen yang akan muncul di dalamnya termasuk property-nya. Kemudian, kita dapat menambahkan code di aplikasi kita yang dapat memodifikasi kondisi screen object, termasuk deklarasi di XML sambil berjalan.

   The ADT Plugin for Eclipse offers a layout preview of your XML — with the XML file opened, select the Layout tab.
   You should also try the Hierarchy Viewer tool, for debugging layouts — it reveals layout property values, draws wireframes with padding/margin indicators, and full rendered views while you debug on the emulator or device.
   The layoutopt tool lets you quickly analyze your layouts and hierarchies for inefficiencies or other problems.

Keuntungan untuk men-deklarasikan UI anda dalam XML adalah bahwa hal itu memungkinkan anda untuk lebih memisahkan penyajian aplikasi anda dari kode yang mengontrol perilakunya. Deskripsi UI anda menjadi eksternal dari kode aplikasi anda, yang berarti bahwa anda dapat mengubah atau beradaptasi tanpa harus memodifikasi kode sumber dan mengkompilasi ulang. Misalnya, anda dapat membuat layout XML untuk orientasi yang berbeda layar, ukuran layar perangkat yang berbeda, dan bahasa yang berbeda. Selain itu, menyatakan tata letak di XML membuatnya lebih mudah untuk memvisualisasikan struktur UI anda, sehingga lebih mudah untuk masalah debug. Dengan demikian, dokumen ini berfokus pada mengajar anda bagaimana untuk menyatakan tata letak Anda dalam XML.

Secara umum, vocabulary XML untuk menyatakan elemen UI erat mengikuti struktur dan penamaan kelas dan metode, di mana nama elemen sesuai dengan nama kelas dan atribut nama sesuai dengan metode. Bahkan, korespondensi sering begitu langsung yang anda bisa menebak atribut XML tertentu sesuai dengan metode kelas, atau menebak kelas yang sesuai dengan elemen XML yang diberikan. Namun, perlu diketahui bahwa tidak semua vocabulary identik. Dalam beberapa kasus, ada perbedaan penamaan sedikit. Misalnya, unsur EditText memiliki atribut teks yang sesuai dengan EditText.setText ().

Tip: Learn more about different layout types in Common Layout Objects. There are also a collection of tutorials on building various layouts in the Hello Views tutorial guide

Visualization of a view hierarchy with layout parameters associated with each view

Menulis XML

Menggunakan vocabulary Android XML , anda dapat dengan cepat merancang layout UI dan elemen layar yang dikandungnya, dengan cara yang sama anda membuat halaman web di HTML - dengan serangkaian elemen nested.

Setiap file layout harus berisi hanya satu elemen root, yang harus sebuah View atau objek ViewGroup. Setelah anda mendefinisikan elemen root, anda dapat menambahkan objek layout tambahan atau widget sebagai elemen anak untuk secara bertahap membangun hirarki View yang mendefinisikan layout anda. Sebagai contoh, berikut adalah layout XML yang menggunakan LinearLayout vertikal untuk menampung TextView dan Button:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical" >
    <TextView android:id="@+id/text"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="Hello, I am a TextView" />
    <Button android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello, I am a Button" />
</LinearLayout>

Setelah anda menyatakan layout anda dalam XML, simpan file dengan ekstensi .xml, di res / layout / direktori proyek Android anda, sehingga akan dicompilasi dengan benar.

More information about the syntax for a layout XML file is available in the Layout Resources document.

Me-load XML Resource

Ketika anda mengkompilasi aplikasi anda, setiap file layout XML akan dikompilasi ke dalam View resource. Anda harus memuat layout resource dari kode aplikasi anda, di implementasi Activity.onCreate () callback anda. Dengan melakukan hal tersebut, memanggil setContentView (), akan melewatkan referensi untuk layout resource anda dalam bentuk: R.layout.layout_file_name. Contoh, jika tata letak XML anda disimpan sebagai main_layout.xml, anda akan memuatnya untuk kegiatan Anda seperti:

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main_layout);
}

OnCreate () metode callback dalam Activity anda dipanggil oleh framework Android saat Activity anda diluncurkan (lihat pembahasan tentang siklus hidup, dalam dokumen Activity).

Attribute

Setiap objek View dan ViewGroup mendukung berbagai atribut XML mereka sendiri. Beberapa atribut yang spesifik untuk objek View (misalnya, TextView mendukung atribut textSize), tetapi sifat-sifat ini juga diwarisi oleh objek View yang dapat memperpanjang kelas ini. Beberapa yang umum untuk semua objek View , karena mereka mewarisi dari kelas root View (seperti atribut id). Dan, atribut lain dianggap "parameter layout," yang merupakan atribut yang menggambarkan orientasi layout tertentu dari objek View, seperti yang didefinisikan oleh objek induk ViewGroup .

ID

Setiap objek View mungkin memiliki ID integer yang terkait dengan-nya, untuk secara unik mengidentifikasi View dalam tree. Ketika aplikasi dikompilasi, ID ini dirujuk sebagai integer, tapi ID ini biasanya diberikan dalam file layout XML sebagai string, dalam atribut id. Ini adalah atribut XML yang umum untuk semua objek View (didefinisikan oleh View kelas) dan anda akan sering menggunakannya. Sintaks untuk ID, dalam sebuah tag XML adalah:

android:id="@+id/my_button"

Simbol (@) pada awal string menunjukkan bahwa parser XML harus mengurai dan memperluas sisa ID string dan mengidentifikasinya sebagai ID resource. Plus-simbol (+) berarti bahwa ini adalah nama resource baru yang harus dibuat dan ditambahkan ke resource (dalam file R.java). Ada sejumlah resource ID lainnya yang ditawarkan oleh framework Android. Ketika me-referensi ID resource Android, anda tidak perlu simbol (+), tetapi harus menambahkan paket namespace android, seperti:

android:id="@android:id/empty"

Dengan paket namespace android di install, kita sekarang dapat me-referensi ID dari android.R resource class, bukan class resource lokal.

Dalam rangka menbuat View dan me-referensi-nya dari aplikasi, pola umum adalah untuk:

• Definisikan view/widget di layout file dan set dengan ID yang unik:

   <Button android:id="@+id/my_button"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="@string/my_button_text"/>

• Kemudian buat sebuah instance dari view object dan tangkap hasilnya dari layout (biasanya di onCreate() method):

   Button myButton = (Button) findViewById(R.id.my_button);

Mendefinisikan ID untuk tampilan objek penting saat membuat RelativeLayout. Dalam layout relatif, view sibling (saudara) dapat menentukan layout mereka relatif terhadap view saudara lain, yang direferensikan oleh ID yang unik.

Sebuah ID tidak perlu unik di seluruh tree, tetapi harus unik dalam bagian dari tree yang anda cari (yang sering mungkin seluruh tree, jadi yang terbaik untuk menjadi benar-benar unik bila memungkinkan).

Layout Parameter

Atribut XML layout dengan nama layout_something mendefinisikan parameter layout untuk View yang cocok untuk ViewGroup dimana dia berada.

Setiap class ViewGroup mengimplementasikan nested class sepanjang ViewGroup.LayoutParams. Subclass ini mengandung jenis properti yang menentukan ukuran dan posisi untuk setiap child View, yang sesuai untuk view group. Seperti yang Anda lihat pada gambar, parent view group mendefinisikan parameter layout untuk setiap child View (termasuk child view group).

Visualisasi dari hirarki dengan parameter layout terkait dengan masing-masing view

Perhatikan bahwa setiap LayoutParams subclass memiliki sintaks sendiri untuk menetapkan nilai-nilai. Setiap elemen child harus menentukan LayoutParams yang sesuai untuk induknya, meskipun dapat juga mendefinisikan LayoutParams berbeda untuk child sendiri.

Semua view group memasukan width dan height (layout_width dan layout_height), dan masing-masing view diperlukan untuk mendefinisikan-nya. Banyak LayoutParams juga mencakup opsi margin dan border.

You can specify width and height with exact measurements, though you probably won't want to do this often. More often, you will use one of these constants to set the width or height:

   wrap_content tells your view to size itself to the dimensions required by its content.
   match_parent (named fill_parent before API Level 8) tells your view to become as big as its parent view group will allow.

In general, specifying a layout width and height using absolute units such as pixels is not recommended. Instead, using relative measurements such as density-independent pixel units (dp), wrap_content, or match_parent, is a better approach, because it helps ensure that your application will display properly across a variety of device screen sizes. The accepted measurement types are defined in the Available Resources document.

Referensi

• https://developer.android.com/guide/topics/ui/declaring-layout.html