Android开发 GridLayout网格布局

属性介绍

本身属性

  • 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_columnSpan="5",那么这个子元素控件就会占据GridLayout一半列数的空间。需要配合android:layout_gravity="fill" 一起使用
  • 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。

 

 

例子

效果图:

Android开发 GridLayout网格布局

xml:

需要注意的问题:

1.在子元素如果不设置 android:layout_width 与 android:layout_height 为 "0dp" 那么子元素在配合 android:layout_rowWeight="1" 与 android:layout_columnWeight="1" 属性时将不会起作用,这时候会出现子元素超出 GridLayout 布局的问题

2.需要子元素撑满剩余布局空间时,需要设置 android:layout_gravity="fill"

<?xml version="1.0" encoding="utf-8"?><!--数字输入盘-->
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="152dp"
    android:background="@color/snakecommon_color_181B23">

    <GridLayout
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:columnCount="10"
        android:rowCount="2"
        android:paddingTop="15dp"
        android:paddingBottom="15dp"
        android:paddingLeft="18dp"
        android:paddingRight="18dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="1"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="2"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="3"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="4"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="5"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="6"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="7"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="8"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="9"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <Button
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:text="0"
            android:layout_marginStart="2.5dp"
            android:layout_marginEnd="2.5dp"
            android:textColor="@color/snakecommon_color_FFFFFF"
            android:textSize="18sp" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnSpan="5"
            android:layout_gravity="fill"
            android:paddingVertical="10dp"
            android:layout_marginTop="10dp"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:src="@drawable/snake_ic_delete" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_rowWeight="1"
            android:layout_columnSpan="5"
            android:layout_gravity="fill"
            android:paddingVertical="10dp"
            android:layout_marginTop="10dp"
            android:layout_marginLeft="5dp"
            android:background="@drawable/snake_shape_white_rectangle_10dp"
            android:src="@drawable/snake_ic_yes" />

    </GridLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

 

 

 

End

Android开发 GridLayout网格布局

上一篇:std::ios::sync_with_stdio(false)的运用问题


下一篇:解决:Could not get unknown property 'android' for project ':fluttertoast' of type org.gradle.api.Project