第七章设计界面布局.pptVIP

第7章 设计界面布局;7.1 创建界面;7.1.1 使用xml资源创建布局;7.1.2 使用代码创建布局;7.2 使用布局类;7.2.1 使用绝对布局; 2.通过代码创建绝对布局 在代码中实现动态进行布局会比较麻烦一些，要使用代码实现绝对布局需要以下5个步骤： （1）创建需要显示的组件对象； （2）创建布局参数对象； （3）创建绝对布局对象； （4）将组件对象添加到布局对象中，并赋予其相应的布局参数； （5）使用setContentView()方法将布局显示； ;运行代码后在模拟器中我们可以得到如图1所示界面，而在真机测试时得到的界面却如图2所示： 图1 图2;7.2.2 使用线性布局;1. 使用xml编写线性布局 在一个整体的垂直线性布局中有四个子视图，他们从上到下依次为TextView、LinearLayout、TextView、LinearLayout，接着在子视图的第一个LinearLayout中，从左向右排列了一排ImageView，第二个LinearLayout中，从上到下排列了一列ImageView。如果你愿意，你还可以继续向下层嵌套，当然最好不要嵌套太深的层数，因为这会大大地降低显示效率。其框架结构如图所示： ; 理解了本段代码的框架结构后我们再运行代码，看看效果是不是和我们希望的一样，效果如图所示： ;2. 使用代码编写线性布局 使用Java代码编写线性布局会比较麻烦，而且他们的层级结构会不显得没有xml代码那么清晰，后期修改代码时，包括改变参数时都会需要更多的工作量。 运行代码，效果如图所示： ;7.2.3 使用框架布局;将其指定为在父视图的底部，与此同时他们都通过： android:gravity=center 将文字定位在了本视图的中间。将程序运行，我们会看到如下图所示的效果： ; 2. 在Java代码中编写框架视图 在Java中编写框架布局的代码与编写线性布局类似，需要使用一些LayoutParams来设置属性，运行以上代码段，最后展示的效果与xml资源文件的布局方法是完全一样的。 ;7.2.4 使用表格布局;1. 使用xml文件创建表格布局 TableLayout与LinearLayout相似，添加到表格布局中的每个TableRow中的按照添加的先后顺序从上到下一次排列，然后添加到每个TableRow中的子视图按照添加顺序从左至右排列。 运行后，显示效果如下图所示： ; 2. 使用Java代码编写表格视图 使用Java代码编写表格视图时，需要使用两列参数设置分别是TableLayout.LayoutParams和TableRow.LayoutParams使用时需要注意。 ;7.2.5 使用关系布局;接下来，我们一起来完成一个有趣的实例，通过关系布局完成一个经典的太极八卦图，首先我们要准备一些图片，分别表示八卦的各个方位，如组图所示：;接下来让我们通过关系布局将这些杂乱的图片们组装起来吧！ 1. 使用xml代码创建关系布局 通过阅读程序中的注释相信大家应该可以独立完成阅读和理解工作，接下来我们就一起来看看运行之后的效果图吧！ ;接下来让我们总结一下关系布局中需要使用的属性，如表所示： ; 2. 使用Java代码创建关系布局 完成了八卦图之后，让我们尝试使用Java代码直接编写界面，并完成一张四神兽图。首先依然准备4张绚丽的图片，如图所示： ;接下来让我们一起把这四个神兽按照它们应该守护的方向（东——青龙，西——白虎，南——朱雀，北——玄武）组织起来。 运行代码，我们会看到如喜爱图所示效果： ;7.3 使用其他布局容器;7.3.1 使用TabActivity; 使用TabActivity入门非常简单，但要使用好它却需要大家多花一些时间的。标签页中的每一个标签都是一个非常高效的视图容器，它可以由XML预先定义也可以由TabFactory产生。接下来我开始学习使用TabActivity进行界面设计。 使用TabActivity需要如下几个步骤： （1）继承TabActivity； （2）获得TabHost对象； （3）实例化布局对象； （4）创建并设置TabSpec对象； （5）向TabHost中添加TabSpec完成标签页的使用；; 运行程序后显示如图所示：;7.3.2 自定义TabHost; 在代码中使用TabHost与TabActivyt比较相似，不同的只有开始的两个步骤，其具体步骤如下： （1）使用setContentView()方法显示界面 （2）获得TabHost对象并设置 （3）创建并设置TabSpec对象 （4）向TabHost中添加TabSpec完成标签页的使用