0:00:00.750,0:00:03.360
Để làm layout này trước tiên[br]nghĩ xem cần chế độ hiển thị nào.

0:00:03.360,0:00:07.420
Giả định là tất cả phần này[br]đã được thiết lập rồi.

0:00:07.420,0:00:10.910
Chỉ cần nói về những điều mới mẻ[br]cần đưa vào layout.

0:00:10.910,0:00:15.030
Có hai hiển thị mới cần chèn[br]TextView Các loại nhân phủ

0:00:15.030,0:00:18.090
hiển thị ô đánh dấu[br]cho tiêu đề Kem sữa béo.

0:00:18.090,0:00:21.470
Có thể bạn chưa biết[br]hiển thị ô đánh dấu đã có trong Android

0:00:21.470,0:00:24.210
nhưng mong khi bạn tìm trên Google[br]bạn sẽ tìm thấy câu trả lời.

0:00:25.380,0:00:28.300
Qua bước 2,[br]cần định vị các hiển thị.

0:00:28.300,0:00:30.820
Giả sử các hiển thị[br]đã định vị chính xác.

0:00:30.820,0:00:35.470
Chỉ cần Các loại nhân phủ và Kem sữa béo[br]chạy theo trục dọc thẳng hàng.

0:00:35.470,0:00:37.000
Vì chế độ hiển thị gốc định vị theo

0:00:37.000,0:00:39.990
bài trí tuyến tính dọc,[br]chỉ cần chèn hai hiển thị này trên nó.

0:00:40.990,0:00:43.580
Bước thứ 3,[br]thiết lập kiểu cho chế độ hiển thị.

0:00:43.580,0:00:46.260
Các kiểu ở tiêu đề Các loại nhân phủ[br]giống kiểu phần tiêu đề Số lượng

0:00:46.260,0:00:49.030
tiêu đề Nhật ký đặt hàng[br]vì thế chỉ cần copy và dán

0:00:49.030,0:00:51.434
các tiêu đề hiện có.

0:00:51.434,0:00:54.920
Nhưng hiển thị ô đánh dấu là chế độ mới[br]cho nên cần phải định kiểu cho nó.

0:00:54.920,0:00:59.176
Nên để 24dp khoảng trống[br]ở giữa ô đánh dấu và văn bản

0:00:59.176,0:01:04.054
nên thay đổi kích cỡ phông chữ của[br]chữ Kem sữa béo thành 16 sp. sp.

0:01:04.054,0:01:05.910
Thực thi các thay đổi này lên ứng dụng.

0:01:07.180,0:01:11.020
Chèn tiêu đề Các loại nhân phủ giống[br]tiêu đề Số lượng

0:01:11.020,0:01:12.730
copy dán đoạn code này.

0:01:12.730,0:01:16.775
Tôi sao chép và chèn đoạn code ở trên[br]của bài trí tuyến tính dọc.

0:01:18.080,0:01:20.170
Được rồi[br]Ở đây hiển thị chữ Số lượng hai lần.

0:01:20.170,0:01:22.960
Tôi sẽ thay đổi nội dung[br]để ghi Các loại nhân phủ.

0:01:22.960,0:01:25.380
Tôi cũng sao chép code lề dưới này qua

0:01:25.380,0:01:28.790
để tạo khoảng trống[br]giữa tiêu đề này và nội dung dưới.

0:01:30.260,0:01:32.660
Chúng ta chưa chèn ô đánh dấu[br]vào ứng dụng.

0:01:32.660,0:01:33.990
Tôi sẽ Google xem hướng dẫn.

0:01:33.990,0:01:37.720
Tôi sẽ tìm kiếm[br]android. Checkbox.

0:01:37.720,0:01:40.840
Nhớ nhập thêm từ android[br]vì Google có thể ra kết quả ô đánh dấu

0:01:40.840,0:01:44.850
cho nền tảng khác, ví dụ[br]nền tảng web hoặc nền tảng di động,

0:01:44.850,0:01:48.090
làm thế này bạn sẽ tìm được ngay[br]kết quả tìm kiếm cho nền tảng Android.

0:01:48.090,0:01:49.760
Thử đường dẫn đầu tiên.

