【Android】7.4TableLayout(表格布局)

摘要:
分类:C#,Android,VS2015;创建日期:2016-02-11 I.简介TableLayout也使用行和列来划分单元格,但不显示行、列和单元格的边框线。它的子元素由许多TableRows组成。每个TableRow定义表的一行。每行有0个或多个单元格,每个单元格都有一个View对象。使用TableLayout时,请注意每个单元格的宽度。TableLayout可以设置的属性包括全局属性和单元格属性。android:shernkColumns设置一个可收缩的列,即该列被向下挤压(变得更高)。android:columnsColumns设置要隐藏的列。此外,尽管GridLayout可以均匀分布列,但使用TableLayout显然不方便。

分类:C#、Android、VS2015;

创建日期:2016-02-11

一、简介

TableLayout也是用行和列划分单元格,但不会显示Row、Column以及Cell的边框线,其子元素有许多TableRow组成,每个TableRow定义表的一行(Row),每个Row拥有0个或多个单元格(Cell),每个Cell拥有一个View对象。

使用TableLayout时,应注意每个cell的宽度。

TableLayout可设置的属性包括全局属性及单元格属性。

1、全局属性

android:stretchColumns 设置可伸展的列,最多可占据一整行。

android:shrinkColumns 设置可收缩的列,即将该列向下挤压(变高了)。

android:collapseColumns 设置要隐藏的列。

例如:

android:stretchColumns="0" 第0列可伸展

android:shrinkColumns="1,2" 第1,2列皆可收缩

android:collapseColumns="*" 隐藏所有行

说明:某一列可以同时设置stretchColumns及shrinkColumns属性,即这一列根据宽度情况既可以伸展,又可以收缩。

2、单元格属性

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

android:layout_span 指定该单元格占据的列数(未指定时,默认为1)

例如:

android:layout_column="0" 该控件显示在第1列

android:layout_span="2" 该控件跨2列

3、横向平均分布各列

如果希望平均分布各列,将每列宽度设置为最小即可。另外,GridLayout虽然也能平均分布各列(见上一个例子),但显然没有用TableLayout方便。

总之,如果希望平均分布各列,应该用TableLayout实现而不是用GridLayout去实现。

二、示例-- Demo03TableLayout

1、运行截图

image

2、添加Demo03TableLayout.axml文件

在Resources/layout文件夹下添加该文件。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textColor="#ff0000"
      android:text="用法(1)--平均分布各列(指定宽度为1dip)"
      android:layout_margin="5dp" />
  <TableLayout
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:stretchColumns="*"
      android:padding="3dip">
    <TableRow>
      <TextView
          android:text="第0列"
          android:layout_width="1dip"
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:layout_gravity="center_vertical" />
      <TextView
          android:text="第1列"
          android:layout_width="1dip"
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:layout_gravity="center_vertical" />
      <TextView
          android:text="第2列(字数较多)"
          android:layout_width="1dip"
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:layout_gravity="center_vertical" />
    </TableRow>
  </TableLayout>
  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textColor="#ff0000"
      android:text="用法(2)--自动分布各列(不指定宽度)"
      android:layout_margin="5dp" />
  <TableLayout
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:stretchColumns="*"
      android:padding="3dip">
    <TableRow>
      <TextView
          android:text="第0列"
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:layout_gravity="center_vertical" />
      <TextView
          android:text="第1列"
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:layout_gravity="center_vertical" />
      <TextView
          android:text="第2列(字数较多)"
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:layout_gravity="center_vertical" />
    </TableRow>
  </TableLayout>
  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textColor="#ff0000"
      android:text="用法(3)--两端对齐"
      android:layout_margin="5dp" />
  <TableLayout
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:stretchColumns="1">
    <TableRow>
      <TextView
          android:layout_column="1"
          android:text="打开..."
          android:padding="3dip" />
      <TextView
          android:text="Ctrl-O"
          android:gravity="right"
          android:padding="3dip" />
    </TableRow>
    <TableRow>
      <TextView
          android:layout_column="1"
          android:text="保存..."
          android:padding="3dip" />
      <TextView
          android:text="Ctrl-S"
          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="导入..."
          android:padding="3dip" />
    </TableRow>
    <TableRow>
      <TextView
          android:text="X"
          android:padding="3dip" />
      <TextView
          android:text="导出..."
          android:padding="3dip" />
      <TextView
          android:text="Ctrl-E"
          android:gravity="right"
          android:padding="3dip" />
    </TableRow>
  </TableLayout>
  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textColor="#ff0000"
      android:text="用法(4)--伸展、收缩、隐藏、跨多列"
      android:layout_margin="5dp" />
  <TableLayout
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:stretchColumns="0"
      android:shrinkColumns="1"
      android:collapseColumns="2"
      android:padding="3dip">
    <TableRow>
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第0列(可伸展)" />
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第1列(可收缩)" />
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第2列(隐藏了)" />
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第3列" />
    </TableRow>
    <TableRow>
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第0列(可横向伸展)" />
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第1列(可收缩,即纵向拉伸)" />
      <TextView
          android:background="#7f00ffff"
          android:layout_margin="5dp"
          android:text="第2列(跨2列)"
          android:layout_span="2" />
    </TableRow>
  </TableLayout>
