Java Android – Bài 2: Layout

Java Android – Bài 2: Layout

Hi các bạn,

Trong Android hay cả Swing Java, layout là một thứ ko thể thiếu để chứa đựng các components và hiển thị chúng lên.

Nay ta đi tìm hiểu về Layout trong Android nhé 😀

1/ Mở đầu về Layout

Những Layout mà ta sẽ sử dụng trong Android thường xuyên là:

• LinearLayout: hiển thị view kề nhau theo 2 hướng ngang, dọc.
• GridLayout: hiển thị view dưới dạng table chia cột dòng.
• RelativeLayout: hiển thị view dựa trên 1 view nào đó.

Chúng ta đi tới từng Layout một nhé 😀

2/ LinearLayout

LinearLayoutgiúp chúng ta hiện các views liền kề nhau dựa theo hướng mà ta đã đưa ra sẵn, trong đó có 2 hướng là ngang và dọc:

Khởi tạo LinearLayout:

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
// body
    </LinearLayout>

Ta sẽ sử dụng tới thuộc tính: width và height, match_parent là bằng với màn hình cha hiện tại.

Ngoài ra còn 1 thuộc tính quan trọng là orientation(hướng): vertical(dọc) và horizontal(ngang)

Các bạn có thể khởi tạo TextView và vào xem nó hiển thị theo hướng ngay 😀

3/ GridLayout

Là một dạng giúp ta hiển thị views theo cột, vd 5 cột 2 dòng,…

Khởi tạo GridLayout:

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
    android:rowCount="2"
>
// Body
</GridLayout>

Các views trong GridLayout ta thêm vào bình thường và sẽ tự động được sắp xếp cột dòng từ trái qua phải như sau:

1 2

3 4

Ngoài ra ta cũng có thể set cố định với 2 thuộc tính:

• android:layout_column
• android:layout_row

4/ Relative Layout

Là một dạng layout mà 1 views muốn hiện phải phụ thuộc vào 1 views/parents nào đó.

Khởi tạo Relative Layout:

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center">
           // Body 

    </RelativeLayout>

SET 1 views phụ thuộc vào parent:

<CheckBox
            android:id="@+id/chkA"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:text="@string/choice" />

Và nếu các views khác muốn phụ thuộc vào checkbox A, thì fải đặt ID cho checkbox này trước, và sau đó ta áp dụng vào:

<CheckBox
            android:id="@+id/chkB"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@id/chkA"
            android:layout_marginLeft="@dimen/choice_margin"
            android:layout_toRightOf="@id/chkA"
            android:text="@string/choice" />

Đây là checkbox B dựa vào A, hiển thị bên phải của A.

Vậy nên các thuộc tính ta sẽ thường xuyên dùng là:

• layout_toRightOf
• layout_toLeftOf
• layout_below
• layout_above
• layout_alignBaseline: set views cùng hàng với với views nào đó.

5/ Lưu ý và tổng kết

Các bạn nên sử dụng LinearLayout bọc ngoài parent nhé, đây là 1 cách đơn giản để ta có thể set các layout khác dễ dàng hơn

Đối với từng chức năng, design riêng biệt mà ta sẽ cần các loại khác nhau, các bạn lưu ý điều này nhé 😀

Cám ơn các bạn đã quan tâm!