网格布局(计算器界面设计)

来源:互联网 发布:周围神经炎知乎 编辑:程序博客网 时间:2024/05/22 05:32

最终得到如图所示计算器界面

步骤为:

1、 在布局管理器中定义一个GridLayout,并在该GridLayout中依次定义文本框、按钮,该文本框、按钮各横跨4列。

2、 在Java代码中循环16次,依次添加16个按钮。

Layout文件定义如下:

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:rowCount="6"    android:columnCount="4"    android:id="@+id/root"    ><!-- 定义一个横跨四列的文本框,并设置该文本框的前景色、背景色等属性 -->    <TextView        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_columnSpan="4"        android:textSize="50sp"        android:layout_marginLeft="4dp"        android:layout_marginRight="4dp"        android:padding="5dp"        android:layout_gravity="right"        android:background="#eee"        android:textColor="#000"        android:text="0" /><Button    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:layout_columnSpan="4"    android:text="清除"    /></GridLayout>
注意必须在TextView 和Button 中 定义
android:layout_columnSpan="4"
 表明该组件横跨四列,否则将影响后面定义的Button布局 

利用Java代码来生成16个按钮,代码如下:

package com.example.gridlayouttest;import android.os.Bundle;import android.app.ActionBar.LayoutParams;import android.app.Activity;import android.view.Gravity;import android.view.Menu;import android.widget.Button;import android.widget.GridLayout;import android.widget.GridLayout.Spec;public class GridLayoutTest extends Activity {GridLayout gridLayout;String[] chars=new String[]{"7","8","9","÷","4","5","6","×","1","2","3","﹣",".","0","=","+",};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_grid_layout_test);gridLayout=(GridLayout) findViewById(R.id.root);for(int i=0;i<chars.length;i++){Button bn=new Button(this);bn.setText(chars[i]);//设置该按钮的字号大小bn.setTextSize(40);//指定该组件所在的行  一行放四个,从第二行开始放Spec rowSpec=GridLayout.spec(i/4+2);//指定该组件所在的列 每行有4列Spec columnSpec=GridLayout.spec(i%4);//定义Layout参数android.widget.GridLayout.LayoutParams params=new GridLayout.LayoutParams(rowSpec,columnSpec);//指定该组件占满父容器params.setGravity(Gravity.FILL);gridLayout.addView(bn,params);}}}

首先定义了一个字符串型数组,用于设定按钮上文本。从最后的
gridLayout.addView(bn,params);
可以看出我们得到整个应用的布局管理器,而后在其上面添加Button,params为对Button定义的相关参数。
这里需要注意到的是,在定义按钮行的时候,我们用了

Spec rowSpec=GridLayout.spec(i/4+2);

来指定该组件所在的行 一行放四个,从第二行开始放。

对于多按钮指定行的定位布局,我们可以使用公式    N / 该行按钮列数 + 起始行数      其中N为按钮的序号还需要注意,一切都从0开始哦!

对于指定组件所在的列时,我们使用了

Spec columnSpec=GridLayout.spec(i%4);
对于多按钮指定列的定位布局,我们可以使用公式    N % 该行按钮列数  

在以后的界面设计中这两个公式可以多加利用。





0 0
原创粉丝点击