Android GridLayout中元素平分且行充满屏幕(计算器的界面效果)

有时候我们想用GridLayout做类似计算器的效果,可是看起来的效果确实这么的糟糕,如下图:

可是上图的每个元素都没有做到平分屏幕的1/4, 看起来很丑是吧!,

经过修改之后的效果图如下:

原理:

拿到GridLayout中的列数/屏幕的宽度,然后通过GridLayout.getChildCount()去获取GridLayout中的元素个数,然后循环设置宽度就可以做到平分效果

java:

package com.sl.horizontalscrollview;

import android.annotation.TargetApi;
import android.app.Activity;
import android.os.Build;
import android.os.Bundle;
import android.util.Log;
import android.widget.Button;
import android.widget.GridLayout;


public class MainActivity extends Activity {


    private static final String TAG = "MainActivity";
    private GridLayout mGridLayout;
    private int columnCount; //列数
    private int screenWidth; //屏幕宽度

    @TargetApi(Build.VERSION_CODES.ICE_CREAM_SANDWICH)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_m);

        mGridLayout = (GridLayout) findViewById(R.id.gridLayout);
        columnCount = mGridLayout.getColumnCount();
        screenWidth = this.getWindowManager().getDefaultDisplay().getWidth();
        Log.e(TAG, "column:" + columnCount + ";  screenwidth:" + screenWidth);
        for (int i = 0; i < mGridLayout.getChildCount(); i++) {
            Button button = (Button) mGridLayout.getChildAt(i);
            button.setWidth(screenWidth / columnCount);
        }
    }
}

XML:

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/gridLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:columnCount="4"
    android:rowCount="5"
    tools:ignore="NewApi">

    <Button
        android:id="@+id/empty"
        android:text="C" />

    <Button
        android:id="@+id/delete"
        android:text="←" />

    <Button
        android:id="@+id/divide"
        android:text="/" />

    <Button
        android:id="@+id/multiple"
        android:text="*" />

    <Button
        android:id="@+id/seven"
        android:text="7" />

    <Button
        android:id="@+id/eight"
        android:text="8" />

    <Button
        android:id="@+id/nine"
        android:text="9" />

    <Button
        android:id="@+id/minus"
        android:text="-" />

    <Button
        android:id="@+id/four"
        android:text="4" />

    <Button
        android:id="@+id/five"
        android:text="5" />

    <Button
        android:id="@+id/six"
        android:text="6" />

    <Button
        android:id="@+id/plus"
        android:text="+" />

    <Button
        android:id="@+id/one"
        android:text="1" />

    <Button
        android:id="@+id/two"
        android:text="2" />

    <Button
        android:id="@+id/three"
        android:text="3" />

    <Button
        android:id="@+id/equal"
        android:layout_gravity="fill_vertical"
        android:layout_rowSpan="2"
        android:text="=" />

    <Button
        android:id="@+id/zero"
        android:layout_columnSpan="2"
        android:layout_gravity="fill"
        android:text="0" />

    <Button
        android:id="@+id/dot"
        android:text="." />


</GridLayout>