界面布局之表格布局TableLayout+TableRow

时间:2022-03-29 03:30:13

一、基础知识:

TableLayout置底,TableRow在TableLayout的上面,而Button、TextView等控件就在TableRow之上,

另外,TableLayout之上也可以单独放控件。TableLayout是一个使用复杂的布局,最简单的用法就仅

仅是拖拉控件做出个界面,但实际上,会经常在代码里使用TableLayout,例如做出表格的效果。

Android:collapseColumns:以第0行为序,隐藏指定的列
android:shrinkColumns:以第0行为序,自动延伸指定的列填充可用部分
android:stretchColumns:以第0行为序,尽量把指定的列填充空白部分

二、方案一代码展示:

方案一采用xml布局,在代码中除了显示layout之外,未作任何布局相关的操作。

1."Acticity_06\src\yan\acticity_06\MainActivity.Java"

  1. package yan.activity_06;
  2. import android.os.Bundle;
  3. import android.app.Activity;
  4. public class MainActivity extends Activity {
  5. @Override
  6. public void onCreate(Bundle savedInstanceState) {
  7. super.onCreate(savedInstanceState);
  8. setContentView(R.layout.activity_main);
  9. }
  10. }

2."Activity_06\res\layout\activity_main.xml"

  1. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="fill_parent"
  4. android:layout_height="fill_parent"
  5. tools:context=".MainActivity"
  6. android:stretchColumns="0" >
  7. <TableRow>
  8. <TextView
  9. android:text="第一行第一列"
  10. android:background="#aa0000"
  11. android:padding="3dip" />
  12. <TextView
  13. android:text="第一行第二列"
  14. android:padding="3dip"
  15. android:gravity="center_horizontal"
  16. android:background="#00aa00"
  17. ></TextView>
  18. <TextView
  19. android:text="第一行第三列"
  20. android:gravity="right"
  21. android:background="#0000aa"
  22. android:padding="3dip" />
  23. </TableRow>
  24. <TableRow>
  25. <TextView
  26. android:text="第二行第一列"
  27. android:padding="3dip" />
  28. <TextView
  29. android:text="第二行第二列"
  30. android:gravity="right"
  31. android:padding="3dip" />
  32. </TableRow>
  33. <TextView
  34. android:layout_width="wrap_content"
  35. android:layout_height="wrap_content"
  36. android:text="@string/hello_world" />
  37. </TableLayout>

三、方案二代码展示:

方案二采用代码布局,在layout文件中除了显示一个空的TabLayout之外,未作任何其它布局。

1."Acticity_06\src\yan\acticity_06\MainActivity.java"

  1. package yan.activity_06;
  2. import android.os.Bundle;
  3. import android.view.ViewGroup;
  4. import android.widget.TableLayout;
  5. import android.widget.TableRow;
  6. import android.widget.TextView;
  7. import android.app.Activity;
  8. public class MainActivity extends Activity {
  9. /** Called when the activity is first created. */
  10. private final int WC = ViewGroup.LayoutParams.WRAP_CONTENT;
  11. private final int FP = ViewGroup.LayoutParams.FILL_PARENT;
  12. @Override
  13. public void onCreate(Bundle savedInstanceState) {
  14. super.onCreate(savedInstanceState);
  15. setContentView(R.layout.activity_main);
  16. //新建TableLayout01的实例
  17. TableLayout tableLayout = (TableLayout)findViewById(R.id.TableLayout01);
  18. //全部列自动填充空白处
  19. tableLayout.setStretchAllColumns(true);
  20. //生成10行,8列的表格
  21. for(int row=0;row<10;row++)
  22. {
  23. TableRow tableRow=new TableRow(this);
  24. for(int col=0;col<8;col++)
  25. {
  26. //tv用于显示
  27. TextView tv=new TextView(this);
  28. tv.setText("("+col+","+row+")");
  29. tableRow.addView(tv);
  30. }
  31. //新建的TableRow添加到TableLayout
  32. tableLayout.addView(tableRow, new TableLayout.LayoutParams(FP, WC));
  33. }
  34. }
  35. }

2."Activity_06\res\layout\activity_main.xml"

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:orientation="vertical"
  4. android:layout_width="fill_parent"
  5. android:layout_height="fill_parent"
  6. >
  7. <TableLayout
  8. android:id="@+id/TableLayout01"
  9. android:layout_width="fill_parent"
  10. android:layout_height="wrap_content">
  11. </TableLayout>
  12. </LinearLayout>

三、效果展示:

1.方案一:

界面布局之表格布局TableLayout+TableRow

2.方案二:

界面布局之表格布局TableLayout+TableRow

参考文章有: http://blog.csdn.net/hellogv/article/details/4523745

http://blog.csdn.net/hellogv/article/details/4522125

本文完整代码下载地址: http://download.csdn.net/detail/ypist/5144652

本文博客源地址:http://blog.csdn.net/ypist