GridLayout 使用属性
属性作用android:columnCount最大列数android:rowCount最大行数android:orientationGridLayout中子元素的布局方向android:alignmentModealignBounds:对齐子视图边界 alignMargins :对齐子视距内容,默认值android:columnOrderPreserved使列边界显示的顺序和列索引的顺序相同,默认是trueandroid:rowOrderPreserved使行边界显示的顺序和行索引的顺序相同,默认是trueandroid:useDefaultMargins没有指定视图的布局参数时使用默认的边距,默认值是false
item属性
属性作用android:layout_column指定该单元格在第几列显示android:layout_row指定该单元格在第几行显示android:layout_columnSpan指定该单元格占据的列数android:layout_rowSpan指定该单元格占据的行数android:layout_gravity指定该单元格在容器中的位置android:layout_columnWeight(API21加入)列权重android:layout_rowWeight(API21加入) 行权重
|
android:layout_gravity
|
作用
|
|
center
|
不改变元素的大小,仅居中
|
|
center_horizontal
|
不改变大小,水平居中
|
|
center_vertical
|
不改变大小,垂直居中
|
|
top
|
不改变大小,置于顶部
|
|
left
|
不改变大小,置于左边
|
|
bottom
|
不改变大小,置于底部
|
|
right
|
不改变大小,置于右边
|
|
start
|
不改变大小,根据系统语言,置于开始位置
|
|
end
|
不改变大小,置于结尾
|
|
fill
|
拉伸元素控件,填满其应该所占的格子
|
|
fill_vertical
|
仅垂直方向上拉伸填充
|
|
fill_horizontal
|
仅水平方向上拉伸填充
|
|
clip_vertical
|
垂直方向上裁剪元素,仅当元素大小超过格子的空间时
|
|
clip_horizontal
|
水平方向上裁剪元素,仅当元素大小超过格子的空间时
|
使用
layout_columnSpan
、
layout_rowSpan
时要加上
layout_gravity
属性,否则没有效果;另外item在边缘时宽高计算会出现错误,需要我们手动设置宽高,否则达不到想要的效果
三、平分问题
GridLayout在API21时引入了
android:layout_columnWeight
和
android:layout_rowWeight
来解决平分问题
那么在API21以前的,想要平分的话:引用兼容包
compile 'com.android.support:gridlayout-v7:25.+'
-
使用该控件,命名空间使用app
-
单独设置
app:layout_columnWeight
时,这一列的所有item都设置为这个属性,才能达到预期效果,否则这一列中设置了该属性的item,都会被隐藏,显示不出来
-
单独设置
app:layout_rowWeight
时,没有问题
四、小米计算器效果
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/grid_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ece7e7"
app:alignmentMode="alignBounds"
app:columnCount="4"
app:orientation="horizontal"
app:rowCount="5"
app:useDefaultMargins="false"
tools:context="com.strivestay.gridlayoutdemo.MainActivity">
<!-- 如果不使用 app:layout_gravity="fill",
则实际下面这个textview的宽度只是wrap_content,
实现不了想要的right|bottom效果;
用app:layout_columnWeight="1",
效果等同,填充满
<TextView
android:gravity="right|bottom"
android:text="0"
app:layout_columnSpan="4"
app:layout_rowWeight="3"
app:layout_columnWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="AC"
android:textColor="#f68904"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="退格"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="/"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="*"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="7"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="8"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="9"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="—"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="4"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="5"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="6"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="+"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="1"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="2"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="3"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#f68904"
android:gravity="center"
android:text="="
android:textColor="#ffffff"
app:layout_columnWeight="1"
app:layout_rowSpan="2"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="%"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="0"
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
<TextView
android:layout_margin="1dp"
android:background="#ffffff"
android:gravity="center"
android:text="."
app:layout_columnWeight="1"
app:layout_rowWeight="1"/>
</android.support.v7.widget.GridLayout>
效果: 4.4.4模拟器
五、动态加载
1.xml引用GridLayout
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/grid_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ece7e7"
app:orientation="horizontal"
app:useDefaultMargins="false"
app:alignmentMode="alignBounds"
tools:context="com.strivestay.gridlayoutdemo.MainActivity">
</android.support.v7.widget.GridLayout>
2.动态添加
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.GridLayout;
import android.view.Gravity;
import android.widget.TextView;
* GridLayout示例
* @author StriveStay
* @date 2018/3/27
public class MainActivity extends AppCompatActivity {
private String[] mStrings = {"0","AC","退格","/","*","7","8","9","—","4","5","6","+","1","2","3","=","%","0","."};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// xml布局
// setContentView(R.layout.activity_main);
// 动态添加
setContentView(R.layout.activity_main2);
GridLayout gridLayout = (GridLayout) findViewById(R.id.grid_layout);
// 6行 4列
gridLayout.setColumnCount(4);
gridLayout.setRowCount(6);
for (int i = 0; i < mStrings.length; i++) {
TextView textView = new TextView(this);
GridLayout.LayoutParams params = new GridLayout.LayoutParams();
params.width =0;
params.height =0;
if(i == 0){
// 设置行列下标, 所占行列 ,比重
// 对应: layout_row , layout_rowSpan , layout_rowWeight
// 如下代表: item坐标(0,0), 占 1 行,比重为 3 ; 占 4 列,比重为 1
params.rowSpec = GridLayout.spec(0,1,3f);
params.columnSpec = GridLayout.spec(0,4,1f);
textView.setGravity(Gravity.BOTTOM|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".equals(mStrings[i])){
textView.setTextColor(Color.parseColor("#f68904"));
if("=".equals(mStrings[i])){
textView.setBackgroundColor(Color.parseColor("#f68904"));
textView.setTextColor(Color.WHITE);
params.rowSpec = GridLayout.spec((i+3)/4,2,1f);
// 居中显示
textView.setGravity(Gravity.CENTER);
// 设置边距
params.setMargins(2,2,2,2);
// 设置文字
textView.setText(mStrings[i]);
// 添加item
gridLayout.addView(textView,params);
效果和用xml中直接布局一样:
注意:
GridLayout.spec(); 这个方法是一个重点,需要好好看一下,而且由于它有几个重载方法,使用时也要注意。比如说下面两个方法:
public static Spec spec(int start, int size)
public static Spec spec(int start, float weight)
刚开始就忽略了这点,本想用的是第二个带有weight的方法,但是传入参数时,没有加上f,就调用了第一个方法,搞了半天才发现
所以,如果调用的是第二个方法,一定要注意float参数的表示方法,加个f,如:GridLayout.spec(0,1f);
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言 一、pandas是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、pandas是什么?示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分
网格布局标签是GridLayout。这个布局是android4.0新增的布局。这个布局只有4.0之后的版本才能使用。
不过新增了一些东东
①跟LinearLayout(线性布局)一样,他可以设置容器中组件的对齐方式
②容器中的组件可以跨多行也可以跨多列(相比TableLayout直接放组件,占一行相比较)
因为是android 4.0新增的,API Level 14,在这个版本以前的sdk
都需要导入项目,等下会详细介绍
常用属性:
排列对齐:
①设置组件的排列方式: android:orientation=”” vertical(竖直,默认)或者horizontal(水平)
< com xss=removed xss=removed xss=removed xss=removed>
android : layout_width = " match_parent "
android : layout_height = " matc
Android学习|
布局——
GridLayout 表格
布局一、
GridLayout 行、列 都可以进行合并二、常见属性三、子控件属性四、Demo1、常见属性Demo
一、
GridLayout 行、列 都可以进行合并
Table
Layout只能设置其占据几列(列合并),而不能进行行的合并,要进行行的合并,可
使用GridLayout布局。
二、常见属性
1、
android:orientation : 设置水平显示还是垂直显示
2、
android:columnCount : 设置行的显示个数
GridLayout
public GridLayout(int rows, int cols, int hgap, int vgap)
创建具有指定行数和列数的网格布局。给布局中的所有组件分配相等的大小。此外,将水平和垂直间距设置为指定值。水平间距将置于列与列之间。将垂直间距将置于行与行之间。
rows 和 cols 中的一个可以为零(但不能两者同时为零),这表示可以将任何数目的对象置于行或列中。 所有 GridLayout 构造方法都服从这一规定。
rows - 该 rows 具有表示任意行数的
今天要介绍的
布局是
Android 4.0以后引入的一个新的
布局,和前面所学的Table
Layout(表格
布局)
有点类似,不过他有很多前者没有的东西,也更加好用,
可以自己设置
布局中组件的排列方式可以自定义网格
布局有多少行,多少列可以直接设置组件位于某行某列可以设置组件横跨几行或者几列
另外,除了上述内容外,本节还会给大家
使用gridLayout时会遇到的
LinearLayout 线性布局 控制组件 横向 或者 纵向 排列
RelativeLayout 相对布局 子组件的位置总是相对兄弟组件,父容器来决定的
FrameLayout 帧布局、框架布局 创建一个空白区域, 一个区域成为一帧
TableLayout 表格布局 采用 行, 列 形式管理子组件,添加TableRow 和 组件 就可以控制表格的行数和列数
GridLayout 网格布局 设置行列来装填控件
AbsoluteLayout 绝对布局 组件位置通过x, y坐标来控制, 布局容器不再管理组件位置, 大小, 这些都可以自定义;
Android Studio 计算器布局可以使用 LinearLayout 或 GridLayout 进行设计。其中,LinearLayout 是一种线性布局,可以按照水平或垂直方向排列视图,而 GridLayout 则是一种网格布局,可以将视图按照行列进行排列。
在设计计算器布局时,需要考虑到各个按钮的位置和大小,以及布局的整体风格和配色。可以使用 Android Studio 提供的布局编辑器进行设计,也可以手动编写 XML 布局文件。
在布局文件中,需要定义各个视图的属性,如宽度、高度、边距、背景颜色等。同时,还需要为按钮添加点击事件,以实现计算器的功能。
总之,设计 Android Studio 计算器布局需要综合考虑布局方式、视图属性和功能实现等方面,才能得到一个美观、实用的计算器界面。