Android UI 实现表格布局

最新推荐文章于 2024-07-27 17:29:44 发布
最新推荐文章于 2024-07-27 17:29:44 发布
阅读量4.5k 收藏 8
点赞数 5
分类专栏： android布局表格布局 文章标签： 表单 ui android 实现表格线 androind表格
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ccc920123/article/details/46681437
版权

在android布局中我们都比较了解表单布局，但是很多时候我们在进行表达布局时为了是UI更加像表格，时我们都比较棘手了因为android提供的表格布局是没有表格线的。那么今天的这篇帖子将为你解决表格线的显示。先我们来看看效果

如图

其实这样是非常简单的。我们首先需要用到当然是TableLayout 。因为是表单布局嘛，这里不做过多的解释，然后还有用到TableRow来控制行，每行里面就可以 通过其他View来实现我们想要的方格，下面直接上代码

 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
 >
    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5.0sp"
        android:layout_marginRight="5.0sp"
        android:layout_marginTop="10.0sp"
        android:stretchColumns="1" >

        
<!--TableRow 表示行，每行里面就可以 通过其他View来实现我们想要的方格-->
        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="#ff000000" >

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:text="表格布局带表格线"
                android:textColor="#ff000000"
                android:textSize="25.0sp"
                android:textStyle="bold" />
        </TableRow>

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#ff000000" >

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginTop="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:text="第一行"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/delivercompanyname"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginTop="1.0dip"
                android:layout_weight="1.0"
                android:text="第二行"
                android:background="#ffffffff"
                android:gravity="center"
                android:textColor="#ff000000" />

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginTop="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
               android:text="第三行"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/repairtime"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginRight="1.0dip"
                android:layout_marginTop="1.0dip"
                android:layout_weight="1.0"
                android:text="第四行"
                android:background="#ffffffff"
                android:ellipsize="marquee"
                android:gravity="center"
                android:textColor="#ff000000" />
        </TableRow>

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#ff000000" >

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/hphm"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:ellipsize="marquee"
                android:gravity="center"
                android:textColor="#ff000000" />

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/ppxh"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginRight="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:ellipsize="marquee"
                android:gravity="center"
                android:textColor="#ff000000" />
        </TableRow>

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#ff000000" >

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/fdjh"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:ellipsize="marquee"
                android:textColor="#ff000000" />

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/dph"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginRight="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:ellipsize="marquee"
                android:gravity="center"
                android:textColor="#ff000000" />
        </TableRow>

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#ff000000" >

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <EditText
                android:id="@+id/miles"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:inputType="numberSigned"
                android:textColor="#ff000000" />

            <TextView
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:padding="6.0dip"
                android:textColor="#ff000000"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/lastrepairtime"
                android:layout_width="0.0dip"
                android:layout_height="fill_parent"
                android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginRight="1.0dip"
                android:layout_weight="1.0"
                android:background="#ffffffff"
                android:gravity="center"
                android:textColor="#ff000000" />
        </TableRow>
</TableLayout>
</RelativeLayout>


从代码中我们可以看出其实主要是TableRow 中android:background="#ff000000"背景设置成了黑色，当我们在需要添加TextView时 通过                

 

 

android:layout_marginBottom="1.0dip"
                android:layout_marginLeft="1.0dip"
                android:layout_marginTop="1.0dip"
android:background="#ffffffff"


来设置它背景为白色，通过与上边缘下边缘左边缘相隔1dip，这样就实现了表格有了表格线，其实原理就时叠加的方式，当最下面有一个大黑色的背景，上面在一个白色背景重叠并且白色背景的小于黑色背景这样就出现了表格线，我们如果要设置表格线的粗细只需设置他们相隔多少dip就行

 

 

想要更多的编程学习资料，请关注微信公众号：IT010101

 

 

 

