Android开发第二次课布局方式

清疚 2022-09-10 08:10 139阅读 0赞

## 线性布局 ##

线性布局：

*  控件从左到右排列：水平方式
 *  控件从上到下排列：垂直方式
    
    标签：LinearLayout

xmlns:android:声明一个命名空间前缀，叫作android,http://schemas.android.com/apk/res/android,

是网址格式，才可以使用android前缀。

orientation="vertical" 是垂直排列

总体代码实现：

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">
        
        
        
        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content">
    
            <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:paddingLeft="15dp" android:paddingTop="15dp" android:text="用户" android:textSize="20dp" />
    
            <EditText android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="3" />
        </LinearLayout>
        
        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content">
    
            <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:paddingLeft="10dp" android:paddingTop="10dp" android:text="密码" android:textSize="20dp" />
    
            <EditText android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="3" />
        </LinearLayout>
        
        <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content">
            <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:text="登录"/>
            <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_weight="1" android:text="取消"/>
        </LinearLayout>
    </LinearLayout>

除了LinearLayout线性布局之外，里面，讲了三个控件；

1.TextView:显示文本提示信息；

2.EditText:输入框；

3.Button:按钮

## 2.表格布局 ##

office:excel工具。

表格布局是按照行和列来组织子视图的布局，包含一系列的TableRow对象，用于定义行。

TableLayout–>TableRow

可以包含0个以上的单元格，每个单元格可以设置一个View视图。

stretchColumns="*":从0开始的索引项，可以拉伸，*号大题拉伸的所有列。
    shrinkColumns="*"：收缩从0开始的索引项。

下面是9个图标下载热门的案例

<?xml version="1.0" encoding="utf-8"?>
    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:shrinkColumns="*" android:stretchColumns="*">
    
        <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="热门下载" android:textColor="@color/aqua" android:textSize="20dp" />
        
        <TableRow android:layout_weight="1">
            
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/iod" android:scaleType="fitXY"/>
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/afari" android:scaleType="fitXY"/>
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/iod" android:scaleType="fitXY"/>
        </TableRow>
        <TableRow android:layout_weight="1">
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/iiontacts" android:scaleType="fitXY"/>
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/phone" android:scaleType="fitXY"/>
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/twitter" android:scaleType="fitXY"/>
        </TableRow>
        <TableRow android:layout_weight="1">
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/stocks" android:scaleType="fitXY"/>
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/hjamera" android:scaleType="fitXY"/>
            <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@mipmap/wwwwww" android:scaleType="fitXY"/>
        </TableRow>
    </TableLayout>

颜色

