如何制作表格(一)——TableLayout

一、Android中能够用于网格布局的控件(制作各种这样的表格)

Android提供了四种方式来制作表格,分别为:

TableLayout、GridLayout、GridView、Recycler中的GridLayoutManager模式。

二、TableLayout的使用

来让我们们说说TableLayout好处都有啥<( ̄ˇ ̄)/~~

①、TableLayout的优点是布出来的局特别规整,行是行,列是列。

什么叫做行是行,列是列,稍安勿躁,我们先来证明什么叫行是行。

准备:我们先创建TableLayout布局,然后向里面添加两个TextView,并使用gravity。就像这样
    
        
        
        
        
    
看看屏幕发生了什么?(°o°;),这不是设置了oriention="vertial"的LinearLayout了吗。也不对,我在TV一号中,明明设置了layout_width="0dp"为什么,还显示的出来, 还占满了屏幕的width。这..这..。

恩,这就是TableLayout行的效果,每个加入TableLayout的控件都被当做一行对待,所以width默认是占满屏幕的,改都改不掉,所以TV二号就不要白费力气了,跟TV一号学学吧。当然修改height是完全没问题的,就跟TV一号一样

氮素,氮素 - -,我做表格不可能每行只放一个控件吧,而且还占满了一整行。那么怎么设置列呢?

我们需要在标签中添加标签,表示为TableLayout中的一行(加入TableLayout的控件都被当做一行对待
我们每往中添加一个控件,该控件就自成一列。来来来,动手了!!~~
    
        
            
            
            
            
        
    
偶,TV一二号,又出场了。。我们可以看到,这下width和height都能够设置了。跟LinearLayout的oriention="horizonal"功能完全一样了~~。

大家看,这样就将表格中的行和列分开来了。我们可以很好的知道,下的每个标签都表示的是一行,不可能是某个列,列的设置都在这个标签内。

②、能够自由分配行数、列数。。。能够自由分配每行的高度和每列的宽度

1、如何利用TableLayout画表格
好好,我知道了什么叫行是行,列是列。画表格的时候,首先得画出表格的行和列吧,怎么画出表格的行和列呢。
不不不,这个想法是针对单元格相同的表格。对于tableLayout我们应该这样想,首先看表格的行,然后再看该行内有多少列。先将该行的列制作出来,然后再看下一行,以此类推,来绘制完表格。而不是先画张表,再向里面填充东西,应该是看到一行,先将一行填完,在进行下一行的填充。
2、如何设置TableLayout的行和列
哦是这样啊,但是那么画到最后,我们总得知道,这个表格有多少行多少列吧。

是这样没错,行数就是在中添加多少了个控件。我们数一数
:是TableLayout下的控件,不包括TalbeRow内的控件)

列数就是 标签中添加多少个控件。(这个就叫做自由分配行数、列数。因为:行、列都是由加入的控件决定的,而不是TableLayotu指定行数或者列数)

但是每个添加的控件数量都是不同的呀,比如说我在Row1中有3个,在Row2中有5个,怎么能判定列是多少?         按最多的数量为TableLayout的列。就是5个
:可以看做Row1的列数为5,但是剩下的两个隐藏了
3、如何设置TableLayout各行、各列的宽高
哦,我表格已经画出来了,但是无法控制每行、每列的宽度和高度,怎么办?

每行的高度:根据该行控件的最大高度决定的(假如在TableRow加入了三个控件 A高20 B高30 C高40,那么该行的高度就是40,然后A,B默认是剧中与表格显示。)
这就是为什么没必要对TableRow设置宽高的原因,宽度被TableLayout控制了,高度被子View控制了。

如果有D没有设置layout_height,那么它的高度就为最大高度,也就是40

每列的宽度:同样是根据该列控件的最高宽度决定的。同上,就不解释了。
③、能够对每列设置参数
TableLayout有三个属性:
android:stretchColumns    设置可伸展的列。该列可以向行方向伸展,最多可占据一整行。(相当于对该列设置了layout_weight="1"占据剩余的控件,这不就时刻实现平均分割的效果了,吼吼)
android:shrinkColumns     设置可收缩的列。当该列子控件的内容太多,已经挤满所在行,那么该子控件的内容将往列方向显示。(当View长度超出了单元格的长度,就会将超出部分向下显示,会扩大行的高度)
android:collapseColumns 设置要隐藏的列。

示例:
android:stretchColumns="0"           第0列可伸展
android:shrinkColumns="1,2"         第1,2列皆可收缩
android:collapseColumns="*"         隐藏所有行
④、能够设置控件显示的位置
android:layout_column    指定该单元格在第几列显示
android:layout_span        指定该单元格占据的列数(未指定时,为1)
示例:
android:layout_column="1"    该控件显示在第1列
android:layout_span="2"        该控件占据2列

但是这么使用是由前提条件的。就是当前列是存在的。  什么叫当前列是存在的?
因为TableLayout的列是根据TableRow中的最大View数控制的。所以必须让显示的列在最大项之内,比如:现在TableLayout最大为5,但是我显示在第6列,这肯定是不可能的。
例:
    
        
            
            
            
            
            

到这里,TableLayout的使用就完成。大伙可以用TableLayout制作一个计算器~~~(源码可以自己查找。。)


等等等等。。你还没有讲怎么设置表格的分割线,就想逃。。。没有分割线,看起来一点都不像一个正常的表格

额,抱歉,抱歉,疏忽了。。。

三、TableLayout的问题

本人查找了好多篇文章,都没有找到TableLayout能够使用自身的属性来设置其分割线的。所以只能使用曲线救国的方法。。。
①、制作:TableLayout的边框

      //内部设置为透颜色  #00000000
    
设置为TableLayout的background。

②、设置单元格的分割线:
第一种设置分割线的方式,添加View控件然后 分割线的背景
缺点:View本身占了一个col,使用的时候需要小心。

通过这两个步骤,我们就能做出一行单元格了
    
        
            
            

            
            

            
        
    
第二种设置分割线的方式是使用drawable的layer_list然后设为背景。
缺点:背景颜色固定,不为透明


    
        
            
        
    

    
        
            
        
    

    
        
            

            

            
        
    
第三种方式:自己用ps制作一张png.9图片作为背景。。。
缺点:自己作图,还要设计为.9图片
代码就不展示了,只是换张图而已


效果:
如何制作表格(一)——TableLayout_第1张图片


如果我要制作两行单元格呢?
同样是添加一行分割线,效果图就不上传了
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@color/blue"/>
如果我要制作两行单元格呢?
同样是添加一行分割线,效果图就不上传了

你可能感兴趣的:(Android)