Get Started. It's Free
or sign up with your email address
Layout by Mind Map: Layout

1. Constraint Layout

1.1. là dạng layout mà các view nằm trong đó sẽ được xác định vị trí tương đối với các view khác

1.2. Định vị các views

1.2.1. layout_constraintTop_toTopOf/toBottomOf: Ràng buộc phần trên (top) của view hiện tại đến phần trên/)/phần dưới của view khác.

1.2.2. layout_constraintBottom_toTopOf /toBottomOf : Ràng buộc phần dưới của view hiện tại đến phần trên/phần dưới của view khác.

1.2.3. layout_constraintLeft_toLeftOf /toRightOf: ràng buộc bên trái của view hiện tại với bên trái/bên phải của view khác

1.2.4. layout_constraintRight_toLeftOf /toRightOf: ràng buộc bên phải của view hiện tại với bên trái/bên phải của view khác

1.2.5. Start, End: ta có thể dùng Start để thay thế cho Left và dùng End để thay thế cho Right. Lưu ý rằng, khi dùng Start thì phải dùng Start hay End tương ứng, không được dùng Start kết hợp với Left hay Right.

1.2.6. layout_constraintHorizontal_bias: Định vị view theo trục ngang màn hình.

1.2.7. layout_constraintVertical_bias: Định vị view theo trục dọc màn hình.

1.3. Bias

1.3.1. Là mức độ ưu tiên

1.3.2. Giá trị của bias nằm trong khoảng từ 0 đến 1 và có kiểu Float

1.3.3. Thuộc tính này chỉ có tác dụng khi View đang neo 2 cạnh đối diện hoặc cả 4 cạnh

1.3.4. nếu giá trị bias không được chỉ định thì bias sẽ có giá trị mặc định là 0.5

1.4. GuideLine

1.4.1. là một đường kẻ ẩn trong ConstraintLayout nằm ngang hoặc đứng nó như là một View con để các View khác ràng buộc đến nếu muốn

1.4.2. Kẻ ngang: android:orientation="horizontal"

1.4.3. Kẻ đứng: android:orientation="vertical"

1.4.4. Vị trí: app:layout_constraintGuide_percent percent: 0.1, 0.2, ...

1.5. Chain

1.5.1. Các View ràng buộc qua lại các cạnh tiếp giáp nhau sẽ tạo thành một xích các View

1.5.2. 2 loại

1.5.2.1. app:layout_constraintHorizontal_chainStyle

1.5.2.2. app:layout_constraintVertical_chainStyle

1.5.2.3. 3 kiểu: spread/packed/spread_inside

2. Relative Layout

2.1. Là dạng layout mà các view con được xác định vị trí bởi các mối liên hệ với view cha hoặc với các view con khác.

2.2. Khi các view con được đưa vào chưa có thiết lập mối liên hệ qua lại nào với phần tử cha hay với phần tử view con khác thì nó sẽ được định vị ở góc trên - trái.

2.3. Một số thuộc tính riêng

2.3.1. android: id (ID của Layout)

2.3.2. android:gravity (căn lề)

2.3.3. android:ignoreGravity (chỉ ra view nào không bị tác động bởi gravity)

2.4. Định vị view con bằng mối liên hệ với view cha

2.4.1. android:layout_alignParentBottom/layout_alignParentTop (căn thẳng cạnh dưới/trên view con với cạnh dưới view cha)

2.4.2. android:layout_alignParentLeft/layout_alignParentRight (căn thẳng cạnh trái/phải view con với cạnh trái view cha)

2.4.3. android:layout_centerInParent (căn view con vào giữa view cha)

2.4.4. android:layout_centerHorizontal (căn view con vào giữa view cha theo chiều ngang)

2.4.5. android:layout_centerVertical (căn view con vào giữa view cha theo chiều dọc)

2.5. Định vị view con bằng mối liên hệ giữa chúng với nhau

2.5.1. android:layout_below/layout_above (nằm dưới/trên view con có ID được chỉ định)

2.5.2. android:layout_toLeftOf/layout_toRightOf (nằm bên trái/phải view con có ID được chỉ định)

2.5.3. android:layout_alignBottom/layout_alignTop (nằm thẳng cạnh dưới/trên với cạnh dưới/trên của view có ID được chỉ định)

2.5.4. android:layout_alignLeft/layout_alignRight (nằm thẳng cạnh trái/phải với cạnh trái/phải của view có ID được chỉ định)

