UI Layout trong Android

Khối kiến trúc nền tảng cho giao diện UI là một đối tượng View được tạo từ lớp View và chiếm một khu vực hình chữ nhật trên màn hình và chịu trách nhiệm để vẽ và xử lý sự kiện. View là lớp cơ sở cho Widget, mà được sử dụng để tạo các thành phần UI có tính tương tác như button, các trường text, …

ViewGroup là một lớp con của View và cung cấp Container vô hình mà giữ các View khác hoặc các ViewGroup khác và định nghĩa các thuộc tính Layout của chúng.

Tại tầng thứ ba, chúng ta có nhiều Layout khác nhau mà là lớp phụ của lớp ViewGroup và một Layout đặc trưng định nghĩa cấu trúc nhìn thấy cho một giao diện UI trong Android và có thể được tạo hoặc tại runtime bởi sử dụng các đối tượng View/ViewGroup hoặc bạn có thể khai báo Layout của bạn bởi sử dụng XML file đơn giản là main_Layoutxml, được đặt trong thư mục res/layout của Project.

Layout params

Chương này hướng dẫn chi tiết về cách tạo GUI của bạn dựa trên Layout được định nghĩa bên trong XML file. Một Layout có thể chứa bất cứ kiểu Widget nào như Button, Label, Textbox, … Dưới đây là một ví dụ đơn giản về XML file có LinearLayout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="vertical" >
   
   <TextView android:id="@+id/text"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="This is a TextView" />
      
   <Button android:id="@+id/button"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="This is a Button" />
      
   <!-- More GUI components go here  -->
   
</LinearLayout>

Khi Layout của bạn đã được tạo, bạn có thể tải layout resource từ phần code ứng dụng, trong triển khai phương thức callback của bạn là Activity.onCreate(), như sau: −

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

Các loại Layout trong Android

Android cung cấp một số Layout để bạn sử dụng trong hầu hết các ứng dụng Android để cung cấp cái nhìn và cảm nhận khác nhau:

Các thuộc tính của Layout trong Android

Mỗi Layout có một tập hợp các thuộc tính mà định nghĩa các thuộc tính mang tính thị giác cho Layout Có một số thuộc tính chúng cho tất cả các Layout và cũng có một số thuộc tính riêng cho một Layout cụ thể. Dưới đây là một số thuộc tính chung và sẽ được áp dụng cho tất cả Layout:

Ở đây, width và height là kích cỡ của Layout/View mà có thể được xác định theo dp (Density-independent pixel), sp (Scale-independent pixel), pt (các point là 1/72 inch), px (pixel), mm (mili met), và in (inch).

Bạn có thể xác định width và height với các ước lượng khá chính xác, nhưng thường xuyên hơn, bạn sẽ sử dụng một trong những hằng sau để thiết lập width và height: −

• android:layout_width=wrap_content Nói cho view của bạn tự sắp xếp kích cỡ được yêu cầu bởi nội dung của nó.

• android:layout_width=fill_parent Nói cho view của bạn trở nên lớn bằng view cha của nó.

Thuộc tính gravity đóng vai trò quan trọng trong việc đặt vị trí cho đối tượng view và nó có thể nhận một hoặc nhiều (được phân biệt bởi |) các giá trị hằng sau:

View ID trong Android

Một đối tượng View có thể có một ID duy nhất được gán tới nó, mà sẽ nhận diện View đó một cách duy nhất bên trong cấu trúc cây. Cú pháp cho một ID, bên trong một thẻ XML là: −

android:id="@+id/my_button"

Sau đây là miêu tả ngắn gọn về các ký hiệu @ và +: −

• Biểu tượng @ tại phần đầu của chuỗi chỉ rằng XML Parser nên phân tích cú pháp và mở rộng phần còn lại của chuỗi ID và nhận diện nó như là một ID resource.

• Biểu tượng + nghĩa rằng đây là một tên resource mới mà phải được tạo và được thêm tới các Resource của chúng ta. Để tạo một sự thể hiện của đối tượng View và bắt nó từ Layout, sử dụng cú pháp sau: −

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

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Các bạn có thể mua thêm khóa học JAVA CORE ONLINE VÀ ỨNG DỤNG cực hay, giúp các bạn vượt qua các dự án trên trường và đi thực tập Java. Khóa học có giá chỉ 300K, nhằm ưu đãi, tạo điều kiện cho sinh viên cho thể mua khóa học.

Nội dung khóa học gồm 16 chuơng và 100 video cực hay, học trực tiếp tại https://www.udemy.com/tu-tin-di-lam-voi-kien-thuc-ve-java-core-toan-tap/ Bạn nào có nhu cầu mua, inbox trực tiếp a Tuyền, cựu sinh viên Bách Khoa K53, fb: https://www.facebook.com/tuyen.vietjack

Follow facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.