Android修行手册 - GridLayout复习和计算器示例

👉关于作者

众所周知，人生是一个漫长的流程，不断克服困难，不断反思前进的过程。在这个过程中会产生很多对于人生的质疑和思考，于是我决定将自己的思考，经验和故事全部分享出来，以此寻找共鸣！！！

专注于Android/Unity和各种游戏开发技巧，以及各种资源分享（网站、工具、素材、源码、游戏等）

欢迎关注公众号【空名先生】获取更多资源和交流！

👉前提

这是小空坚持写的Android新手向系列，欢迎品尝。

新手（√√√）

大佬（√）

👉实践过程

Hello，大家好啊，今天小空带大家学习GridLayout。改天我们在说说GirdView。

她在我们项目中使用的概率不大，但我们也要知道，有时候遇见特殊需求保不齐能用上，节省了你自己自定义的时间。

顾名思义该控件是网格布局，内部的子View是按照你设定好的行列数来布局的。

😜GridLayout本身属性

• android:columnCount：设置她的最大列数
• android:rowCount：设置她的最大行数
• android:alignmentMode：alignBounds-对齐子View边界 alignMargins-对齐子View内容
• android:orientation：设置她的GridLayout中子View的布局方向
• android:columnOrderPreserved：使列边界显示的顺序和列索引的顺序相同，默认值是true
• android:rowOrderPreserved ：使行边界显示的顺序和行索引的顺序相同，默认值是true
• android:useDefaultMargins：没有指定视图的布局参数时使用默认的边距，默认值值是false

😜GridLayout子View属性

• android:layout_column：代表该内容在GridLayout的第几列显示
• android:layout_row：代表该内容在GridLayout的第几行显示
• android:layout_columnSpan ：代表该内容占据GridLayout的几列
• android:layout_rowSpan：代表该内容占据GridLayout的几行
• android:layout_gravity：指定该View在容器中的所在位置，常用属性了
• android:layout_columnWeight：记得应该是API之后加入的，代表列权重
• android:layout_rowWeigh：记得应该是API之后加入的，代表行权重

😜示例

计算器布局是我们最常使用的

<GridLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:alignmentMode="alignBounds"
        android:background="#ece7e7"
        android:columnCount="4"
        android:orientation="horizontal"
        android:rowCount="5"
        android:useDefaultMargins="false">
        <TextView
            android:layout_rowWeight="3"
            android:layout_columnSpan="4"
            android:layout_columnWeight="1"
            android:gravity="right|bottom"
            android:text="0"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="AC"
            android:textColor="#FF3700B3"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="<-"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="/"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="*"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="7"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="8"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="9"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="—"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="4"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="5"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="6"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="+"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="1"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="2"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="3"
            android:textSize="20sp" />
        <TextView
            android:layout_rowSpan="2"
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#FF3700B3"
            android:gravity="center"
            android:text="="
            android:textColor="#ffffff"
            android:textSize="20sp" />
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="0"
            android:textSize="20sp" /
        <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="."
            android:textSize="20sp" />
         <TextView
            android:layout_rowWeight="1"
            android:layout_columnWeight="1"
            android:layout_margin="1dp"
            android:background="#ffffff"
            android:gravity="center"
            android:text="%"
            android:textSize="20sp" />
</GridLayout>

除了静态布局，有时候我们还需要动态添加的需求，还是拿计算器举例子

class TempActivity : AppCompatActivity() {
     private val mStringArray = arrayOf("0", "AC", "<-", "/", "*", "7", "8", "9", "—", "4", "5", "6", "+", "1", "2", "3", "=", "%", "0", ".")
 
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_test)
        // 6行   4列   gridLayout你xml中的布局view
        gridLayout.columnCount = 4
        gridLayout.rowCount = 6
        for (i in mStringArray.indices) {
            val textView = TextView(this)
            val params = GridLayout.LayoutParams()
            params.width = 0
            params.height = 0
            if (i == 0) {
                params.rowSpec = GridLayout.spec(0, 1, 3f)
                params.columnSpec = GridLayout.spec(0, 4, 1f)
                textView.gravity = Gravity.BOTTOM or Gravity.RIGHT
            } else {
                params.rowSpec = GridLayout.spec((i + 3) / 4, 1f)
                params.columnSpec = GridLayout.spec((i + 3) % 4, 1f)
                textView.setBackgroundColor(Color.WHITE)
                if ("AC" == mStringArray[i]) {
                    textView.setTextColor(Color.parseColor("#FF3700B3"))
                }
                if ("=" == mStringArray[i]) {
                    textView.setBackgroundColor(Color.parseColor("#FF3700B3"))
                    textView.setTextColor(Color.WHITE)
                    params.rowSpec = GridLayout.spec((i + 3) / 4, 2, 1f)
                }
                textView.gravity = Gravity.CENTER
                params.setMargins(2, 2, 2, 2)
            }
            textView.text = mStringArray[i]
            gridLayout.addView(textView, params)
        }
    }
}

所以总结：

自定义行数和列数，规范表格布局

随意设置子View占行几列或几行，也能设置子View在第几行第几列

📢作者：小空和小芝中的小空

📢转载说明-务必注明来源：芝麻粒儿 的个人主页 - 专栏 - 掘金 (juejin.cn)

📢这位道友请留步☁️，我观你气度不凡，谈吐间隐隐有王者霸气💚，日后定有一番大作为📝！！！旁边有点赞👍收藏🌟今日传你，点了吧，未来你成功☀️，我分文不取，若不成功⚡️，也好回来找我。