android 中使用TableLayout实现表单布局效果示例
使用TableLayout表格布局实现表单效果
1、核心知识点
android:divider="@drawable/table_v_divider" android:showDividers="middle|beginning|end"
2、样式代码
style样式
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--灰色8a8a8a18号字体，130宽，主要用于确认个人信息表格样式-->
<style name="style_table_gray6_18_130_text">
<item name="android:layout_width">@dimen/dimen_0</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textSize">@dimen/text_18</item>
<item name="android:textColor">@color/c_gray_6</item>
<item name="android:gravity">center</item>
<item name="android:padding">@dimen/dimen_10</item>
</style>
<!--黑色1c1c1c18号字体-->
<style name="style_table_black1_18_text">
<item name="android:layout_width">@dimen/dimen_0</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textSize">@dimen/text_18</item>
<item name="android:textColor">@color/c_black_1</item>
<item name="android:gravity">center_vertical</item>
<item name="android:singleLine">true</item>
<item name="android:ellipsize">end</item>
<item name="android:padding">@dimen/dimen_10</item>
</style>
</resources>
table_v_divider.xml文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<size
android:height="1dp" />
<solid android:color="@color/c_gray_6" />
</shape>
table_h_divider.xml文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<size
android:width="1dp" />
<solid android:color="@color/c_gray_6" />
</shape>
颜色
<color name="c_gray_6">#8a8a8a</color>
3、完整代码如下
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
style="@style/style_match_background_content">
<LinearLayout
style="@style/style_match_wrap_content"
android:layout_marginTop="@dimen/dimen_30"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="@dimen/dimen_10">
<android.support.v4.widget.Space
style="@style/style_black_2_26_text"
android:layout_weight="1" />
<TextView
style="@style/style_black_2_26_text"
android:gravity="right"
android:layout_weight="1"
android:layout_width="@dimen/dimen_0"
android:text="险种类型：" />
<EditText
android:id="@+id/et_plant_type"
style="@style/style_black_2_26_text"
android:layout_weight="3"
android:layout_width="@dimen/dimen_0"
android:background="@drawable/bg_et_down_selector"
android:hint="请选择" />
<android.support.v4.widget.Space
style="@style/style_black_2_26_text"
android:layout_weight="1" />
</LinearLayout>
<TableLayout
android:layout_margin="30dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_v_divider"
android:orientation="vertical"
android:showDividers="middle|beginning|end">
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="10"
android:text="基本信息" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="1"
android:text="姓名" />
<TextView
android:id="@+id/tv_table_name"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="基本信息" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="1"
android:text="性别" />
<TextView
android:id="@+id/tv_table_sex"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="男" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="身份证号" />
<TextView
android:id="@+id/tv_table_idnum"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="444444444444444444" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="3"
android:text="个人社保编号" />
<TextView
android:id="@+id/tv_table_ss_num"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="1"
tools:text="110" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="现参保单位" />
<TextView
android:id="@+id/tv_table_ss_current_insured_unit"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="4"
tools:text="110" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="10"
android:text="参保情况" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="3"
android:text="参保状态" />
<TextView
android:id="@+id/tv_table_insured_state"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="3"
tools:text="参保缴费" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="现缴费基数" />
<TextView
android:id="@+id/tv_table_payment_base"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="110" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="3"
android:text="参保起始时间" />
<TextView
android:id="@+id/tv_table_start_time"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="3"
tools:text="2018-06-12" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="缴费截止时间" />
<TextView
android:id="@+id/tv_table_pay_end_time"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="2018-06-12" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="3"
android:text="个人账号总月数" />
<TextView
android:id="@+id/tv_table_total_accounts"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="3"
tools:text="2018-06-12" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="个人账号存在额" />
<TextView
android:id="@+id/tv_table_personal_account_number"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="2018-06-12" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="3"
android:text="截止上月欠缴月数" />
<TextView
android:id="@+id/tv_table_not_months"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="3"
tools:text="2018-06-12" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="截止上月欠费金额" />
<TextView
android:id="@+id/tv_table_owe_the_amount"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="2018-06-12" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="10"
android:text="其它" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="@drawable/table_h_divider"
android:orientation="horizontal"
android:showDividers="middle|beginning|end">
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="3"
android:text="中断开始时间" />
<TextView
android:id="@+id/tv_table_break_start_time"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="3"
tools:text="2018-06-12" />
<TextView
style="@style/style_table_gray6_18_130_text"
android:layout_width="0dp"
android:layout_weight="2"
android:text="中断截止时间" />
<TextView
android:id="@+id/tv_table_break_end_time"
style="@style/style_table_black1_18_text"
android:layout_width="0dp"
android:layout_weight="2"
tools:text="2018-06-12" />
</TableRow>
</TableLayout>
</LinearLayout>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
赞 (0)
相关推荐
-
Android入门之TableLayout应用解析(二)
本文在上一篇初步介绍TableLayout常用属性的基础上,将进一步介绍如何UI设计器设计TableLayout + TableRow.由于实际应用中,经常需要在代码里往TableLayout添加数据(9宫图也可以用TableLayout做出来 ),本文就是介绍这方面的简单使用方法. main.xml的代码如下,用到TableLayout的ID为TableLayout01: <?xml version="1.0" encoding="utf-8"?> &
-
Android TableLayout数据列表的回显清空实现思路及代码
复制代码 代码如下: //数据列表的回显 public void shujuList(){ List<Customer> customerList = dao.findALL(); TableLayout tl = (TableLayout) findViewById(R.id.tlLayout); Log.i(">>>", String.valueOf(tl.getChildCount())); int j = tl.getChildCount(); i
-
Android入门之TableLayout应用解析(一)
本文初步讲述了Android中TableLayout的应用,对Android初学者有一定的学习借鉴价值.具体如下: TableLayout跟TableLayout 是一组搭配使用的布局,TableLayout置底,TableRow在TableLayout的上面,而Button.TextView等控件就在TableRow之上,另外,TableLayout之上也可以单独放控件.TableLayout是一个使用复杂的布局,最简单的用法就仅仅是拖拉控件做出个界面,但实际上,会经常在代码里使用TableL
-
详解Android TableLayout中stretchColumns、shrinkColumns的用法
详解Android 中TableLayout中stretchColumns.shrinkColumns的用法 android:stretchColumns="1" android:shrinkColumns="1"这两个属性是TableLayout所特有的,也是这两个属性影响了子对象的布局. 表格布局是按照行列来组织子视图的布局.表格布局包含一系列的Tabrow对象,用于定义行(也可以使用其它子对象).表格布局不为它的行.列和单元格显示表格线.每个行可以包含个以上(
-
Android布局之TableLayout表格布局
Tablelayout类以行和列的形式对控件进行管理,每一行为一个TableRow对象,或一个View控件.当为TableRow对象时,可在TableRow下添加子控件,默认情况下,每个子控件占据一列. 当为View时,该View将独占一行. 三个常用的属性 android:collapseColumns:设置需要被隐藏的列的序号 android:shrinkColumns:设置允许被收缩的列的列序号 android:stretchColumns:设置运行被拉伸的列的列序号 学习导图 (1)Ta
-
Android 表格布局TableLayout示例详解
一.表格布局 TableLayout 表格布局TableLayout以行列的形式管理子元素,每一行是一个TableRow布局对象,当然也可以是普通的View对象,TableRow离每放一个元素就是一列,总列数由列数最多的那一行决定. 我们看一个例子: <?xml version="1.0″ encoding="utf-8″?> <TableLayout android:id="@+id/TableLayout01″ android:layout_width=
-
Android布局之表格布局TableLayout详解
本文实例为大家分享了Android表格布局TableLayout的具体代码,供大家参考,具体内容如下 1.TableLayout TableLayout表格布局模型以行列的形式管理子控件,每一行为一个TableRow的对象, 当然也可以使一个View的对象 2.TableLayout的属性(全局属性) android:collapseColumns="1,2" 隐藏从0开始的索引列,列之间必须用逗号隔开1,2 android:shrinkColumns="1,2"
-
Android布局（RelativeLayout、TableLayout等）使用方法
本文介绍 Android 界面开发中最基本的四种布局LinearLayout.RelativeLayout.FrameLayout.TableLayout 的使用方法及这四种布局中常用的属性. LinearLayout 线性布局,布局中空间呈线性排列 RelativeLayout 相对布局,通过相对定位的方式,控制控件位置 FrameLayout 帧布局,最简单的布局,所有控件放置左上角 TableLayout 表格布局,以行列方式控制控件位置 四种布局示例 1.LinearLayout <Li
-
详解Android TableLayout表格布局
表格布局的标签是TableLayout,TableLayout继承了LinearLayout.所以它依然是一个线性布局. 前言: 1.TableLayout简介 2.TableLayout行列数的确定 3.TableLayout可设置的属性详解 4.一个包含4个TableLayout布局的实例及效果图 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="h
-
Android开发之TableLayout表格布局
表格布局模型以行列的形式管理子控件,每一行为一个TableRow的对象,当然也可以是一个View的对象.TableRow可以添加子控件,每添加一个为一列. TableLayout属性: android:collapseColumns:将TableLayout里面指定的列隐藏,若有多列需要隐藏,请用逗号将需要隐藏的列序号隔开. android:stretchColumns:设置指定的列为可伸展的列,以填满剩下的多余空白空间,若有多列需要设置为可伸展,请用逗号将需要伸展的列序号隔开. android