腊月的季节

Android常用两大布局之LinearLayout

发表于 | 分类于 ， | | 阅读次数

LinearLayout布局

线性布局在开发中使用最多。
要想学好布局就要记，没有太多的逻辑，基本上都是初始化的作用，都知道xml是一种数据的格式，用来传递数据的，或者是一个数据的元组。那么Android的布局用xml也是把一个activity的数据存在里面，等要初始化界面的时候就去拿数据，然后初始化，差不多就是这个原理。
那么先一起学习属性和属性的参数吧！

LinearLayout常用属性

  • orientation:布局中组件的排列方式，有horizontal(水平),vertical(竖直,默认),两种方式。
  • gravity:控制组件所包含的子元素对齐方式，可多个组合,如(left|button)
  • layout_gravity:控制该组件在父容器里的对齐方式
  • layout_width:布局的宽度，通常不直接写数字的，用wrap_content(组件实际大小),fill_parent或者match_parent填满父容器
  • layout_height:布局的高度，同上
  • id:为组件设置一个资源id，在java文件中可以通过findViewById(id)找到该组件
  • background:为该组件设置一个背景图片，或者直接用颜色覆盖。

weight(权重)

该属性是用来等比例地划分区域

  • 最简单的用法:要等比例划分，分谁，谁为0，weight按比例即可
  • weight使用详解

    divider分割线

    该属性用于为LinearLayout设置分割线图片，通过showDividers来设置分割线的所在位置，有四个可选值none,middle,begining,end;当然你还可以通过
  • divider:为LinearLayout设置分割线图片
  • showDividers:设置分割线所在的位置，有四个可选值:none，middle,begining,end
  • dividerPadding:设置分割线的padding

weight权重属性详解

补充:默认启动第一个activity设置，在根目录中的manifeset文件中找到activit标签，在你需要默认的activity中间加入

1
2
3
4
<intent-filter>
   <action android:name="android.intent.action.MAIN" />
   <category android:name="android.intent.category.LAUNCHER" />
<intent-filter/>

1、最简单的用法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/LinearLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    
    android:orientation="horizontal">    
        
    <LinearLayout    
        android:layout_width="0dp"    
        android:layout_height="fill_parent"    
        android:background="#ADFF2F"     
        android:layout_weight="1"/>    
       
        
    <LinearLayout    
        android:layout_width="0dp"    
        android:layout_height="fill_parent"    
        android:background="#DA70D6"     
        android:layout_weight="2"/>    
        
</LinearLayout>

要实现第一个的1:1的效果,只需要分别把两个LinearLayout的weight改成1和1就可以了 用法归纳: 按比例划分水平方向:将涉及到的View的android:width属性设置为0dp,然后设置为android weight属性设置比例即可;类推,竖直方向,只需设android:height为0dp,然后设weight属性即可！
垂直布局

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:background="#ADFF2F"
        android:layout_weight="1">

    </LinearLayout>
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:background="#DA70D6"
        android:layout_weight="1">
    </LinearLayout>
</LinearLayout>

垂直布局实用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:background="#FFFFFF"
        android:layout_weight="7">
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="我要登录"
            android:textSize="20dp"/>
    </LinearLayout>


    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:background="#FFFFFF"
        android:layout_weight="1">
        <Button
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="登录"
            android:textSize="30dp"
            android:background="#2894FF"
            android:textColor="#A6A600"
            android:fontFamily="宋体"
            android:textColorLink="#C2C287"/>
    </LinearLayout>

</LinearLayout>

2、weight属性详解

  • wrap_content比较简单，直接就按比例。
  • fill_parent/match_parent这个需要计算，下面是结算算法
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
        xmlns:tools="http://schemas.android.com/tools"    
        android:id="@+id/LinearLayout1"    
        android:layout_width="match_parent"    
        android:layout_height="match_parent" >    
        
        <TextView    
            android:layout_weight="1"    
            android:layout_width="fill_parent"    
            android:layout_height="fill_parent"    
            android:text="one"     
            android:background="#98FB98"    
         />    
         <TextView    
            android:layout_weight="2"    
            android:layout_width="fill_parent"    
            android:layout_height="fill_parent"    
            android:text="two"     
            android:background="#FFFF00"    
         />    
         <TextView    
            android:layout_weight="3"    
            android:layout_width="fill_parent"    
            android:layout_height="fill_parent"    
            android:text="three"     
            android:background="#FF00FF"    
         />    
        
    </LinearLayout>

算法:
这个时候就会有疑问了,怎么会这样,这比例是2:1吧,那么three去哪了？代码里面明明有 three的啊,还设置了3的,而1和2的比例也不对耶,1:2:3却变成了2:1:0,怎么会这样呢? 答:这里其实没那么简单的,还是需要我们计算的,网上给出的算法有几种,这里就给出笔者 觉得比较容易理解的一种: step 1：个个都是fill_parent,但是屏幕只有一个啦,那么1 - 3 = - 2 fill_parent step 2：依次比例是1/6,2/6,3/6 step 3：先到先得,先分给one,计算: 1 - 2 (1/6) = 2/3 fill_parent 接着到two,计算: 1 - 2 (2/6) = 1/3 fill_parent 最后到three,计算 1 - 2 * (3/6) = 0 fill_parent step 4：所以最后的结果是:one占了两份,two占了一份,three什么都木有 以上就是为什么three没有出现的原因了
3、java代码中设置weight属性:

1
2
setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,     
        LayoutParams.WRAP_CONTENT, 1));

为LinearLayout设置分割线

1、直接在布局中添加一个view
这个view的作用仅仅是显示出一条线。

1
2
3
4
<View  
    android:layout_width="match_parent"  
    android:layout_height="1px"  
    android:background="#000000" />

2、实用LinearLayout的一个divider属性,直接为LinearLayout设置分割线

  • android:divider设置作为分割线的图片
  • android:showDivider设置分割线的位置,none(无),begining(开始),end(结束),middle(两个组件中间)
  • dividerPadding设置分割线的Padding
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/LinearLayout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:divider="@color/colorPrimaryDark"
        android:orientation="vertical"
        android:showDividers="middle"
        android:dividerPadding="10dp">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮1" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮2" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3" />

    </LinearLayout>

LinearLayout例子

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="请输入要保存的电话号码"/>
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"/>
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:gravity="right">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="保存"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="清空"/>
    </LinearLayout>
</LinearLayout>

gravity属性详解

当 android:orientation=”vertical” 时， 只有水平方向的设置才起作用，垂直方向的设置不起作用。 即：left，right，center_horizontal 是生效的。 当 android:orientation=”horizontal” 时， 只有垂直方向的设置才起作用，水平方向的设置不起作用。 即：top，bottom，center_vertical 是生效的。

热评文章