Thông thường, nếu các bạn thực hiện việc tạo layout thường chúng ta thiết kế ở chế độ màn hình nằm dọc. Khi quay ngang thiết bị có thể giao diện đã tạo hiển thị sẽ không được đẹp hoặc không được tối ưu. Vấn đề đặt ra là chúng ta muốn thiết kế 2 giao diện khác nhau (làm 2 tập tin .xml khác nhau)
Và mong muốn khi người dùng quay dọc màn hình thì sử dụng giao diện thứ nhất, khi người dùng quay ngang màn hình thì tự động sử dụng giao diện thứ 2. Android đã hỗ trợ sẵn để chúng ta thực hiện điều này mà không cần phải code dòng nào.
Ví dụ chúng ta đang muốn thiết kế cùng một màn hình có 2 kiểu hiển thị như sau:
Ví dụ chúng ta đang muốn thiết kế cùng một màn hình có 2 kiểu hiển thị như sau:
Rõ ràng 2 layout trên hoàn toàn khác nhau. Để tạo layout cho trường hợp màn hình nằm ngang cho cùng 1 giao diện, chúng ta thực hiện như sau:
- Tạo thư mục res/layout-land
- Tạo tập tin có cùng tên với tập tin layout đã có cho trường hợp màn hình dọc
Ví dụ trong trường hợp trên chúng ta sẽ tạo 2 tập tin tương ứng nhau như sau:
- res/layout/game-intro.xml
- res/layout-land/game-intro.xml
Và lần lượt viết code xml trong 2 tập tin đó như sau:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:background="@color/background" android:layout_height="fill_parent" android:layout_width="fill_parent" android:padding="30dip" android:orientation="horizontal"> <LinearLayout android:orientation="vertical" android:layout_height="wrap_content" android:layout_width="fill_parent" android:layout_gravity="center"> <TextView android:text="@string/main_title" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_gravity="center" android:layout_marginBottom="25dip" android:textSize="24.5sp" /> <Button android:id="@+id/continue_button" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Continue..." /> <Button android:id="@+id/new_button" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="New Game..." /> <Button android:id="@+id/about_button" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="About..." /> <Button android:id="@+id/exit_button" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Exit..." /> </LinearLayout> </LinearLayout> |
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:background="@color/background" android:layout_height="fill_parent" android:layout_width="fill_parent" android:padding="10dip" android:orientation="vertical"> <LinearLayout android:orientation="vertical" android:layout_height="wrap_content" android:layout_width="fill_parent" android:layout_gravity="center"> <TextView android:text="@string/main_title" android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_gravity="center" android:layout_marginBottom="10dip" android:textSize="30sp" /> </LinearLayout> <LinearLayout android:orientation="horizontal" android:layout_height="wrap_content" android:layout_width="fill_parent" android:layout_gravity="center"> <Button android:id="@+id/continue_button" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="Continue..." /> <Button android:id="@+id/new_button" android:layout_weight="1" android:layout_width="0dp" android:layout_height="wrap_content" android:text="New Game..." /> </LinearLayout> <LinearLayout android:orientation="horizontal" android:layout_height="wrap_content" android:layout_width="fill_parent" android:layout_gravity="center"> <Button android:id="@+id/about_button" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="About..." /> <Button android:id="@+id/exit_button" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="Exit..." /> </LinearLayout> </LinearLayout> |
Comments[ 0 ]
Đăng nhận xét