Relative Layout trong Android



RelativeLayout trong Android cho phép bạn xác định vị trí các view con trong mối quan hệ cân xứng với nhau. Vị trí của mỗi view có thể được xác định tùy theo các phần tử an hem hoặc tùy theo phần tử cha.

Relative trong Android

Relative Layout

Thuộc tính của RelativeLayout trong Android

Bảng dưới liệt kê một số thuộc tính riêng cho RelativeLayout: −

Attribute Miêu tả
android:id Đây là ID mà nhận diện duy nhất Layout đó
android:gravity Xác định cách một đối tượng nên đặt nội dung của nó trên cả hai tọa độ X và Y. Giá trị có thể có là top, bottom, left, right, center, center_vertical, center_horizontal ...
android:ignoreGravity Chỉ rằng View nào không bị tác động bởi thuộc tính gravity

Sử dụng RelativeLayout, bạn có thể căn chỉnh hai phần tử bởi đường viền phải, hoặc làm cho một phần tử ở dưới phần tử khác, đưa vào chính giữa màn hình, chính giữa trái, … Theo mặc định, tất cả view con được vẽ tại top-left của Layout, vì thế bạn phải định nghĩa vị trí của mỗi view bởi sử dụng các thuộc tính đa dạng có sẵn từ lớp RelativeLayout.LayoutParams . Dưới đây là một số thuộc tính quan trọng: −

Attribute Miêu tả
android:layout_above Đặt cạnh dưới của view này ở trên view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name"
android:layout_alignBottom Làm cạnh dưới của view này kết nối với cạnh dưới của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_alignLeft Làm cạnh trái của view này kết nối với cạnh trái của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_alignParentBottom Nếu true, làm cạnh dưới của view này kết nối với cạnh dưới của view cha. Phải là một giá trị Boolean, hoặc "true" hoặc "false"
android:layout_alignParentEnd Nếu true, làm cạnh cuối màn hình của view này kết nối với cạnh cuối màn hình của view cha. Phải là một giá trị Boolean, hoặc "true" hoặc "false"
android:layout_alignParentLeft Nếu true, làm cạnh trái của view này kết nối với cạnh trái của view cha. Phải là một giá trị Boolean, hoặc "true" hoặc "false"
android:layout_alignParentRight Nếu true, làm cạnh phải của view này kết nối với cạnh phải của view cha. Phải là một giá trị Boolean, hoặc "true" hoặc "false"
android:layout_alignParentStart Nếu true, làm cạnh đầu màn hình của view này kết nối với cạnh đầu màn hình của view cha. Phải là một giá trị Boolean, hoặc "true" hoặc "false"
android:layout_alignParentTop Nếu true, làm cạnh trên của view này kết nối với cạnh trên của view cha. Phải là một giá trị Boolean, hoặc "true" hoặc "false"
android:layout_alignRight Làm cạnh phải của view này kết nối với cạnh phải của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_alignStart Làm cạnh đầu màn hình của view này kết nối với cạnh đầu màn hình của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_alignTop Làm cạnh trên của view này kết nối với cạnh trên của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_below Đặt cạnh trên của view này dưới view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_centerHorizontal Nếu true, căn chỉnh giữa view con này theo chiều ngang bên trong view cha. Phải là một giá trị boolean, hoặc "true" hoặc "false"
android:layout_centerInParent Nếu true, căn chỉnh giữa view con này theo chiều ngang và dọc bên trong view cha. Phải là một giá trị boolean, hoặc "true" hoặc "false"
android:layout_centerVertical Nếu true, căn chỉnh giữa view con này theo chiều dọc bên trong view cha. Phải là một giá trị boolean, hoặc "true" hoặc "false"
android:layout_toEndOf Đặt cạnh đầu màn hình của view này tới cạnh cuối màn hình của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_toLeftOf Đặt cạnh phải của view này tới cạnh trái của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_toRightOf Đặt cạnh trái của view này tới cạnh phải của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".
android:layout_toStartOf Đặt cạnh cuối màn hình của view này tới cạnh đầu màn hình của view ID đã cho và phải là một tham chiếu tới resource khác, trong dạng "@[+][package:]type:name".

Ví dụ

Ví dụ sau sẽ đưa bạn qua các bước đơn giản để minh họa cách tạo ứng dụng Android cho riêng bạn bởi sử dụng Relative Layout. Bạn theo các bước đơn giản để sửa đổi ứng dụng Android chúng ta đã tạo trong chương Ví dụ Hello World.

Bước Miêu tả
1 Bạn sử dụng Android Studio IDE để tạo ứng dụng Android với tên Ví dụ Hello World demo dưới một package là com.example.demo hư đã giải thích trong Ví dụ Hello World .
2 Sửa đổi nội dung của res/layout/activity_main.xml file để bao một số Widget trong Relative layout
3 Định nghĩa các hằng cần thiết trong res/values/strings.xml file
4 Chạy ứng dụng để chạy Android Emulator và kiểm tra kết quả các thay đổi đã thực hiện trong ứng dụng

Sau đây là nội dung của Main Activity file đã được sửa đổi: src/com.example.demo/MainActivity.java.

package com.example.demo;

import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;

import android.os.Bundle;
import android.app.Activity;
import android.text.format.DateFormat;
import android.view.Menu;
import android.widget.TextView;

public class MainActivity extends Activity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }
   
   @Override
   public boolean onCreateOptionsMenu(Menu menu) {
      // Inflate the menu;
      getMenuInflater().inflate(R.menu.main, menu);
      return true;
   }
}

Sau đây là nội dung của res/layout/activity_main.xml file:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:paddingLeft="16dp"
   android:paddingRight="16dp" >
   
   <EditText
      android:id="@+id/name"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:hint="@string/reminder" />
      
   <LinearLayout
      android:orientation="vertical"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:layout_alignParentStart="true"
      android:layout_below="@+id/name">
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="New Button"
      android:id="@+id/button" />
      
   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="New Button"
      android:id="@+id/button2" />
      
   </LinearLayout>

</RelativeLayout>

Sau đây là nội dung của res/values/strings.xml để định nghĩa hai hằng −

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <string name="action_settings">Settings</string>
   <string name="reminder">Enter your name</string>
</resources>

Chạy ứng dụng Hello World! vừa sửa đổi ở trên. Giả sử bạn đã tạo AVD trong khi cài đặt. Để chạy ứng dụng từ Android Studio, mở activity file và nhấn biểu tượng Run từ thanh công cụ. −

RelativeLayout trong Android

Đã 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.


user_interface_layout_trong_android.jsp


Tài liệu giáo viên