Chương 3: Thiết kế giao diện
3.3 Các kiểu Layout:
LayoutManager (thường gọi là layout) là mở rộng của lớp ViewGroup, được thiết
kế để điều chỉnh vị trí của các control trên màn hình ứng dụng. Layout có thể lồng nhau để tạo nên các giao diện phức tạp. Android có một số các layout đơn giản giúp xây dựng UI. Để tạo nên một bố cục hợp lý thì nên kết hợp các layout với nhau.
Các lớp layout cơ bản:
• FrameLayout: là layout đơn giản nhất trong Layout Manager, FrameLayout đặt mỗi
View con vào góc trái trên của màn hình. Việc thêm nhiều control sẽ chồng một cái mới lên trên cái trước đó.
• LinearLayout: thêm mỗi View theo một đường thẳng, theo chiều dọc hoặc ngang.
Một layout theo chiều dọc sẽ có một control trên một dịng, layout theo chiều ngang chỉ có một dịng cho nhiều View. Nó cho phép chỉ định giá trị “weight” cho mỗi View con để điều chỉnh kích thước bên trong khơng gian cho phép.
• RelativeLayout: dùng để định vị trí cho các View cân xứng với các control khác cũng
• TableLayout: giúp bố trí các View theo một lưới có các dịng và các cột. Các cột có
thể được thiết lập để co lại hoặc giản ra.
• AbsoluteLayout: trong layout này, vị trí mỗi View sẽ là tọa độ tuyệt đối, đảm bảo bố
cục chính xác cho các thành phần. Do đó, khơng thể có được sự linh hoạt đối với các màn hình có kích thước khác nhau.
Sử dụng Layout
Để sử dụng layout người ta thường dùng phương pháp là sử dụng resource bên ngoài từ file XML. Một layout XML phải chứa một nút gốc. Nút gốc này có thể chứa các layout và các View lồng nhau để xây dựng nên các giao diện phức tạp.
Hình 10 - Hệ thống các view với các thơng số layout được kết nối với mỗi view
Ví dụ: File XML sau mơ tả một layout đơn giản bao gồm một TextView ở trên và một EditText sử dụng LinearLayout bố trí theo chiều đứng:
<?xml version=”1.0” encoding=”utf-8”?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android” android:orientation=”vertical”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”>
<TextView
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”Enter Text Below”
/>
<EditText
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”Text Goes Here!”
/> </LinearLayout>
Tuy nhiên, cũng có thề tạo các layout bằng code. Ví dụ:
LinearLayout ll = new LinearLayout(this); ll.setOrientation(LinearLayout.VERTICAL);
TextView myTextView = new TextView(this); EditText myEditText = new EditText(this); myTextView.setText(“Enter Text Below”); myEditText.setText(“Text Goes Here!”);
int lHeight = LinearLayout.LayoutParams.FILL_PARENT; int lWidth = LinearLayout.LayoutParams.WRAP_CONTENT;
ll.addView(myEditText, new LinearLayout.LayoutParams(lHeight, lWidth));
setContentView(ll);