</LinearLayout>

3、添加Demo03TableLayout.cs文件

在SrcDemos文件夹下添加该文件。

using Android.App;
using Android.OS;
namespace ch07demos.SrcDemos
{
    [Activity(Label = "Demo03TableLayout")]
    public class Demo03TableLayout : Activity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);
            SetContentView(Resource.Layout.Demo03TableLayout);
        }
    }
}

免责声明:文章转载自《【Android】7.4TableLayout(表格布局)》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇试下Inceptor事务表和HDFS目录的关系。Django中常见字段类型简介下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

CSS 伪类选择器

对css的伪类选择器真的是又爱又恨,每次都很完美的被搞混了,还是得做一下总结。 1.  :nth-of-type(n)   选择第n个元素 1 <div class="box"> 2 <p>1 永远相信美好的事情</p> 3 <a>2 即将发生</a> 4 <p&g...

CSS制作凹环特效

就是在地面上打凿出凹的圆环效果,利用linear-gradient线性渐变增强内环质感,再用伪类after元素设置中心圆凸块的位置以及大小与跟内环之间的阴影度,然后设置内环的颜色就行了;第四个环上面的第二小凸块也同样适用伪类after元素然后设置z-index的顺序。在linear-gradient段内可以见到各种浏览器支持提示,Firefox Chrom...

NGUI系列教程二

接下来我们创建一个Label,NGUI->Open the Widget Wizard,打开widgetTool对话框,在Template中选择Label,确定AddTo右侧选项为panel,点击,Add To完成Label创建。 1.Label属性窗口如图 1.下面的节奏可能有点快,大家可以先熟悉一下上面讲的流程,再进行下面的学习。接下来我们...

CSS 基础知识(认识选择器)

定义: 层叠样式表(CascadingStyleSheets) 主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。 好处是通过定义某个样式,可以让不同网页位置的文字有着统一的字体、字号或者颜色等,设置文本和背景属性的能力,为任何元素创建边框及距离 语言特点: 易于修改、使用,将样式定义在HTML元素的style属性中,...

LESS 用法入门

本文旨在加深对 LESS 的理解和记忆,供自己开发时参考。相信对没有接触过 LESS 的程序员还是有用的,大佬绕路。 一、安装和使用 LESS 1.1 安装 使用命令行安装 LESS  npm install -g less 1.2 使用 less 有多种的使用方法,在这里我向大家介绍最常用的俩种方法。 第一种是直接在浏览器中使用: 去下载一个你要的le...

CSS之显示天气

 这个可以有,自从有了这个,以后查询天气就方便多了,哈哈。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head> <titl...