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 

更多Android进阶指南 可以扫码 解锁 《Android十大板块文档》

1.Android车载应用开发系统学习指南（附项目实战）

2.Android Framework学习指南，助力成为系统级开发高手

3.2024最新Android中高级面试题汇总+解析，告别零offer

4.企业级Android音视频开发学习路线+项目实战（附源码）

5.Android Jetpack从入门到精通，构建高质量UI界面

6.Flutter技术解析与实战，跨平台首要之选

7.Kotlin从入门到实战，全方面提升架构基础

8.高级Android插件化与组件化（含实战教程和源码）

9.Android 性能优化实战+360°全方面性能调优

10.Android零基础入门到精通，高手进阶之路

敲代码不易，关注一下吧。ღ( ´･ᴗ･` ) 🤔