美文网首页
网格布局(GridLayout)

网格布局(GridLayout)

作者: fastcv | 来源:发表于2019-07-04 00:01 被阅读0次

    前言

    作为android 4.0 后新增的一个布局,与前面介绍过的TableLayout(表格布局)其实有点大同小异;不过新增了一些东西:(结合大佬们的博客总结的,如有侵权,麻烦联系我删除此文章)

    • 跟LinearLayout(线性布局)一样,他可以设置容器中组件的对齐方式
    • 容器中的组件可以跨多行也可以跨多列(相比TableLayout直接放组件,占一行相比较)

    属性

    自身属性

    属性 说明
    android:alignmentMode 说明:当设置alignMargins,使视图的外边界之间进行校准。可以取以下值:alignBounds – 对齐子视图边界/alignMargins – 对齐子视距内容
    android:columnCount GridLayout的最大列数
    android:rowCount GridLayout的最大行数
    android:columnOrderPreserved 当设置为true,使列边界显示的顺序和列索引的顺序相同。默认是true
    android:orientation GridLayout中子元素的布局方向。有以下取值:horizontal:水平布局/vertical – 竖直布局
    android:rowOrderPreserved 当设置为true,使行边界显示的顺序和行索引的顺序相同。默认是true
    android:useDefaultMargins 当设置ture,当没有指定视图的布局参数时,告诉GridLayout使用默认的边距。默认值是false

    子元素属性

    属性 说明
    android:layout_column 显示该子控件的列,例如android:layout_column=”0”,表示当前子控件显示在第1列,android:layout_column=”1”,表示当前子控件显示在第2列
    android:layout_columnSpan 该控件所占的列数,例如android:layout_columnSpan=”2”,表示当前子控件占两列
    android:layout_row 显示该子控件的行,例如android:layout_row=”0”,表示当前子控件显示在第1行,android:layout_row=”1”,表示当前子控件显示在第2行
    android:layout_rowSpan 该控件所占的列数,例如android:layout_rowSpan=”2”,表示当前子控件占两行
    android:layout_columnWeight 该控件的列权重,与android:layout_weight类似,例如有GridLayout上两列,都设置android:layout_columnWeight = “1”,则两列各占GridLayout宽度的 一半
    android:layout_rowWeight 该控件的行权重,原理同android:layout_columnWeight

    举例

    cal.xml

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

    示意图:


    gridlayout_cal.PNG

    附加

    平均分配格行/列的问题

    GridLayout在Android 5.1(API Level 21)时引入了android:layout_columnWeight和android:layout_rowWeight来解决平分问题

    相关文章

      网友评论

          本文标题:网格布局(GridLayout)

          本文链接:https://www.haomeiwen.com/subject/nxtkhctx.html