Android学习 9-> 表格布局TableLayout和网格布局GridLayout

时间:2021-11-16 17:43:05

     表格布局TableLayout:中用<TableRow >......</TableRow>来表示一行,有多少行就添加对上个<TableRow ></TableRow>标签对;有多少列就看最多的一个<TableRow ></TableRow>中添加了多少个控件,知道把屏幕占满,超出屏幕的就不再显示。

    

     直接在TableLayout加控件,控件会占据一行

     TableLayout属性(也叫全局属性):*代表所有列

     android:shrinkColumns -------设置可收缩的列,(内容过多,则收缩,扩展到第二行,控件没布满TableLayout时不起作用)

     android:stretchColumns ------设置可伸展的列,(有空白则填充)

列可以同时具备stretchColumns及shrinkColumns属性

     android:collapseColumns ------设置要隐藏的列(索引列从0开始)

 

     内部控件属性:

     android:layout_column -------该单元格在第几列显示

     android:layout_span    -------该单元格占据列数,默认为1

      实现以下效果:

 

Android学习 9-> 表格布局TableLayout和网格布局GridLayout

      其xml如下

<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
     android:shrinkColumns="0"
     android:collapseColumns="1">
    
	<TableRow >
	    <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="1121564986549564"/>
	    	    
	    	   
	    <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="2"/>
	    	    	   
	   <Button
	       android:layout_width="wrap_content"
	       android:layout_height="wrap_content"
	       android:text="3" />
	    	    	    	   
	   <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="+"/>
	</TableRow>
	
	<TableRow >

	    <Button
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:layout_column="1"
	        android:text="4" />
	    	   
	    <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="5"/>
	    	    	   
	   <Button
	       android:layout_width="wrap_content"
	       android:layout_height="wrap_content" 
	       android:text="6" />
	    	    	    	   
	   <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="-"/>
	</TableRow>
	
			<TableRow >
	    <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="7"/>
	    	    
	    	   
	    <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="8"/>
	    	    	   
	   <Button
	       android:layout_width="wrap_content"
	       android:layout_height="wrap_content"
	       android:text="9" />
	    	    	    	   
	   <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="*"/>
	</TableRow>
	
	<TableRow>

	    <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:layout_span="2"
	        android:text="0"/>
	    	    	   
	   <Button
	       android:layout_width="wrap_content"
	       android:layout_height="wrap_content"
	       android:text="/" />
	    	    	    	   
	   <Button android:layout_height="wrap_content"
	        android:layout_width="wrap_content"
	        android:text="="/>
	</TableRow>
</TableLayout>
</span>

      网格布局GridLayout:

   其特点如下

l  使容器中的各组件呈M行×N列的网格状分布。

l  网格每列宽度相同,等于容器的宽度除以网格的列数。

l  网格每行高度相同,等于容器的高度除以网格的行数。

l  各组件的排列方式为:从上到下,从左到右。

l  组件放入容器的次序决定了它在容器中的位置。

l  容器大小改变时,组件的相对位置不变,大小会改变。

l  设置网格布局行数和列数时,行数或者列数可以有一个为零。若rows0cols3,则列数固定为3,行数不限,每行只能放3个控件或容器。若cols0rows3,则行数固定为3,列数不限,且每行必定有控件,若组件个数不能整除行数,则除去最后一行外的所有行组件个数为:Math.ceil(组件个数/rows)

Math.ceil(double x):传回不小于x的最小整数值。比如行数为3,组件数为13个,则Math.ceil(13/3)=5,即第一行,第二行组件数各为5个,剩下的组件放在最后一行。

l  若组件数超过网格设定的个数,则布局管理器会自动增加网格个数,原则是保持行数不变。

 

    不过经过使用,发现RowCount设置了还是可以添加,不知道是编译器问题还是使用版本问题。

 

     实现计算器如图:

Android学习 9-> 表格布局TableLayout和网格布局GridLayout

 

    其xml如下:


 

<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:columnCount="4"
    android:orientation="horizontal"
    android:layout_gravity="center"
    android:rowCount="5" >

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

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


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


    <Button
        android:id="@+id/devide"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="/" />


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

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

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


    <Button
        android:id="@+id/multiply"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="×" />

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

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

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

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

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

    <Button
        android:id="@+id/point"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="." />

    <Button
        android:id="@+id/plus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="fill"
        android:layout_rowSpan="2"
        android:text="+" />

    <Button
        android:id="@+id/equal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_columnSpan="3"
        android:layout_gravity="fill"
        android:text="=" />

</GridLayout></span>


     网格布局是之后的版本出现的,相比表格布局某些功能要好用些。