0:01:49.760,0:01:52.900
Đây là sưu liệu tham khảo[br]cho lớp ô đánh dầu.

0:01:52.900,0:01:56.420
Tôi kéo trang xuống dưới[br]nhìn hiển thị code tổng quan lớp, khá tốt

0:01:56.420,0:01:58.960
nó trỏ thẳng đến[br]các thuộc tính XML.

0:01:58.960,0:02:02.880
Điều tôi đang cần[br]là một ví dụ XML cho ô đánh dấu.

0:02:02.880,0:02:05.100
Hãy quay trở lại kết quả tìm kiếm.

0:02:05.100,0:02:07.070
Click vào đường dẫn thứ 2.

0:02:07.070,0:02:10.440
Tuyệt vời, trang này hiển thị[br]hình ảnh ô đánh dấu.

0:02:10.440,0:02:12.040
Đây là một số XML.

0:02:12.040,0:02:13.180
Trông được đây.

0:02:13.180,0:02:16.140
Nó có hai ô đánh dấu[br]trong mục LinearLayout.

0:02:16.140,0:02:19.070
Tôi chỉ cần copy[br]ô đánh dấu đầu tiên

0:02:19.070,0:02:20.330
sau đó dán vào ứng dụng.

0:02:21.590,0:02:25.912
Trở lại ứng dụng, tôi sẽ dán nó[br]sau tiêu đề Các loại nhân phủ

0:02:25.912,0:02:28.753
nhưng trước tiêu đề Số lượng, ngay đây.

0:02:28.753,0:02:33.040
Tôi sẽ điều chỉnh XML[br]vì nó không phù hợp với bài tập đang dùng.

0:02:33.040,0:02:36.710
Tôi sẽ bỏ mã ID[br]và phần nội dung văn bản ở đây.

0:02:36.710,0:02:39.750
Thay vì ghi là thịt[br]quán cafe không bán thịt.

0:02:39.750,0:02:41.660
Tôi sẽ nhập nội dung là Kem sữa béo.

0:02:43.030,0:02:45.940
Nhân tiện, những gì bạn thấy lúc nãy[br]tức là cú pháp @string/meat,

0:02:45.940,0:02:50.410
có liên quan đến tài nguyên[br]trong file string.xlm.

0:02:50.410,0:02:52.690
Chúng ta sẽ nói về nó, nhưng để sau[br]còn bây giờ,

0:02:52.690,0:02:55.550
bạn chỉ cần nhập vào chuỗi này[br]trực tiếp ở đây.

0:02:55.550,0:02:59.350
Xem kìa, bản xem trước cập nhật[br]có một ô đánh dấu ghi là Kem sữa béo.

0:02:59.350,0:03:03.380
Chế độ hiển thị ô đánh dấu này hay ở chỗ[br]nó cung cấp cho bạn một ô,

0:03:03.380,0:03:08.100
bên cạnh có luôn phần nội dung[br]bạn khỏi chèn thêm hiển thị văn bản.

0:03:08.100,0:03:10.850
Không cần dòng này[br]onClick. Here nói về onClick.

0:03:12.089,0:03:16.500
Cần quan tâm trong bài tập code này[br]là làm sao ô đánh dấu xuất hiện.

0:03:16.500,0:03:20.260
Một cách khác để tìm ra XML này

0:03:20.260,0:03:21.900
là cheat sheet hiển thị Android phổ biến.

0:03:22.540,0:03:25.410
Cheat sheet này liệt kê một loạt[br]hiển thị Android phổ biến

0:03:25.410,0:03:27.460
ngoài ra còn cho ví dụ XML nữa.

0:03:28.480,0:03:32.739
Đây là hiển thị ô đánh dấu[br]ví dụ này để bạn hiểu nó sẽ ra sao

0:03:32.739,0:03:34.125
bên cạnh đây là các XML tương ứng.

0:03:34.125,0:03:37.270
Bạn có thể copy XML từ đây[br]rồi dán nó vào ứng dụng.

0:03:38.340,0:03:41.010
Trở lại với Android Studio[br]chạy ứng dụng xem nó trông ra sao.