3. FrameLayout

3.1. Là một view group thuộc loại layout đơn giản, được sử dụng để khoanh vùng một khu vực nào đó để hiển thị duy nhất một view con

3.2. Thuộc tính

3.2.1. android:id (ID duy nhất để nhận diện layout)

3.2.2. android:foreground (xác định drawable để vẽ lên nội dung và giá trị có thể có thể là một trong các giá trị màu dưới dạng “#rgb”, “#argb”, “#rrggbb” hoặc “#aarrggbb”)

3.2.3. android: oregroundGravity (xác định gravity để áp dụng cho nền trước có thể vẽ được. Gravity mặc định sẽ lấp đầy, giá trị có thể là trên cùng, dưới cùng, bên trái, bên phải, giữa, center_vertical, center_horizontal…)

3.2.4. android:measureAllChildren (xác định xem có đo lường tất cả children hay chỉ những children ở trạng thái VISIBLE hoặc INVISIBLE, mặc định là FALSE)

4. Grid layout

4.1. GridLayout sử dụng một mạng lưới các dòng mỏng và vô hạn để tách khu vực bản vẽ của nó thành: các hàng, các cột, và các ô (cell)

4.2. Một số thuộc tính như: rowCount, columnCount, size, margin, gravity, alignment... có thể tùy chỉnh được

5. Table Layout

5.1. Sắp xếp các view dưới dạng bảng

5.2. Là một ViewGroup chứa 1 hoặc nhiều TableRow - Table Row chứa các view con

5.3. Thuộc tính

5.3.1. android:stretchColumns: cho phép chỉ định các cột sẽ được kéo dài (stretched) để lấp đầy không gian nằm ngang còn trống của TableLayout.

5.3.2. android:shrinkColumns: chỉ định các cột sẽ bị co lại (shrinked) để tránh việc các View con tràn ra ngoài TableLayout.

5.3.3. android:collapseColumns: chỉ định các cột sẽ bị collapse, nghĩa là chiều rộng của nó cột sẽ là 0, cột sẽ bị ẩn đi.

5.3.4. android:layout_column: được áp dụng cho một View con trong một TableRow để chỉ định chỉ số cột của nó. Các giá trị có thể là 0, 1, 2,...

5.3.5. android:layout_span: áp dụng cho View con để chỉ định số ô liên tiếp trong một TableRow sẽ được hợp nhất với nhau.

5.3.6. android:layout_gravity: được áp dụng cho các View con (của TableRow) để chỉ định vị trí tương đối của nó so với ô chứa nó

5.3.6.1. Trường hợp 1: Nếu thuộc tính android:layout_gravity không được đặt cho View con (Của TableRow), View con sẽ luôn có chiều rộng lấp đầy ô chứa nó: android:layout_width sẽ nhận giá trị MATCH_PARENT.

5.3.6.2. Trường hợp 2: Nếu thuộc tính android:layout_gravity được đặt cho View con (Của TableRow), View con sẽ luôn có chiều rộng mặc định: android:layout_width sẽ nhận giá trị WRAP_CONTENT.

5.3.6.3. Một số vị trí: RIGHT, LEFT, TOP, BOTTOM, START, END, CENTER,...

5.3.7. android:layout_weight: sử dụng cho các View con (của TableRow), chỉ định có bao nhiêu không gian mà View con này sẽ chiếm trong View cha (TableRow) theo chiều ngang

5.3.7.1. Khi tất cả các View con (của TableRow) có android:layout_weight=0, bạn sẽ nhìn thấy một không gian trống trong View cha (TableRow):

5.3.7.2. Các View con có android:layout_weight>0 sẽ chiếm lấy vùng không gian trống của View cha (TableRow):

5.3.7.3. Vùng không gian trống của View cha (TableRow) sẽ được phân bổ cho các View con theo theo tỷ lệ layout_weight của chúng.

6. Linear Layout

6.1. LinearLayout trong Android là một view group, sắp xếp các view con (EditText, Button…) nằm trong nó theo chiều ngang hoặc chiều dọc dựa vào thuộc tính android:orientation.

6.1.1. Khai báo LinearLayout theo chiều dọc: <LinearLayout android:orientation="vertical"> .... </LinearLayout>

6.1.2. Khái báo LinearLayout theo chiều ngang: <LinearLayout android:orientation="horizontal"> .... </LinearLayout>