zoukankan      html  css  js  c++  java

  • Android TableLayout中的使用说明

    TableLayout特点： 

          1）TableLayout和我们平时在网页上见到的Table有所不同，TableLayout没有边框的 

          2）它是由多个TableRow对象组成，每个TableRow可以有0个或多个单元格，每个单元格就是一个View。这些TableRow，单元格不能 设置layout_width,宽度默认是fill_parent的，只有高度layout_height可以自定义，默认是 wrap_content。 

          3）单元格可以为empty，并且通过android:layout_column可以设置index值实现跳开某些单元格。在TableRow之间 

         4）添加View,设置layout_height以及背景色，就可以实现一条间隔线。android:layout_span可以设置合并几个单元格： 

    Java代码  收藏代码
    1. <?xml version="1.0" encoding="utf-8"?>   
    2.   
    3. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"   
    4.   
    5.     android:layout_width="fill_parent"   
    6.   
    7.     android:layout_height="fill_parent">   
    8.   
    9.     <TableRow>   
    10.   
    11.         <TextView   
    12.   
    13.             android:text="column1"   
    14.   
    15.             android:padding="3dip"  />   
    16.   
    17.         <TextView   
    18.   
    19.             android:text="column2"   
    20.   
    21.             android:padding="3dip"  />   
    22.   
    23.         <TextView   
    24.   
    25.             android:text="column3"   
    26.   
    27.             android:padding="3dip"  />   
    28.   
    29.     </TableRow>   
    30.   
    31.     <TableRow>   
    32.   
    33.         <TextView   
    34.   
    35.           android:text="column11"   
    36.   
    37.           android:visibility="invisible"/> //cell不见了   
    38.   
    39.         <TextView   
    40.   
    41.             android:text="左边的invisible"   
    42.   
    43.             android:gravity="right"   
    44.   
    45.             android:padding="3dip" />   
    46.   
    47.         <Button   
    48.   
    49.             android:id="@+id/go"   
    50.   
    51.             android:text="go"    
    52.   
    53.             android:padding="3dip" />   
    54.   
    55.         <Button   
    56.   
    57.             android:text="cancel"   
    58.   
    59.             android:padding="3dip" />   
    60.   
    61.     </TableRow>   
    62.   
    63.     <View                               //间隔线   
    64.   
    65.         android:layout_height="2dip"   
    66.   
    67.         android:background="#F00" />   
    68.   
    69.     <TableRow>   
    70.   
    71.         <TextView   
    72.   
    73.            android:text="右边的cell empty" />   
    74.   
    75.         <TextView   
    76.   
    77.             android:layout_column="2"   
    78.   
    79.             android:text="跳开empty cell"   
    80.   
    81.             android:padding="3dip" />   
    82.   
    83.     </TableRow>   
    84.   
    85.     <TableRow>   
    86.   
    87.         <TextView   
    88.   
    89.             android:text="合并3个单元格"   
    90.   
    91.             android:layout_span="3"   
    92.   
    93.             android:gravity="center_horizontal"   
    94.   
    95.             android:background="#FFC0C0C0"   
    96.   
    97.             android:textColor="#f00"   
    98.   
    99.             android:padding="3dip" />   
    100.   
    101.     </TableRow>   
    102.   
    103. </TableLayout>   


    没有设置收缩/伸展效果 


       注意，原来没有添加 android:padding="3dip" 的，发现那些column会凑在一起的，没有空白间隔！明显看到，那个cancel按钮被挤到几乎看不见了！这时候需要使用 
         1）android:shrinkColumns="可收缩的column"， 
         2）android:stretchColumns="可伸展的column"。 
        android:shrinkColumns和android:stretchColumns的值都是以0开始的index，但必须是string值，即 用"1,2,5"来表示。可以用"*"来表示all columns。而且同一column可以同时设置为shrinkable和stretchable。 
        如果使用TableLayout类的setColumnShrinkable/setColumnStretchable (int columnIndex, boolean isShrinkable)就麻烦些了，需要一个一个column来设置。也可以使用TableLayout的 setShrinkAllColumns/setStretchAllColumns来设置all columns。 
        判断这些column是否shrinkable或stretchable，可以调用 isColumnShrinkable/isColumnStretchable(int columnIndex)，isShrinkAllColumns()/isStretchAllColumns()。 

    Java代码  收藏代码
    1. <?xml version="1.0" encoding="utf-8"?>   
    2.   
    3. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"   
    4.   
    5.     android:layout_width="fill_parent"   
    6.   
    7.     android:layout_height="fill_parent"   
    8.   
    9.     android:shrinkColumns="0" > // 设置第一个column可收缩   
    10.   
    11.     <TableRow>   
    12.   
    13.         <TextView   
    14.   
    15.             android:text="column1"   
    16.   
    17.             android:padding="3dip"  />   
    18.   
    19.         <TextView   
    20.   
    21.             android:text="column2"   
    22.   
    23.             android:padding="3dip"  />   
    24.   
    25.         <TextView   
    26.   
    27.             android:text="column3"   
    28.   
    29.             android:padding="3dip"  />   
    30.   
    31.     </TableRow>   
    32.   
    33.     <TableRow>   
    34.   
    35.         <TextView   
    36.   
    37.           android:text="column11"   
    38.   
    39.           android:visibility="invisible"/>   
    40.   
    41.         <TextView   
    42.   
    43.             android:text="左边的invisible"   
    44.   
    45.             android:gravity="right"   
    46.   
    47.             android:padding="3dip" />   
    48.   
    49.         <Button   
    50.   
    51.             android:id="@+id/go2"   
    52.   
    53.             android:text="go2"    
    54.   
    55.             android:padding="3dip" />   
    56.   
    57.         <Button   
    58.   
    59.             android:text="cancel"   
    60.   
    61.             android:padding="3dip" />   
    62.   
    63.     </TableRow>   
    64.   
    65.     <View   
    66.   
    67.         android:layout_height="2dip"   
    68.   
    69.         android:background="#F00" />   
    70.   
    71.     <TableRow>   
    72.   
    73.         <TextView   
    74.   
    75.           android:text="右边的cell empty" />   
    76.   
    77.         <TextView   
    78.   
    79.             android:layout_column="2"   
    80.   
    81.             android:text="跳开empty cell"   
    82.   
    83.             android:padding="3dip" />   
    84.   
    85.         <TextView   
    86.   
    87.             android:text="123456789"   
    88.   
    89.             android:padding="3dip" />   
    90.   
    91.     </TableRow>   
    92.   
    93. </TableLayout>   


    可收缩column效果 


        现在可以看到第一个column为了让第4个column完整显示，而收缩得内容分为几行显示！ 

         而可伸展column的效果就是在其他column可以完整显示时，该column就会伸展，占最多空间： 
    <?xml version="1.0" encoding="utf-8"?> 

    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 

        android:layout_width="fill_parent" 

        android:layout_height="fill_parent" 

        android:stretchColumns="1"> // 设置第二个column可伸展 



       <TableRow> 

            <TextView 

                android:text="column1" 

                android:padding="3dip" /> 

            <TextView 

                android:text="column2" 

                android:gravity="right" 

                android:padding="3dip" /> 

            <TextView 

                android:text="column3" 

                android:padding="3dip"  /> 

        </TableRow> 



        <TableRow> 

            <TextView 

                android:text="column1" 

                android:padding="3dip" /> 

            <TextView 

                android:text="column2" 

                android:gravity="right" 

                android:padding="3dip" /> 

            <TextView 

                android:text="column3" 

                android:padding="3dip"  /> 

        </TableRow> 

    </TableLayout> 
    可伸展column效果 


          而动态隐藏column，可以调用TableLayout.setColumnCollapsed (int columnIndex, boolean isCollapsed)来指定相应的column。另外TableLayout类的boolean isColumnCollapsed (int columnIndex)能够判断指定的column是否隐藏。 

          TableLayout可以用来做网页上的Form显示效果，看看官方的sample： 
    <?xml version="1.0" encoding="utf-8"?> 

    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 

       android:layout_width="fill_parent" 

       android:layout_height="fill_parent" 

       android:stretchColumns="1"> 



       <TableRow> 

           <TextView 

               android:text="@string/table_layout_10_user" 

               android:textStyle="bold" 

               android:gravity="right" 

               android:padding="3dip" /> 



           <EditText android:id="@+id/username" 

               android:text="@string/table_layout_10_username_text" 

               android:padding="3dip" 

               android:scrollHorizontally="true" /> 

       </TableRow> 



       <TableRow> 

           <TextView 

               android:text="@string/table_layout_10_password" 

               android:textStyle="bold" 

               android:gravity="right" 

               android:padding="3dip" /> 



           <EditText android:id="@+id/password" 

               android:text="@string/table_layout_10_password_text" 

               android:password="true" 

               android:padding="3dip" 

               android:scrollHorizontally="true" /> 

       </TableRow> 



       <TableRow 

           android:gravity="right"> 



           <Button android:id="@+id/cancel" 

               android:text="@string/table_layout_10_cancel" /> 



           <Button android:id="@+id/login" 

               android:text="@string/table_layout_10_login" /> 

       </TableRow> 

    </TableLayout> 
    Form效果 
  • 相关阅读:
    覆盖式发布与非覆盖式发布
    GIT
    Web Service返回符合Xml Schema规范的Xml文档
    下拉渐显菜单
    计算网页上坐标的距离
    初识交互设计
    良好用户体验-实现过程！
    做 用户调研？
    这个没什么技术含量，实现起来很简单?
    SQL SERVER 登录问题！该用户与可信的Sql Server连接无关联
  • 原文地址：https://www.cnblogs.com/Free-Thinker/p/3391172.html
Copyright © 2011-2022 走看看