Android入门教程（三）-安卓UI文档教程

清疚 2021-07-24 20:14 504阅读 0赞

点击上方    “醉翁猫咪”    ，选择    “置顶公众号”

有趣有内涵的文章第一时间送达！

喝酒I创作I分享

**生活中总有些东西值得分享**

@醉翁猫咪

![音符][format_png]

![format_png 1][]

对Android五大布局的描述，分别是 **FrameLayout (框架布局)，LinearLayout (线性布局)，AbsoluteLayout (绝对布局)，RelativeLayout (相对布局)，TableLayout (表格布局)。**

#  #

## FrameLayout 框架布局 ##

## FrameLayout 布局的使用效果，就是所有布局里的控件都会自动**往左上角放置**。所有的元素都会依次覆盖上一次的元素。那么我们现在写代码试试看： ##

在res/layout/activity\_main.xml 书写代码

<?xml version="1.0" encoding="utf-8"?>
    
    <FrameLayout    
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">
         
    
         
    <TextView       
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:textSize="90sp"
            android:textColor="#000000"
            android:text="第一"/>
        
    
        
    <TextView        
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:textSize="70sp"
            android:textColor="#ffff00"
            android:text="第二"/>
    </FrameLayout>

复制该代码试试看效果图，可以看到第一的元素被覆盖的效果。

**android中的 fill\_parent 表示宽度是屏幕的宽度，wrap\_content 这个表示大小刚好是文本的大小，表示高度，就是该字体有多高，文本框就有多高，同理宽度也一样。**

在布局文件中，我们可以看到android:gravity=”\#\#\#”的描述情况，该控件是描述控件内部的文本格式。

当我们定义一个TextView的文本框时，就是一个控件，控件中我们设定

android:layout\_width=”fill\_parent” 和 android:layout\_height=”wrap\_content” 这两个属性来描述该控件的高度和宽度，高度为文本即是字体高度，宽度即是屏幕的宽度。

那么我们android:gravity有什么用呢？那么你在 TextView 中添加一行代码：

<TextView
            
           android:layout_width="fill_parent"
            
    
            android:layout_height="wrap_content"
            
    
            android:textSize="90sp"
            
    
            android:textColor="#000000"
            
    
            android:gravity="right"
            
    
            android:text="第一"/>
    
    可以看到字体显示在屏幕的右边。
    这就是gravity属性描述控件内部的文本格式。
    其实还有很多不同的显示，你可以自己操作一遍试试。
    
    LinearLayout线性布局
    LinearLayout是很常用的布局，什么是线性布局？
    那就是垂直和水平两种布局来排列。在布局中的
    android:orientation=”vertical” //属于垂直排列 和 
    android:orientation=”horizontal” //水平排列
    center：居中 center_horizontal // 水平居中 
    center_vertical //垂直居中
    fill：充满容器 |fill_horizontal//水平方向充满容器 
    |fill_vertical //垂直方向充满容器
    代码例子可以参考github链接：
    https://github.com/huangguangda/LinearLayout
    
    AbsoluteLayout绝对布局
    绝对布局中： 
    android:layout_x=”##dp” 控制当前子类控件的x位置 
    android:layout_y=”##dp” 控制当前子类控件的y位置
    代码练习在res/activity_main.xml中：
    
    <AbsoluteLayout    
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    
        
    
    
        
    <Button        
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_x="50dp"
            android:layout_y="50dp"
            android:text="Button" />
    
        
    
    
        
    <Button        
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_x="100dp"
            android:layout_y="100dp"
            android:text="Button" />
    </AbsoluteLayout>RelativeLayout相对布局RelativeLayout是一个非常强大的为设置用户界面的布局RelativeLayout常用属性介绍：来自于：https://www.douban.com/note/97496783/下面介绍一下RelativeLayout用到的一些重要的属性：第一类:属性值为true或falseandroid:layout_centerHrizontal 水平居中android:layout_alignParentBottom 
    贴紧父元素的下边缘android:layout_alignParentLeft 
    贴紧父元素的左边缘android:layout_alignParentRight 
    贴紧父元素的右边缘android:layout_alignParentTop 
    贴紧父元素的上边缘android:layout_alignWithParentIfMissing 
    如果对应的兄弟元素找不到的话就以父元素做参照物第二类：属性值必须为id的引用名“@id/id-name”android:layout_below 在某元素的下方android:layout_above 在某元素的的上方android:layout_toLeftOf 在某元素的左边android:layout_toRightOf 在某元素的右边android:layout_alignTop 
    本元素的上边缘和某元素的的上边缘对齐android:layout_alignLeft 
    本元素的左边缘和某元素的的左边缘对齐android:layout_alignBottom 
    本元素的下边缘和某元素的的下边缘对齐android:layout_alignRight 
    本元素的右边缘和某元素的的右边缘对齐第三类：属性值为具体的像素值，如30dip，40pxandroid:layout_marginBottom 离某元素底边缘的距离android:layout_marginLeft 离某元素左边缘的距离android:layout_marginRight 离某元素右边缘的距离android:layout_marginTop 离某元素上边缘的距离代码例子可以参考github链接：
    https://github.com/huangguangda/RelativeLayoutTableLayout表格布局TableLayout 将子元素的位置分配到行或列中，
    是一个以行、列显示视图View的视图组。ableLayout元素就像是HTML中的table元素；
    TableRow就像是一一个tr元素。后续可能存在出现错误的地方，欢迎指正，非常感谢！

获取 “ 安卓UI文档教程 ” 方式

![format_png 2][]

> 喜欢    醉翁猫咪    的朋友，欢迎关注：醉翁猫咪

![format_png 3][]

**生活中**

**总有些东西值得分享**

![format_png 4][]

** 醉****·翁·猫·咪**

喝酒 I 创作 I 分享

ID：GD0423\_NeTech

[format_png]: /images/20210724/9c1040339bea4306bfca48e2d2af42c6.png
[format_png 1]: /images/20210724/90025e4600724dee867cd40842855fc4.png
[format_png 2]: /images/20210724/5b478b66995c468896fec34f8fbf2830.png
[format_png 3]: /images/20210724/da34d505f95f41e09ab0d20c0a7227aa.png
[format_png 4]: /images/20210724/a4ec8922dffa48ae80adabe7e115c710.png