Android表格布局简单案例(附完整源码)

本博文是安卓的基础布局环节,没有高深度繁琐代码。先看下测试最终效果

测试效果

Android表格布局简单案例(附完整源码)_第1张图片
这就是将图片放进表格,比较直观。大家需要了解表格布局的精髓。

表格布局精髓

表格布局(TableLayout)是将页面划分成由行和列构成的单元格,由根元素TableLayout来标识。表格的行由TableRow来定义。由android:layout_column来指定列序号。

布局步骤

创建新Project

在这里插入图片描述
点进Project—>Empty Activity—>然后finish即可。成功之后,点击箭头运行程序。
在这里插入图片描述
默认配置的话,应该可以跑起来hello world。然后我们继续做下一个不走

上传图片资源

从网上照一张或者自己搞一张5050~7575之间的图片,任意但不要太大,格式任意,名字不要任意。名字英文!规范!初学者就取by吧(测试里用了by)
在这里插入图片描述
一定要拖到drawable,ok后,我们基础图片有了,直接上测试样例

布局测试源码

代码后对此作详细讲解。

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <TableRow>
        <ImageView android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            app:srcCompat = "@drawable/by"/>

    </TableRow>


    <TableRow >
        <ImageView android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            app:srcCompat = "@drawable/by"
            android:layout_column="1"
            />
        <ImageView android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            app:srcCompat = "@drawable/by"

            android:layout_column="2"/>
    </TableRow>
    <TableRow>
    <ImageView android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        app:srcCompat = "@drawable/by"
        android:layout_column="3"/>
    </TableRow>

</TableLayout>

TableLayout讲解

它是整一个表格布局页面,我们只是设置了它的width与height都是填充父元素

TableRow讲解

相当于excel的行单元格,只是包含,没有作详细的参数

ImageView讲解

width与height都是包含自己内容大小,图片路径是引用@drawable中的by,layout_column就是图片所处列的位置,默认从0开始,以此类推。会发现第二个TableRow有一个Colum= 1的参数,然后前面就有了一个图片大小的位置。就是这个道理

修改java类文件调用

一般按照默认配置,应该是这张图
在这里插入图片描述
然后启动程序,观察运行效果。

效果如图

Android表格布局简单案例(附完整源码)_第2张图片

总结

布局控制所需的步骤不是很多,步骤如下

  • 搭建新类
  • 上传资源图片
  • 编辑布局代码
  • 更改文件调用
  • run测试效果
    表格布局就是将原先组件进行覆盖,后期基础学习都用线性布局,可以参考博主写的这个博文:
    Android基础小白线性布局简单案例(附完整源码)
    希望此博文对大家有帮助!

你可能感兴趣的:(安卓尝试)