MyException - 我的异常网
当前位置:我的异常网» Android » Android Layout之4:Table Layout

Android Layout之4:Table Layout

www.MyException.Cn  网友分享于:2013-06-27  浏览:35次
Android Layout之四:Table Layout

Android Layout之四:Table Layout

 

转载自:http://android.blog.51cto.com/268543/314262

 

    TableLayout和我们平时在网页上见到的Table有所不同,TableLayout没有边框的,它是由多个TableRow对象组成,每个TableRow可以有0个或多个单元格,每个单元格就是一个View。这些TableRow,单元格不能设置layout_width,宽度默认是fill_parent的,只有高度layout_height可以自定义,默认是wrap_content。

 

     单元格可以为empty,并且通过android:layout_column可以设置index值实现跳开某些单元格。在TableRow之间,添加View,设置layout_height以及背景色,就可以实现一条间隔线。android:layout_span可以设置合并几个单元格。

 

示例效果一:(没有设置收缩/伸展效果

 

 

main.xml配置内容:

<?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">      
	<TableRow>         
		<TextView             
			android:text="column1"             
			android:padding="3dip"  
			/>         
		<TextView             
			android:text="column2"             
			android:padding="3dip"  
			/>         
		<TextView             
			android:text="column3"             
			android:padding="3dip"  
			/>     
	</TableRow>      
	<TableRow>         
		<TextView           
			android:text="column11"           
			android:visibility="invisible"
			/> <!-- cell不见了 -->        
		<TextView             
			android:text="左边的invisible"             
			android:gravity="right"             
			android:padding="3dip" 
			/>         
		<Button             
			android:id="@+id/go"             
			android:text="go"              
			android:padding="3dip" 
			/>         
		<Button             
			android:text="cancel"             
			android:padding="3dip" 
			/>     
	</TableRow>      
	<!-- 间隔线 -->
	<View                                        
		android:layout_height="1dip"         
		android:background="#F00" 
	/>      
	<TableRow>         
		<TextView             
			android:text="右边的cell empty" 
			/>         
		<TextView             
			android:layout_column="2"             
			android:text="跳开empty cell"             
			android:padding="3dip" 
			/>     
	</TableRow>          
	<TableRow>         
		<TextView             
			android:text="合并3个单元格"             
			android:layout_span="3"             
			android:gravity="center_horizontal"             
			android:background="#00FF00"             
			android:textColor="#f00"             
			android:padding="3dip" 
		/>     
	</TableRow> 
</TableLayout> 

 

结果如下图:



 

 

   注意,那些column会凑在一起的,明显看到,那个cancel按钮被挤到几乎看不见了!这时候需要使用android:shrinkColumns="可收缩的column",android:stretchColumns="可伸展的column"。
    android:shrinkColumnsandroid: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()。

 

 

 

 

示例效果二:(设置收缩效果 android:shrinkColumns="x"

 

 

 main.xml配置内容:

<?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:shrinkColumns="0"
	>      <!-- 设置第一个column可收缩  -->
	<TableRow>         
		<TextView             
			android:text="column1"             
			android:padding="3dip"  
			/>         
		<TextView             
			android:text="column2"             
			android:padding="3dip"  
			/>         
		<TextView             
			android:text="column3"             
			android:padding="3dip"  
			/>     
	</TableRow>      
	<TableRow>         
		<TextView           
			android:text="column11"           
			android:visibility="invisible"
			/> <!-- cell不见了 -->        
		<TextView             
			android:text="左边的invisible"             
			android:gravity="right"             
			android:padding="3dip" 
			/>         
		<Button             
			android:id="@+id/go"             
			android:text="go"              
			android:padding="3dip" 
			/>         
		<Button             
			android:text="cancel"             
			android:padding="3dip" 
			/>     
	</TableRow>      
	<!-- 间隔线 -->
	<View                                        
		android:layout_height="1dip"         
		android:background="#F00" 
	/>      
	<TableRow>         
		<TextView             
			android:text="右边的cell empty" 
			/>         
		<TextView             
			android:layout_column="2"             
			android:text="跳开empty cell"             
			android:padding="3dip" 
			/>  
		<TextView             
			android:text="123456789"             
			android:padding="3dip" 
			/>    
	</TableRow>          
</TableLayout> 

 

结果如下图:

 


 


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

 

 

示例效果三:(设置伸展效果 android:stretchColumns="x"

 

main.xml配置内容:

<?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:padding="3dip"  
			/>         
		<TextView             
			android:text="column3"             
			android:padding="3dip"  
			/>     
	</TableRow>      
	<TableRow>         
		<TextView             
			android:text="column1"             
			android:padding="3dip"  
			/>         
		<TextView             
			android:text="column2"             
			android:padding="3dip"  
			/>         
		<TextView             
			android:text="column3"             
			android:padding="3dip"  
			/>     
	</TableRow>          
</TableLayout> 

 

结果如下图:


 

可伸展column的效果就是在其他column可以完整显示时,该column就会伸展,占最多空间。

 

 

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

 

 


TableLayout可以用来做网页上的Form显示效果,看看官方的sample

 

main.xml 配置内容:

<?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="User"            
			android:textStyle="bold"            
			android:gravity="right"            
			android:padding="3dip" 
			/>         
		<EditText 
			android:id="@+id/username"            
			android:text=""            
			android:padding="3dip"            
			android:scrollHorizontally="true" 
			/>    
	</TableRow>     
	<TableRow>        
		<TextView            
			android:text="Password"            
			android:textStyle="bold"            
			android:gravity="right"            
			android:padding="3dip" 
			/>         
		<EditText 
			android:id="@+id/password"            
			android:text=""            
			android:password="true"            
			android:padding="3dip"            
			android:scrollHorizontally="true" 
			/>    
	</TableRow>     
	<TableRow>         
		<Button 
			android:id="@+id/cancel"            
			android:text="Cancel" 
		/>         
		<Button 
			android:id="@+id/login"            
			android:text="Login" 
		/>    
	</TableRow>         
</TableLayout> 

 

 

结果如下图:

 



 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

文章评论

Web开发者需具备的8个好习惯
Web开发者需具备的8个好习惯
团队中“技术大拿”并非越多越好
团队中“技术大拿”并非越多越好
程序员周末都喜欢做什么?
程序员周末都喜欢做什么?
当下全球最炙手可热的八位少年创业者
当下全球最炙手可热的八位少年创业者
程序员的鄙视链
程序员的鄙视链
旅行,写作,编程
旅行,写作,编程
 程序员的样子
程序员的样子
不懂技术不要对懂技术的人说这很容易实现
不懂技术不要对懂技术的人说这很容易实现
10个调试和排错的小建议
10个调试和排错的小建议
中美印日四国程序员比较
中美印日四国程序员比较
程序员眼里IE浏览器是什么样的
程序员眼里IE浏览器是什么样的
老程序员的下场
老程序员的下场
Web开发人员为什么越来越懒了?
Web开发人员为什么越来越懒了?
为什么程序员都是夜猫子
为什么程序员都是夜猫子
程序员和编码员之间的区别
程序员和编码员之间的区别
漫画:程序员的工作
漫画:程序员的工作
聊聊HTTPS和SSL/TLS协议
聊聊HTTPS和SSL/TLS协议
程序员应该关注的一些事儿
程序员应该关注的一些事儿
我跳槽是因为他们的显示器更大
我跳槽是因为他们的显示器更大
亲爱的项目经理,我恨你
亲爱的项目经理,我恨你
为啥Android手机总会越用越慢?
为啥Android手机总会越用越慢?
老美怎么看待阿里赴美上市
老美怎么看待阿里赴美上市
什么才是优秀的用户界面设计
什么才是优秀的用户界面设计
我的丈夫是个程序员
我的丈夫是个程序员
写给自己也写给你 自己到底该何去何从
写给自己也写给你 自己到底该何去何从
程序猿的崛起——Growth Hacker
程序猿的崛起——Growth Hacker
10个帮程序员减压放松的网站
10个帮程序员减压放松的网站
代码女神横空出世
代码女神横空出世
Java 与 .NET 的平台发展之争
Java 与 .NET 的平台发展之争
程序员都该阅读的书
程序员都该阅读的书
那些争议最大的编程观点
那些争议最大的编程观点
“肮脏的”IT工作排行榜
“肮脏的”IT工作排行榜
程序员的一天:一寸光阴一寸金
程序员的一天:一寸光阴一寸金
十大编程算法助程序员走上高手之路
十大编程算法助程序员走上高手之路
每天工作4小时的程序员
每天工作4小时的程序员
“懒”出效率是程序员的美德
“懒”出效率是程序员的美德
我是如何打败拖延症的
我是如何打败拖延症的
如何成为一名黑客
如何成为一名黑客
程序员必看的十大电影
程序员必看的十大电影
5款最佳正则表达式编辑调试器
5款最佳正则表达式编辑调试器
一个程序员的时间管理
一个程序员的时间管理
程序员最害怕的5件事 你中招了吗?
程序员最害怕的5件事 你中招了吗?
科技史上最臭名昭著的13大罪犯
科技史上最臭名昭著的13大罪犯
60个开发者不容错过的免费资源库
60个开发者不容错过的免费资源库
编程语言是女人
编程语言是女人
软件开发程序错误异常ExceptionCopyright © 2009-2015 MyException 版权所有