<color name="colorPrimary">#3F51B5</color>
       <color name="colorPrimaryDark">#303F9F</color>
       <color name="colorAccent">#FF4081</color>
    
       <color name="black">#000000</color>
       <color name="white">#FFFFFF</color>
       <color name="snow">#fffafa</color>
       <color name="floralwhite">#fffaf0</color>
       <color name="blanchedalmond">#ffebcd</color>
       <color name="ghostwhite">#f8f8ff</color>
       <color name="whitesmoke">#f5f5f5</color>
       <color name="antiquewhite">#faebd7</color>
       <color name="navajowhite">#ffdead</color>
       <color name="grey">#808080</color>
       <color name="gainsboro">#dcdcdc</color>
       <color name="lightgrey">#d3d3d3</color>
       <color name="darkgrey">#a9a9a9</color>
       <color name="dimgrey">#696969</color>
       <color name="slategrey">#708090</color>
       <color name="lightslategrey">#778899</color>
       <color name="darkslategrey">#2f4f4f</color>
       <color name="silver">#c0c0c0</color>
    
       <color name="red">#ff0000</color>
       <color name="darkred">#8b0000</color>
       <color name="crimson">#dc143c</color>
       <color name="darkmagenta">#8b008b</color>
       <color name="fuchsia">#ff00ff</color>
       <color name="tomato">#ff6347</color>
       <color name="lightcoral">#f08080</color>
       <color name="darksalmon">#e9967a</color>
       <color name="peachpuff">#ffdab9</color>
       <color name="plum">#dda0dd</color>
       <color name="pink">#ffc0cb</color>
       <color name="lightpink">#ffb6c1</color>
       <color name="deeppink">#ff1493</color>
       <color name="hotpink">#ff69b4</color>
       <color name="lavenderblush">#fff0f5</color>
       <color name="indianred">#cd5c5c</color>
       <color name="rosybrown">#bc8f8f</color>
       <color name="firebrick">#b22222</color>
       <color name="maroon">#800000</color>
       <color name="honeydew">#f0fff0</color>
       <color name="orangered">#ff4500</color>
       <color name="orange">#ffa500</color>
       <color name="limegreen">#32cd32</color>
       <color name="lime">#00ff00</color>
       <color name="yellow">#ffff00</color>
       <color name="wheat">#f5deb3</color>
       <color name="khaki">#f0e68c</color>
       <color name="burlywood">#deb887</color>
       <color name="bisque">#ffe4c4</color>
       <color name="lightyellow">#ffffe0</color>
       <color name="darkgoldenrod">#b8860b</color>
       <color name="darkorange">#ff8c00</color>
       <color name="lightgoldenrodyellow">#fafad2</color>
       <color name="lemonchiffon">#fffacd</color>
       <color name="cornsilk">#fff8dc</color>
       <color name="seaShell">#fff5ee</color>
       <color name="papayawhip">#ffefd5</color>
       <color name="mistyrose">#ffe4e1</color>
       <color name="moccasin">#ffe4b5</color>
       <color name="ivory">#fffff0</color>
       <color name="gold">#ffd700</color>
       <color name="goldenrod">#daa520</color>
       <color name="lightsalmon">#ffa07a</color>
       <color name="coral">#ff7f50</color>
       <color name="mintcream">#f5fffa</color>
       <color name="beige">#f5f5dc</color>
       <color name="sandybrown">#f4a460</color>
       <color name="oldlace">#fdf5e6</color>
       <color name="linen">#faf0e6</color>
       <color name="salmon">#fa8072</color>
       <color name="thistle">#d8bfd8</color>
       <color name="tan">#d2b48c</color>
       <color name="chocolate">#d2691e</color>
       <color name="peru">#cd853f</color>
       <color name="darkkhaki">#bdb76b</color>
       <color name="palegoldenrod">#eee8aa</color>
       <color name="brown">#a52a2a</color>
       <color name="saddlebrown">#8b4513</color>
       <color name="sienna">#a0522d</color>
       <color name="olive">#808000</color>
       <color name="chartreuse">#7fff00</color>
       <color name="greenyellow">#adff2f</color>
       <color name="green">#008000</color>
       <color name="darkgreen">#006400</color>
       <color name="darkolivegreen">#556b2f</color>
       <color name="olivedrab">#6b8e23</color>
       <color name="lawngreen">#7cfc00</color>
       <color name="forestgreen">#228b22</color>
       <color name="aquamarine">#7fffd4</color>
       <color name="paleturquoise">#afeeee</color>
       <color name="palegreen">#98fb98</color>
       <color name="mediumturquoise">#48d1cc</color>
       <color name="mediumaquamarine">#66cdaa</color>
       <color name="aqua">#00ffff</color>
       <color name="springgreen">#00ff7f</color>
       <color name="mediumspringgreen">#00fa9a</color>
       <color name="darkturquoise">#00ced1</color>
       <color name="seagreen">#2e8b57</color>
       <color name="lightgreen">#90ee90</color>
       <color name="darkseagreen">#8fbc8f</color>
       <color name="turquoise">#40e0d0</color>
       <color name="cyan">#00ffff</color>
       <color name="darkcyan">#008b8b</color>
       <color name="lightcyan">#e0ffff</color>
       <color name="teal">#008080</color>
       <color name="indigo">#4b0082</color>
       <color name="blue">#0000ff</color>
       <color name="darkblue">#00008b</color>
       <color name="mediumblue">#0000cd</color>
       <color name="midnightblue">#191970</color>
       <color name="navy">#000080</color>
       <color name="royalblue">#4169e1</color>
       <color name="azure">#f0ffff</color>
       <color name="skyblue">#87ceeb</color>
       <color name="deepskyblue">#00bfff</color>
       <color name="lightskyblue">#87cefa</color>
       <color name="lightseagreen">#20b2aa</color>
       <color name="lightblue">#add8e6</color>
       <color name="powderblue">#b0e0e6</color>
       <color name="aliceblue">#f0f8ff</color>
       <color name="mediumslateblue">#7b68ee</color>
       <color name="slateblue">#6a5acd</color>
       <color name="darkslateblue">#483d8b</color>
       <color name="mediumseagreen">#3cb371</color>
       <color name="steelblue">#4682b4</color>
       <color name="lightsteelblue">#b0c4de</color>
       <color name="cornflowerblue">#6495ed</color>
       <color name="dodgerblue">#1e90ff</color>
       <color name="cadetblue">#5f9ea0</color>
       <color name="blueviolet">#8a2be2</color>
       <color name="purple">#800080</color>
       <color name="lavender">#e6e6fa</color>
       <color name="orchid">#da70d6</color>
       <color name="mediumpurple">#9370db</color>
       <color name="darkorchid">#9932cc</color>
       <color name="violet">#ee82ee</color>
       <color name="mediumvioletred">#c71585</color>
       <color name="palevioletred">#db7093</color>
       <color name="darkviolet">#9400d3</color>
       <color name="mediumorchid">#ba55d3</color>

**3.相对布局**

控件的位置是相对于其他控件或者父容器而言。在进行设计的时候，需要按照控件之间的依赖关系进行排列。

**4.帧布局**

帧布局是布局中最简单的一个布局，整个界面被当做一块空白备用区域，所有的子元素都不能指定位置进行放置，全部放置于这块儿区域的左上角，并且后面的子元素直接覆盖前面的子元素，将前面的子子元素部分或者全部覆盖。

整个屏幕作为了一块区域，在这块区域添加多个子控件。

**5.绝对布局**

绝对布局是所有控件的排列由开发人员通过控件的坐标来指定，容器不再负责管理子控件的位置。

AbsoluteLayout:子控件的位置和布局都需要通过坐标来指定，所以，在设计布局时候，需要开发人员提供子元素精确的横坐标和纵坐标。

绝对布局由坐标控制，缺乏灵活性，维护起来不容易。

layout\_x: x坐标；

layout\_y:y坐标;

手机上的坐标原点同pc端一样，都是在屏幕的左上角。