C004Android学习笔记-中级控件（一）

缺乏、安全感 2023-10-18 22:52 42阅读 0赞

# 一、RelativeLayout相对布局 #

## 1、概述 ##

①RelativeLayout下级视图的位置是相对位置，得有具体发参照物才能确定最终位置；

②如果不指定下级视图的参照物，那么下级视图默认显示在RelativeLayout内部的左上角；

③用于确定视图位置的参照物分为两种，一种是与该视图平级的视图，另一种是该视图的上级视图；

## 2、相对位置的属性与类型的取值说明 ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz_size_16_color_FFFFFF_t_70][]

## 3、说明 ##

相对布局的视图位置一般会在XML布局文件中定义好，特殊情况下在代码中定义相对位置用到的是RelativeLayout.LayoutParams的addRule方法，该方法第一个参数是相对位置的类型（见上表），第二个参数是参照物资源视图的ID；

## 4、代码演示 ##

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:ignore="HardcodedText">
    
        <Button
            android:id="@+id/btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="同级参照"
            android:layout_centerInParent="true"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上级水平居中"
            android:layout_centerHorizontal="true"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上级垂直居中"
            android:layout_centerVertical="true"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="100dp"
            android:text="上级左侧对齐"
            android:layout_alignParentStart="true"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="100dp"
            android:text="上级右侧对齐"
            android:layout_alignParentEnd="true"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上级顶部对齐"
            android:layout_alignParentTop="true"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上级底部对齐"
            android:layout_alignParentBottom="true"/>
    
        <Button
            android:id="@+id/btn5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图左边"
            android:layout_centerInParent="true"
            android:layout_toStartOf="@id/btn"/>
    
        <Button
            android:id="@+id/btn4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图右边"
            android:layout_centerInParent="true"
            android:layout_toEndOf="@id/btn"/>
    
        <Button
            android:id="@+id/btn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图上边"
            android:layout_centerInParent="true"
            android:layout_above="@id/btn"/>
    
        <Button
            android:id="@+id/btn2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图下边"
            android:layout_centerInParent="true"
            android:layout_below="@id/btn"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图左对齐"
            android:layout_above="@id/btn1"
            android:layout_alignStart="@id/btn"/>
    
        <Button
            android:id="@+id/btn3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图右对齐"
            android:layout_below="@id/btn2"
            android:layout_alignEnd="@id/btn"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图右对齐顶部对齐"
            android:layout_alignTop="@id/btn3"
            android:layout_alignEnd="@id/btn5"/>
    
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="参照视图右对齐底部对齐"
            android:layout_alignBottom="@id/btn3"
            android:layout_alignStart="@id/btn4"/>
    
    
    </RelativeLayout>

### 效果： ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz_size_16_color_FFFFFF_t_70 1][]

# 二、框架布局FrameLayout #

## 1、概述 ##

FrameLayout就像PS里面的图层一样，前面的视图在下级图层，后面的视图在上级图层；

## 2、常用属性 ##

**foreground：**指定框架布局的前景图像，该图像在框架内部永远处于最顶层，不会被框架的其他视图覆盖；

**foregroundGravity：**指定前景图像的对其方式，取值通同Gravity；

## 3、代码演示 ##

<?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:ignore="HardcodedText">
    
        <View
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:background="#000000"/>
        <View
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:background="#ff0000"/>
        <View
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:background="#ffff00"/>
        
    
    </FrameLayout>

### 效果： ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz_size_16_color_FFFFFF_t_70 2][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20190804110000986.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20190804115006855.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/2019080411571271.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzI5Njg5MzQz,size_16,color_FFFFFF,t_70