YouTube

Got a YouTube account?

New: enable viewer-created translations and captions on your YouTube channel!

Vietnamese subtitles

← 13-02 Adding a CheckBox - Solution

Get Embed Code
13 Languages

Showing Revision 1 created 10/10/2015 by sp8.

  1. Để làm layout này trước tiên
    nghĩ xem cần chế độ hiển thị nào.
  2. Giả định là tất cả phần này
    đã được thiết lập rồi.
  3. Chỉ cần nói về những điều mới mẻ
    cần đưa vào layout.
  4. Có hai hiển thị mới cần chèn
    TextView Các loại nhân phủ
  5. hiển thị ô đánh dấu
    cho tiêu đề Kem sữa béo.
  6. Có thể bạn chưa biết
    hiển thị ô đánh dấu đã có trong Android
  7. nhưng mong khi bạn tìm trên Google
    bạn sẽ tìm thấy câu trả lời.
  8. Qua bước 2,
    cần định vị các hiển thị.
  9. Giả sử các hiển thị
    đã định vị chính xác.
  10. Chỉ cần Các loại nhân phủ và Kem sữa béo
    chạy theo trục dọc thẳng hàng.
  11. Vì chế độ hiển thị gốc định vị theo
  12. bài trí tuyến tính dọc,
    chỉ cần chèn hai hiển thị này trên nó.
  13. Bước thứ 3,
    thiết lập kiểu cho chế độ hiển thị.
  14. Các kiểu ở tiêu đề Các loại nhân phủ
    giống kiểu phần tiêu đề Số lượng
  15. tiêu đề Nhật ký đặt hàng
    vì thế chỉ cần copy và dán
  16. các tiêu đề hiện có.
  17. Nhưng hiển thị ô đánh dấu là chế độ mới
    cho nên cần phải định kiểu cho nó.
  18. Nên để 24dp khoảng trống
    ở giữa ô đánh dấu và văn bản
  19. nên thay đổi kích cỡ phông chữ của
    chữ Kem sữa béo thành 16 sp. sp.
  20. Thực thi các thay đổi này lên ứng dụng.
  21. Chèn tiêu đề Các loại nhân phủ giống
    tiêu đề Số lượng
  22. copy dán đoạn code này.
  23. Tôi sao chép và chèn đoạn code ở trên
    của bài trí tuyến tính dọc.
  24. Được rồi
    Ở đây hiển thị chữ Số lượng hai lần.
  25. Tôi sẽ thay đổi nội dung
    để ghi Các loại nhân phủ.
  26. Tôi cũng sao chép code lề dưới này qua
  27. để tạo khoảng trống
    giữa tiêu đề này và nội dung dưới.
  28. Chúng ta chưa chèn ô đánh dấu
    vào ứng dụng.
  29. Tôi sẽ Google xem hướng dẫn.
  30. Tôi sẽ tìm kiếm
    android. Checkbox.
  31. Nhớ nhập thêm từ android
    vì Google có thể ra kết quả ô đánh dấu
  32. cho nền tảng khác, ví dụ
    nền tảng web hoặc nền tảng di động,
  33. làm thế này bạn sẽ tìm được ngay
    kết quả tìm kiếm cho nền tảng Android.
  34. Thử đường dẫn đầu tiên.
  35. Đây là sưu liệu tham khảo
    cho lớp ô đánh dầu.
  36. Tôi kéo trang xuống dưới
    nhìn hiển thị code tổng quan lớp, khá tốt
  37. nó trỏ thẳng đến
    các thuộc tính XML.
  38. Điều tôi đang cần
    là một ví dụ XML cho ô đánh dấu.
  39. Hãy quay trở lại kết quả tìm kiếm.
  40. Click vào đường dẫn thứ 2.
  41. Tuyệt vời, trang này hiển thị
    hình ảnh ô đánh dấu.
  42. Đây là một số XML.
  43. Trông được đây.
  44. Nó có hai ô đánh dấu
    trong mục LinearLayout.
  45. Tôi chỉ cần copy
    ô đánh dấu đầu tiên
  46. sau đó dán vào ứng dụng.
  47. Trở lại ứng dụng, tôi sẽ dán nó
    sau tiêu đề Các loại nhân phủ
  48. nhưng trước tiêu đề Số lượng, ngay đây.
  49. Tôi sẽ điều chỉnh XML
    vì nó không phù hợp với bài tập đang dùng.
  50. Tôi sẽ bỏ mã ID
    và phần nội dung văn bản ở đây.
  51. Thay vì ghi là thịt
    quán cafe không bán thịt.
  52. Tôi sẽ nhập nội dung là Kem sữa béo.
  53. Nhân tiện, những gì bạn thấy lúc nãy
    tức là cú pháp @string/meat,
  54. có liên quan đến tài nguyên
    trong file string.xlm.
  55. Chúng ta sẽ nói về nó, nhưng để sau
    còn bây giờ,
  56. bạn chỉ cần nhập vào chuỗi này
    trực tiếp ở đây.
  57. Xem kìa, bản xem trước cập nhật
    có một ô đánh dấu ghi là Kem sữa béo.
  58. Chế độ hiển thị ô đánh dấu này hay ở chỗ
    nó cung cấp cho bạn một ô,
  59. bên cạnh có luôn phần nội dung
    bạn khỏi chèn thêm hiển thị văn bản.
  60. Không cần dòng này
    onClick. Here nói về onClick.
  61. Cần quan tâm trong bài tập code này
    là làm sao ô đánh dấu xuất hiện.
  62. Một cách khác để tìm ra XML này
  63. là cheat sheet hiển thị Android phổ biến.
  64. Cheat sheet này liệt kê một loạt
    hiển thị Android phổ biến
  65. ngoài ra còn cho ví dụ XML nữa.
  66. Đây là hiển thị ô đánh dấu
    ví dụ này để bạn hiểu nó sẽ ra sao
  67. bên cạnh đây là các XML tương ứng.
  68. Bạn có thể copy XML từ đây
    rồi dán nó vào ứng dụng.
  69. Trở lại với Android Studio
    chạy ứng dụng xem nó trông ra sao.
  70. Đây rồi.
  71. Cũng được đó.
  72. Có tiêu đề Các loại nhân phủ
    và ô đánh dấu Kem sữa béo.
  73. Cũng có hiệu ứng động rất thú vị
    khi đánh dấu tích vào ô đánh dấu.
  74. Vấn đề duy nhất mà tôi nhận ra
    là không thấy có khoảng trống.
  75. Ví dụ, chỗ này quá chật chội
    giữa tiêu đề Số lượng
  76. với ô đánh dấu Kem sữa béo
    Ở đây không đủ khoảng trống ở giữa.
  77. Trở lại đường minh họa màu đỏ
    đã vẽ ở đầu bài.
  78. Cần chèn 24 dp khoảng trống ở đây
    sau đó thay đổi cỡ chữ về mức 16sp.
  79. Đầu tiên, thay đổi kích thước phông chữ.
  80. Gõ Android: textSize [Kích thước chữ]
    sau đó cho kích thước 16sp.
  81. Tôi sẽ mở chế độ xem trước ở đây
    kiểm tra xem kích thước đã tăng hay chưa.
  82. Xong rồi.
  83. Kiểm tra xem trang đã refresh[làm mới]
    bạn có thể sử dụng nút này.
  84. Được rồi.
  85. Để xử lý phần trống này
    tôi thực sự đã làm được
  86. thông qua nhiều lần làm thử và mắc lỗi.
  87. Tôi đã đặt giá trị canh lề
  88. sau đó đặt giá trị khoảng đệm,
    tôi phát hiện có paddingLeft [đệm trái]
  89. Sẽ điều chỉnh khoảng trắng
    giữa ô đánh dấu và nội dung ở đây.
  90. Bây giờ chèn khoảng đệm.
  91. Hay quá, văn bản đã dịch sang một bên.
  92. Tôi vẫn thấy có một vấn đề.
  93. Đã có đủ khoảng cách chiều dọc ở đây
    nhưng chỗ này không đủ chỗ chiều dọc.
  94. Hoặc tôi sẽ chèn khoảng đệm dưới
    tức là lề dưới cho hiển thị ô đánh dấu
  95. hoặc tôi sẽ chèn khoảng đệm trên
    tức là lề trên cho tiêu đề Số lượng.
  96. Làm cách nào cũng được.
  97. Tôi sẽ chèn lề trên
    cho tiêu đề Số lượng.
  98. Đấy! Tốt rồi!
  99. Bây giờ mọi thứ có vẻ khá đồng đều.
  100. Chạy thử ứng dụng trên thiết bị của tôi.
  101. Và đây là ứng dụng.
  102. Trông được lắm.
  103. Làm tốt rồi.
  104. Khi bạn cần thay đổi giao diện người dùng
    trong ứng dụng, có thể làm theo kiểu này
  105. hãy lên Google tìm kiếm thông tin
    sau đó đưa vào ứng dụng.