0:03:42.480,0:03:43.320
Đây rồi.

0:03:43.320,0:03:44.050
Cũng được đó.

0:03:44.050,0:03:46.695
Có tiêu đề Các loại nhân phủ[br]và ô đánh dấu Kem sữa béo.

0:03:47.750,0:03:50.350
Cũng có hiệu ứng động rất thú vị[br]khi đánh dấu tích vào ô đánh dấu.

0:03:51.360,0:03:54.790
Vấn đề duy nhất mà tôi nhận ra[br]là không thấy có khoảng trống.

0:03:54.790,0:03:57.840
Ví dụ, chỗ này quá chật chội[br]giữa tiêu đề Số lượng

0:03:57.840,0:04:01.390
với ô đánh dấu Kem sữa béo[br]Ở đây không đủ khoảng trống ở giữa.

0:04:02.410,0:04:04.480
Trở lại đường minh họa màu đỏ[br]đã vẽ ở đầu bài.

0:04:04.480,0:04:09.370
Cần chèn 24 dp khoảng trống ở đây[br]sau đó thay đổi cỡ chữ về mức 16sp.

0:04:10.830,0:04:12.960
Đầu tiên, thay đổi kích thước phông chữ.

0:04:12.960,0:04:18.110
Gõ Android: textSize [Kích thước chữ][br]sau đó cho kích thước 16sp.

0:04:18.110,0:04:22.043
Tôi sẽ mở chế độ xem trước ở đây[br]kiểm tra xem kích thước đã tăng hay chưa.

0:04:22.043,0:04:23.690
Xong rồi.

0:04:23.690,0:04:26.600
Kiểm tra xem trang đã refresh[làm mới][br]bạn có thể sử dụng nút này.

0:04:26.600,0:04:27.430
Được rồi.

0:04:27.430,0:04:29.950
Để xử lý phần trống này[br]tôi thực sự đã làm được

0:04:29.950,0:04:32.240
thông qua nhiều lần làm thử và mắc lỗi.

0:04:32.240,0:04:34.370
Tôi đã đặt giá trị canh lề

0:04:34.370,0:04:38.340
sau đó đặt giá trị khoảng đệm,[br]tôi phát hiện có paddingLeft [đệm trái]

0:04:38.340,0:04:42.520
Sẽ điều chỉnh khoảng trắng[br]giữa ô đánh dấu và nội dung ở đây.

0:04:42.520,0:04:43.520
Bây giờ chèn khoảng đệm.

0:04:44.900,0:04:46.960
Hay quá, văn bản đã dịch sang một bên.

0:04:46.960,0:04:49.040
Tôi vẫn thấy có một vấn đề.

0:04:49.040,0:04:53.090
Đã có đủ khoảng cách chiều dọc ở đây[br]nhưng chỗ này không đủ chỗ chiều dọc.

0:04:53.090,0:04:57.760
Hoặc tôi sẽ chèn khoảng đệm dưới[br]tức là lề dưới cho hiển thị ô đánh dấu

0:04:57.760,0:05:01.720
hoặc tôi sẽ chèn khoảng đệm trên[br]tức là lề trên cho tiêu đề Số lượng.

0:05:01.720,0:05:02.620
Làm cách nào cũng được.

0:05:02.620,0:05:07.110
Tôi sẽ chèn lề trên[br]cho tiêu đề Số lượng.

0:05:07.110,0:05:08.880
Đấy! Tốt rồi!

0:05:08.880,0:05:10.990
Bây giờ mọi thứ có vẻ khá đồng đều.

0:05:10.990,0:05:12.790
Chạy thử ứng dụng trên thiết bị của tôi.

0:05:14.210,0:05:15.170
Và đây là ứng dụng.

0:05:15.170,0:05:16.320
Trông được lắm.

0:05:16.320,0:05:17.460
Làm tốt rồi.

0:05:17.460,0:05:21.250
Khi bạn cần thay đổi giao diện người dùng[br]trong ứng dụng, có thể làm theo kiểu này

0:05:21.250,0:05:25.360
hãy lên Google tìm kiếm thông tin[br]sau đó đưa vào ứng dụng.