androidUI一GridLayout

最新推荐文章于 2023-05-05 01:14:25 发布

weixin_34315665

最新推荐文章于 2023-05-05 01:14:25 发布

阅读量47

点赞数

文章标签：移动开发 python

原文链接：https://my.oschina.net/quguangle/blog/783359

版权

2019独角兽企业重金招聘Python工程师标准>>>

GridLayout

今天要介绍的布局是Android 4.0以后引入的一个新的布局,和前面所学的TableLayout(表格布局)

有点类似,不过他有很多前者没有的东西,也更加好用,

1)可以自己设置布局中组件的排列方式

2)可以自定义网格布局有多少行,多少列

3)可以直接设置组件位于某行某列

4)可以设置组件横跨几行或者几列

另外,除了上述内容外,本节还会给大家使用gridLayout时会遇到的问题,以及如何解决低版本

1)相关属性图:

2.0）案例：计算器布局的实现

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/GridLayout1"    
    android:layout_width="wrap_content"    
    android:layout_height="wrap_content"    
    android:rowCount="6"    
    android:columnCount="4"    
    android:orientation="horizontal">    
    
    <TextView  
        android:background="#FFCCCC"     
        android:layout_gravity = "fill"  
        android:layout_columnSpan="4"    
        android:text="0"    
        android:textSize="50sp"    
        android:layout_marginLeft="5dp"    
        android:layout_marginRight="5dp"    
    />    
    
    <Button     
        android:text="回退"     
        android:layout_columnSpan="2"    
        android:layout_gravity="fill"       
    />    
       
    <Button     
        android:text="清空"    
        android:layout_columnSpan="2"    
        android:layout_gravity="fill"        
    />    
        
    <Button     
        android:text="+"        
    />    
       
    <Button     
        android:text="1"        
    />    
    <Button     
        android:text="2"        
    />    
    <Button     
        android:text="3"        
    />    
    <Button     
        android:text="-"        
    />    
    <Button     
        android:text="4"        
    />    
    <Button     
        android:text="5"        
    />    
    <Button     
        android:text="6"        
    />    
    <Button     
        android:text="*"        
    />    
    <Button     
        android:text="7"        
    />    
    <Button     
        android:text="8"        
    />    
    <Button     
        android:text="9"        
    />    
    <Button     
        android:text="/"        
    />    
    <Button     
        android:layout_width="wrap_content"    
        android:text="."        
    />    
    <Button     
        android:text="0"        
    />    
     <Button     
        android:text="="        
    />    
</GridLayout>

代码解析:

代码很简单,只是回退与清楚按钮横跨两列,而其他的都是直接添加的,默认每个组件都是

占一行一列,另外还有一点要注意的:

我们通过:android:layout_rowSpan与android:layout_columnSpan设置了组件横跨

多行或者多列的话,如果你要让组件填满横越过的行或列的话,需要添加下面这个属性:

android:layout_gravity = "fill"！！！就像这个计算机显示数字的部分!

案例2：登录界面的实现（使用V7的兼容包，可以使用在4.0一下的版本）

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <android.support.v7.widget.GridLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"

        app:useDefaultMargins="true"
        app:columnCount="3">


        <TextView
            android:text="First Name:"
            app:layout_gravity="right" />

        <EditText
            android:ems="10"
            app:layout_columnSpan="2" />

        <TextView
            android:text="Last Name:"

            app:layout_column="0"
            app:layout_gravity="right" />

        <EditText
            android:ems="10"
            app:layout_columnSpan="2" />


        <TextView
            android:text="Visit Type:"

            app:layout_column="0"
            app:layout_gravity="right" />

        <RadioGroup app:layout_columnSpan="2">

            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Business" />


            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Social" />

        </RadioGroup>

        <Button
            android:text="Ok"
            app:layout_column="1" />

        <Button
            android:text="Cancel"
            app:layout_column="2" />

    </android.support.v7.widget.GridLayout>

</LinearLayout>