代码码一代
关注
  • 5
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[转]android颜色对应的xml配置值
lishuiqing的专栏
10-14 2011
#FFFFFF #FFFFF0 #FFFFE0 #FFFF00 #FFFAFA #FFFAF0 #FFFACD #FFF8DC #FFF5EE #FFF0F5 #FFEFD5 #FFEBCD #FFE4E1 #FFE4C4 #FFE4B5 #FFDEAD #FFDAB9 #FFD700 #FFC0CB #FFB6C1 #FFA500 #FFA07A...
android简单实现表格布局,Android开发中TableLayout表格布局
weixin_34480323的博客
05-26 2696
Android开发中TableLayout表格布局一、引言在移动端应用程序开发中，常常会使用到表格布局，iOS和Android开发框架中都提供了独立的表格视图控件供开发者使用，例如iOS中的UITableView、UICollectionView，Android中的ListView、GridView等。除了独立的视图控件外，Android中还提供了一个布局容器类TableLayout，使用其也可以...
Android自定义View实现表格
qq_41008818的博客
12-31 1175
Android自定义View实现表格
Android开发Android Studio六大基本布局详解
qq_30725967的博客
06-17 1323
本文详解Android Studio六大基本布局。
【Android】UI布局之布局（帧布局、表格布局）
weixin_51293984的博客
08-09 553
TableLayout 派生自 ViewGroup，它可以将内部的 View 或者 Layout 整齐的排成几行几列，按照表格的形式摆放。我用使用标签标识一行，在标签内的 View 或者 Layout 都将摆放在同一行中。从屏幕左上角（0，0）坐标开始布局，多个组件层叠排序，后面的组件覆盖前面的组件。此布局通常用于软件的初始化页面，启动页面等。线性布局和相对布局都是平面的布局方式。android:gravity —> 文本在textview里面的位置。...
Android界面表单布局,Android应用开发Android UI--表格布局
weixin_40003046的博客
05-26 1030
Android应用开发Android UI--表格布局白羽2019-02-25来源 ：网络阅读 1488评论 0摘要：本文将带你了解Android应用开发Android UI--表格布局，希望本文对大家学Android有所帮助。本文将带你了解Android应用开发Android UI--表格布局，希望本文对大家学Android有所帮助。Android中表格布局是TableLayout，是Linea...
android 商城ui布局,Android UI布局
weixin_36459164的博客
05-27 220
1.线性布局(LinerLayout)1)android:orientation(设置方向的属性)两个方向的重要属性(vertical，horizontal)2)方向上的比重属性(layout_weight)3)layout_gravity和gravity的区别2.相对布局(RealateiveLayout)1)控件位置灵活多变的2)控件的属性比较多，但都是有规律可循的，所以结合案例多练习，不难记...
android精美表格布局,Android五大布局之一表格布局(TableLayout)
weixin_36257759的博客
05-26 969
一.TableLayout(表格布局)常用属性：android:collapseColumns:设置需要被隐藏的列的序号android:shrinkColumns:设置允许被收缩的列的列序号android:stretchColumns:设置运行被拉伸的列的列序号以上这三个属性的列号都是从0开始算的,比如shrinkColunmns = “2”,对应的是第三列！可以设置多个,用逗号隔开比如”0,2”...
Android基础学习常用UI布局
oschina_41673164的博客
10-22 1338
Android基础学习
android计算器表格布局,Android 计算器UI-TableLayout
weixin_27037521的博客
05-26 620
表格布局(TableLayout)android:layout_width="match_parent"android:layout_height="match_parent"android:stretchColumns="*" >android:layout_width="match_parent"android:layout_height="60dp"android:gravity="c...
Android开发之TableLayout表格布局
09-02
在Android开发中，TableLayout是布局管理器的一种，它允许开发者以表格的形式组织UI组件。这种布局方式对于创建类似表格的用户界面非常有用，比如展示数据列表或者进行设置选项的排列。下面我们将详细探讨...
Android 表格布局TableLayout示例详解
09-01
总结来说，Android的TableLayout布局提供了一种灵活的方式来构建二维的UI结构，通过调整不同的属性，可以实现各种复杂的表格布局效果。通过理解并熟练运用这些属性，开发者可以更好地满足用户界面的需求，创建出清晰...
详解Android TableLayout表格布局
09-02
在Android开发中，TableLayout是一种常用的布局方式，它允许开发者以表格的形式组织UI元素，非常适合构建数据展示或者用户输入的界面。TableLayout继承自LinearLayout，这意味着它同样支持垂直或水平排列的子视图，...
Android UI组件布局管理器
08-24
例如，一个复杂的布局可能由相对布局作为顶级容器，内部包含线性布局和表格布局等。通过熟练掌握这些布局，开发者能够更好地控制Android应用的视觉呈现。 在"LayoutTest"这个项目中，我们可以创建不同的布局测试...
2846. 边权重均等查询
最新发布
NEFU AB-IN's Blog
07-27 423
Leetcode 2846. 边权重均等查询
移动UI：运动风格具备什么特征，如何识别。
2401_82616673的博客
07-23 405
运动风格的UI设计会注重动态的交互设计，例如按钮点击时的反馈动画、菜单展开时的过渡效果等，使用户能够感受到界面的活力和生动性。运动风格的UI设计会模拟自然界的物理效果，例如弹簧效果、弹跳效果、惯性滚动等，使界面元素的运动更加贴近真实世界的物理规律。运动风格的UI设计通常会运用流畅的动画效果，例如过渡动画、元素的缓动效果等，以增强用户体验和吸引用户的注意力。运动风格的UI设计通常会运用渐变和阴影效果，以增加元素的立体感和深度感，使界面更加生动和具有层次感。
非UI设计师勿入，英文B端界面的确有可取之处.
2401_82943878的博客
07-27 206
作为中文的UI设计师，可以从英文B端界面中汲取设计灵感的几种方法： 注意英文B端界面的布局和结构，包括导航栏、侧边栏、内容区域等。观察它们的排列方式、比例和空白间隙的运用，可以借鉴到自己的设计中。 英文B端界面通常会使用精心挑选的配色方案，考虑到品牌形象和用户体验。可以研究它们使用的颜色搭配、色彩的明暗度和饱和度，从中获取灵感并应用到自己的设计中。 文B端界面通常注重用户友好的交互设计，包括动效、过渡效果、表单设计等。可以观察它们的交互细节，如按钮的悬停效果、表单的验证提示等，从中学习并应用到自己
导航网站WP主题/WP黑格导航主题BlackCandy-简约酷黑色高逼格+焕然一新的UI设计
hmz856的博客
07-23 518
导航网站WP主题-WP黑格导航主题BlackCandy，它有着简约酷黑色高逼格，而且有焕然一新的UI设计。它是一个简约漂亮的 WordPress 自媒体主题。黑格网址导航主题，自适应电脑端和手机端。BlackCandy-V2.0这次全新升级了！首次推出了专题区（就是推荐分类啦），还能选更多自定义颜色呢！选个你喜欢的颜色，加上全新的UI设计，看起来更扁平、更现代了！
深入解析Android UI布局设计
5. **表格布局(TableLayout)**：类似于HTML中的表格，用于组织内容成行和列。 6. **约束布局(ConstraintLayout)**：是Android推荐的现代布局，它允许开发者创建复杂的界面，同时保持高效的性能和良好的响应性。 UI...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值