Android基础_页面布局_RelativeLayout(相对布局)

最新推荐文章于 2022-10-24 20:26:54 发布

原创最新推荐文章于 2022-10-24 20:26:54 发布 · 1.4k 阅读

1 ·

CC 4.0 BY-SA版权

03_Android基础专栏收录该内容

10 篇文章

订阅专栏

这篇博客详细介绍了Android中的Relative布局，包括相对于给定ID控件、父组件的各种对齐方式，以及如何实现控件的居中。通过实例展示了Relative布局的使用，适用于不同分辨率屏幕。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Android相对布局应该是应用最为广泛的布局。这种方式下的布局对不同分辨率的屏幕适应性较好。

顾名思义,相对布局就是每个控件的位置都是相对于另一个控件而得来的。就是物理中的我们需要参照物。根据不同的参照物我们可以很灵活地设置控件到自己想要的位置。

不同的参照物

一、相对于给定ID的控件

android:layout_above 将此控件放置到给定ID的控件之上

android:layout_below 将此控件放置到给定ID的控件之下

android:layout_toLeftOf 将此控件的右边缘和给定ID控件的左边缘对齐(在给定ID控件的左侧)

android:layout_toRightOf 将此控件的左边缘和给定ID控件的右边缘对齐(在给定ID控件的右侧)

android:layout_alignBaseline 将此控件的baseline与给定ID的baseline对齐

android:layout_alignTop 将此控件的顶部和给定ID的顶部边缘对齐

android:layout_alignButtom 将此控件的底部边缘和给定ID的底部边缘对齐

android:layout_alignLeft 将此控件的左边缘和给定ID的左边缘对齐

android:layout_alignRight 将此控件的右边缘和给定ID的右边缘对齐

二、相对于父组件

android:layout_alignParentTop 如果为true,将此控件的顶部和父控件顶部对齐

android:layout_alignParentButtom 如果为true,将此控件的底部和父控件底部对齐

android:layout_alignParentLeft 如果为true,将此控件的左边缘和父控件的左边缘对齐

android:layout_alignParentRight 如果为true,将此控件的右边缘和父控件的右边缘对齐

三、设置居中

android:layout_centerHorizontal 如果为true,将此控件设置水平居中

android:layout_centerVertical 如果为true,将此控件设置垂直居中

android:layout_centerInParent 如果为true,将此空间设置为父控件的中央

下面给一个我画的解锁的小demo。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#00BFFF"
    android:orientation="vertical" >

    <!-- 数字5 -->
    <Button style="@style/PasswordButton"
        android:id="@+id/xml_button_5"
        android:layout_alignLeft="@+id/xml_button_2"
        android:layout_alignTop="@+id/xml_button_6"
        android:background="@drawable/circle"
        android:text="@string/number_5" />
    
    <!--数字4 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_4"
		android:layout_centerVertical="true"
		android:layout_toLeftOf="@id/xml_button_5"
		android:layout_margin="15dp"
		android:background="@drawable/circle"
		android:text="@string/number_4"/>
    
    <!-- 数字6 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_6"
		android:layout_centerVertical="true"
		android:layout_toRightOf="@id/xml_button_5"
		android:layout_margin="15dp"
		android:background="@drawable/circle"
		android:text="@string/number_6"/>
    
    <!-- 数字2 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_2"
		android:layout_centerHorizontal="true"
		android:layout_above="@id/xml_button_5"
		android:layout_margin="15dp"
		android:background="@drawable/circle"
		android:text="@string/number_2"/>
    
    <!-- 数字1 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_1"
		android:layout_above="@id/xml_button_4"
		android:layout_alignLeft="@id/xml_button_4"
		android:background="@drawable/circle"
		android:text="@string/number_1"/>
    
    <!-- 数字3 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_3"
		android:layout_above="@id/xml_button_6"
		android:layout_alignLeft="@id/xml_button_6"
		android:background="@drawable/circle"
		android:text="@string/number_3"/>
    
    <!-- 数字7 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_7"
		android:layout_below="@id/xml_button_4"
		android:layout_alignLeft="@id/xml_button_4"
		android:background="@drawable/circle"
		android:text="@string/number_7"/>
    
	<!-- 数字8 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_8"
		android:layout_alignLeft="@id/xml_button_5"
		android:layout_alignTop="@id/xml_button_7"
		android:background="@drawable/circle"
		android:text="@string/number_8"/>
    
    <!-- 数字9 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_9"
		android:layout_below="@id/xml_button_6"
		android:layout_alignLeft="@id/xml_button_6"
		android:background="@drawable/circle"
		android:text="@string/number_9"/>
    
    <!-- 数字0 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_button_0"
		android:layout_centerHorizontal="true"
		android:layout_below="@id/xml_button_8"
		android:layout_margin="15dp"
		android:background="@drawable/circle"
		android:text="@string/number_0"/>
    
    <!-- 清空 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_clear"
		android:layout_alignLeft="@id/xml_button_9"
		android:layout_alignTop="@id/xml_button_0"
		android:background="@drawable/circle"
		android:text="@string/clear"/>
    
    <!-- 修改密码 -->
    <Button style="@style/PasswordButton"
		android:id="@+id/xml_changePassword"
		android:layout_alignLeft="@id/xml_button_7"
		android:layout_alignTop="@id/xml_button_0"
		android:background="@drawable/circle"
		android:text="@string/changePassword"/>
    
    <!-- 密码输入框 -->
    <EditText 
        android:id="@+id/xml_passwordEdit"
        android:layout_width="150dp"
        android:layout_height="40dp"
        android:layout_centerHorizontal="true"
        android:layout_above="@id/xml_button_2"
        android:layout_margin="20dp"
        android:gravity="center"
        android:textColor="#FFFFFF"
        android:enabled="false"
        android:inputType="numberPassword"/>
    
    <!-- 确认输入-->
    <Button 
        android:id="@+id/xml_button_OK"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:layout_toRightOf="@id/xml_passwordEdit"
        android:layout_alignTop="@id/xml_passwordEdit"
        android:background="#00BFFF"
        android:text="@string/OK"/>
    
    <!-- 提示框 -->
    <TextView 
        android:id="@+id/xml_textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/xml_passwordEdit"
        android:gravity="center"
        android:layout_margin="10dp"/>
    
    <!-- 请求解锁 -->
    <Button 
        android:id="@+id/xml_removelock_button"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:layout_below="@id/xml_button_0"
        android:layout_centerHorizontal="true"
        android:visibility="gone"/>
    
    <!-- 请求重置密码 -->
    <Button 
    	android:id="@+id/xml_removepassword_button"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:layout_below="@id/xml_removelock_button"
        android:layout_centerHorizontal="true"
        android:visibility="gone"/>
        
</RelativeLayout>

效果如下：