TableLayout大全

    xiaoxiao2021-04-19  228

    今天要实现的就是以下图片的TableLayout内容

     

    图1的实现:把第三行的Button的可见度设置为invisible 即android:visibility="invisible"

    图2的实现:把第2,3列或第3列设置为可收缩,即 android:shrinkColumns="2,3"

    图3的实现:把第0或列第1列设置为可扩展,即 android:stretchColumns="0"

    图4的实现:在图3的基础上加了两条下划线,下划线是用设置好背景色和高度的内容为空的  TextView实现的。关键代码如下所示:

     

     

        <TextView         android:background="#FF00FF"         android:height="2dip" /> 

    图5的实现:把可扩展列改为1,给第一条下划线的上面每一行的第一个组件指定列为1,即给 “open...,save...,save as...”这三个TextView指定列为一,如:

              <TextView             android:layout_column="1"             android:gravity="left"             android:padding="3dip"             android:text="save..." />

    图6,6.1,6.2的实现:(说明):点击图6左边的按钮效果如图6.1所示,再点击一下变回原样--多出的最左边的一列隐藏,点击图6右边的按钮效果如图6.2所示,再点击一下多出的最右边的一列隐藏。实效这样的效果关键是用了塌陷collapseColumns,该属性可以使相应的列隐藏,点击左边的按钮使第0列隐藏,再点击使其可见,点击右边的按钮使第2列隐藏,再点击使其可见即android:collapseColumns="0,2" table.setColumnCollapsed(2, flag);其中flag为Boolean类型。-------》

     

    public void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);         table = (TableLayout) findViewById(R.id.table);         toggle1 = (Button) findViewById(R.id.toggle1);         toggle2 = (Button) findViewById(R.id.toggle2);         //下面这两句很关键!!         mCheckmarksCollapsed = table.isColumnCollapsed(0);         mShortcutsCollapsed = table.isColumnCollapsed(2);                 toggle1.setOnClickListener(new OnClickListener() {        @Override    public void onClick(View v) {     mCheckmarksCollapsed = !mCheckmarksCollapsed;     table.setColumnCollapsed(0, mCheckmarksCollapsed);    }   });         toggle2.setOnClickListener(new OnClickListener() {                    @Override          public void onClick(View v) {           mShortcutsCollapsed = !mShortcutsCollapsed;           table.setColumnCollapsed(2, mShortcutsCollapsed);          }         });     }

    图7、图8的实现:跟图6的实现差不多,用到的是

    mToggleStreched = table.isColumnStretchable(2);

    table.setColumnStretchable(2, mToggleStreched);

     

    isShrinkable = table.isColumnShrinkable(1);

    table.setColumnShrinkable(1, isShrinkable);

    图9的实现非常简单,只设置下子View对齐方式和可扩展列即可。xml文件代码如下所示:

    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:id="@+id/table"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:stretchColumns="1">     <TableRow >         <TextView             android:gravity="right"             android:text="User"/>         <EditText />     </TableRow>     <TableRow >         <TextView             android:gravity="right"             android:text="Password"/>         <EditText />     </TableRow>     <TableRow >         <Button             android:gravity="center"             android:text="Cancel"/>         <Button             android:gravity="center"             android:text="Login"/>     </TableRow>     </TableLayout>

    图10的实现:第三行的“save as”是通过设置layout_gravity="center_horizontal",最后一行(非下划线),是通过设置View的高,"Export"与“Ctrl_E”的gravity实现。具体代码如下所示---------》

    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:id="@+id/table"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:stretchColumns="1">     <TableRow >         <TextView             android:layout_column="1"             android:text="open..."             android:gravity="left"             android:padding="3dip" />         <TextView             android:text="ctrl_O"             android:gravity="right"             android:padding="3dip" />     </TableRow>     <TableRow >         <TextView             android:layout_column="1"             android:text="save..."             android:background="#FF00FF00"             android:gravity="left"             android:padding="3dip" />         <TextView             android:text="ctrl_O"             android:gravity="right"             android:padding="3dip" />     </TableRow>     <TableRow >         <TextView             android:layout_column="1"             android:text="save as..."             android:background="#FF0000"             android:layout_gravity="center_horizontal"             android:padding="3dip" />         <TextView             android:text="ctrl_O"             android:background="#FFFF00FF"             android:gravity="right"             android:padding="3dip" />     </TableRow>     <View         android:layout_height="2dip"         android:background="#FF909090" />     <TableRow >         <TextView             android:text="X"             android:padding="3dip" />         <TextView             android:text="import"             android:padding="3dip" />     </TableRow>     <TableRow >      <View             android:layout_height="68dip"             android:background="#FF909090" />         <!-- Aligns the content of the cell to the bottom right -->         <TextView             android:text="table_layout"             android:background="#FFFF0000"             android:layout_gravity="right|bottom"             android:padding="3dip" />         <TextView             android:text="table_layout"             android:background="#FF00FFFF"             android:gravity="right"             android:padding="3dip" />     </TableRow>     <View         android:layout_height="2dip"         android:background="#FF909090" /> </TableLayout>

     

    图11的实现:通过android:layout_span="2" (占两列)来实现的 关键代码如下所示:     <TableRow >         <TextView             android:text="G"             android:layout_span="3"             android:gravity="center"             android:background="#FFFFabcd"             android:padding="3dip" />     </TableRow>    

     

    转载请注明原文地址: https://ju.6miu.com/read-676279.html

    最新回复(0)