设计android,界面布局

第7章设计界面布局本章我们将讲解如何在Android中进行界面布局。通过本章的学习，读者将掌握如何使用Android提供的一些布局类，LinearLayout、TableLayout、FrameLayout、RelativeLayout以及AbsoluteLayout。并且我们将学习一些功能与布局类类似的容器视图。.7.1创立界面在Android应用中创立界面通常有两种方法，一种是使用xml创立布局，这在之前的范例程序中经常被使用，也许读者朋友们对其已经比较熟悉了。第二种那么是在Java代码中实现，与使用xml文件相比，它更加灵活，更加“动态〞，缺点那么是会使代码比较混乱，不如使用xml文件那样结构清晰。.7.1.1使用xml资源创立布局使用xml资源文件创立界面时，文件位于/res/layout文件夹下。该方法是创立界面最方便也是最常用的方法，在创立时你需要为它赋予一些属性，当然在之后的程序代码中你还可以对其进行修改。.7.1.2使用代码创立布局如果你不愿意使用xml来创立布局，或者某些时候，使用xml创立布局反而不方便，这个时候你可以选择在Java代码中完成布局的创立工作。事实上，运行后效果如以下图所示：.7.2使用布局类AndroidSDK为我们提供了5个布局类，他们是：线性布局〔LinearLayotu〕、绝对布局〔AbsoluteLayout〕、表格布局〔TableLayout〕、关系布局〔RelativeLayout〕、框架布局〔FrameLayout〕。本节将逐一讲解这些类的使用方法和技巧。.7.2.1使用绝对布局绝对布局〔AbsoluteLayout〕视图是指为该布局内的所有子视图指定一个绝对的坐标。言归正传，我们来观察具体的绝对布局的使用方法。1.通过xml资源创立绝对视图运行后，界面显示到效果如下图：.2.通过代码创立绝对布局在代码中实现动态进行布局会比较麻烦一些，要使用代码实现绝对布局需要以下5个步骤：〔1〕创立需要显示的组件对象；〔2〕创立布局参数对象；〔3〕创立绝对布局对象；〔4〕将组件对象添加到布局对象中，并赋予其相应的布局参数；〔5〕使用setContentView()方法将布局显示；

.运行代码后在模拟器中我们可以得到如图1所示界面，而在真机测试时得到的界面却如图2所示：图1图2.7.2.2使用线性布局线性布局是开发人员在开发中使用最多的一类布局，甚至在Android新建工程时默认的布局都是LinearLayout。线性布局的作用是将所有的子视图按照横向或者纵向有序地排列。这里不得不提到线性布局特有的一个属性android:orientation，该属性的作用是指定本线性布局下的子视图排列方向：如果设置为“horizontal〞那么表示水平，方向为从左向右；假设设置为“vertical〞那么表示垂直，方向为从上向下。将多个线性布局嵌套可以完成大局部希望实现的效果。.1.使用xml编写线性布局在一个整体的垂直线性布局中有四个子视图，他们从上到下依次为TextView、LinearLayout、TextView、LinearLayout，接着在子视图的第一个LinearLayout中，从左向右排列了一排ImageView，第二个LinearLayout中，从上到下排列了一列ImageView。如果你愿意，你还可以继续向下层嵌套，当然最好不要嵌套太深的层数，因为这会大大地降低显示效率。其框架结构如下图：.理解了本段代码的框架结构后我们再运行代码，看看效果是不是和我们希望的一样，效果如下图：.2.使用代码编写线性布局使用Java代码编写线性布局会比较麻烦，而且他们的层级结构会不显得没有xml代码那么清晰，后期修改代码时，包括改变参数时都会需要更多的工作量。运行代码，效果如下图：.7.2.3使用框架布局框架布局非常简单而搞笑，如果使用层级视图工具〔HierarchyViewertool〕你会发现所有的布局都是在一个总体的框架布局中。事实上，我们的主界面〔Home界面〕就是使用的框架视图，每个小应用都是一个子视图。1.使用xml文件创立框架视图首先我们准备一张图片，如下图：.将其指定为在父视图的底部，与此同时他们都通过：android:gravity="center"将文字定位在了本视图的中间。将程序运行，我们会看到如以下图所示的效果：.2.在Java代码中编写框架视图在Java中编写框架布局的代码与编写线性布局类似，需要使用一些LayoutParams来设置属性，运行以上代码段，最后展示的效果与xml资源文件的布局方法是完全一样的。.7.2.4使用表格布局表格视图有些类似于我们平时使用的Excel表格，它将包含的子视图放在一个个单元格内，我们可以控制布局的行数以及列数。使用TableLayout可以很方便地构建计算器、拨号器等使用界面。.1.使用xml文件创立表格布局TableLayout与LinearLayout相似，添加到表格布局中的每个TableRow中的按照添加的先后顺序从上到下一次排列，然后添加到每个TableRow中的子视图按照添加顺序从左至右排列。运行后，显示效果如以下图所示：.2.使用Java代码编写表格视图使用Java代码编写表格视图时，需要使用两列参数设置分别是TableLayout.LayoutParams和TableRow.LayoutParams使用时需要注意。.7.2.5使用关系布局关系布局可以通过指定视图与其他视图的关系来确定其自身的位置，如位于某视图的上方、下方、左方、右方等，还可以指定它位于父布局的中间，右对齐、左对齐等等。这样可以防止使用多重布局，有效地提高了效率。.接下来，我们一起来完成一个有趣的实例，通过关系布局完成一个经典的太极八卦图，首先我们要准备一些图片，分别表示八卦的各个方位，如组图所示：.接下来让我们通过关系布局将这些杂乱的图片们组装起来吧！1.使用xml代码创立关系布局通过阅读程序中的注释相信大家应该可以独立完成阅读和理解工作，接下来我们就一起来看看运行之后的效果图吧！.接下来让我们总结一下关系布局中需要使用的属性，如表所示：属性描述值android:layout_centerInParent在父视图中正中心true/falseandroid:layout_centerHorizontal在父视图的水平中心线true/falseandroid:layout_centerVertical在父视图的垂直中心线true/falseandroid:layout_alignParentTop紧贴父视图顶部true/falseandroid:layout_alignParentBottom紧贴父视图底部true/falseandroid:layout_alignParentLeft紧贴父视图左部true/falseandroid:layout_alignParentRight紧贴父视图右部true/falseandroid:layout_alignTop与指定视图顶部对齐视图ID，如“@id/***”android:layout_alignBottom与指定视图底部对齐视图ID，如“@id/***”android:layout_alignLeft与指定视图左部对齐视图ID，如“@id/***”android:layout_alignRight与指定视图右部对齐视图ID，如“@id/***”android:layout_above在指定视图上方视图ID，如“@id/***”android:layout_below在指定视图下方视图ID，如“@id/***”android:layout_toLeft在指定视图左方视图ID，如“@id/***”android:layout_toRight在指定视图右方视图ID，如“@id/***”.2.使用Java代码创立关系布局完成了八卦图之后，让我们尝试使用Java代码直接编写界面，并完成一张四神兽图。首先依然准备4张绚丽的图片，如下图：

.接下来让我们一起把这四个神兽按照它们应该守护的方向〔东——青龙，西——白虎，南——朱雀，北——玄武〕组织起来。运行代码，我们会看到如喜爱图所示效果：.7.3使用其他布局容器我们还可以使用一些特殊的布局容器来进行屏幕的设计和布局，如使用ListActivity、TabActivity等，本节将讲解如何使用这些特殊的布局容器。.7.3.1使用TabActivity拥有Android使用经验的读者对于以下图肯定不陌生，这是联系人列表的显示方式，也许很多读者都很向往能够写出同样这么“酷〞的布局来，本小节就讲解Android中标签页的使用。.使用TabActivity入门非常简单，但要使用好它却需要大家多花一些时间的。标签页中的每一个标签都是一个非常高效的视图容器，它可以由XML预先定义也可以由TabFactory产生。接下来我开始学习使用TabActivity进行界面设计。使用TabActivity需要如下几个步骤：〔1〕继承TabActivity；〔2〕获得TabHost对象；〔3〕实例化布局对象；〔4〕创立并设置TabSpec对象；〔5〕向TabHost中添加TabSpec完成标签页的使用；.运行程序后显示如下图：.7.3.2自定义TabHost

在自定义TabHost时需要注意，在创立TabHost时需要以下3个步骤：〔1〕在xml资源文件中创立TabHost节点，并将id设置为tabhost；〔2〕创立TabWidget子节点，并设置id为tabs；〔3〕创立FrameLayout子节点，用作显示内容，其id为tabcontent；.在代码中使用TabHost与TabActivyt比较相似，不同的只有开始的两个步骤，其具体步骤如下：〔1〕使用setContentView()方法显示界面〔2〕获得TabHost对象并设置〔3〕创立并设置TabSpec对象〔4〕向TabHost中添加TabSpec完成标签页的使用.运行程序后，效果显示如下图：.7.3.3使用对话框对话框的功能非常强大，你可以通过对话框的按钮来判断用户的操作，也可以在对话框中添加布局和Widget，以便实现更多的功能。Dialog是所有对话框的基类，在平时我们真正使用的对话框有两种：AlertDialog以及ProgressDialog。.1.AlertDialog与Activity一样，Dialog也是有生命周期的，我们可以主动调用的两个函数分别是：showDialog〔intid〕：使Dialog对话框出现dismissDialog(intid)：使Dialog对话框消失.在新建AlertDialog时，我们一般需要设置以下几个重要局部：〔1〕setTitle〔Stringname〕：设置标题，显示在对话框的title位置。〔2〕setMessage〔Stringmessage〕：设置消息，这个是显示在对话框中的信息。〔3〕setIcon〔intresId〕：设置图片，参数是资源的ID。〔4〕setPositiveButton〔Stringname，OnClickListenerlistener〕：设置确定按钮。〔5〕setNegativeButton(Stringname，OnClickListenerlistener)：设置取消按钮。〔6〕setNeutralButton〔Stringname，OnClickListenerlistener〕：设置忽略按钮。.运行代码后，我们会看到如下图效果：.在listener中你可以完成所有你希望进行的工作，这里就简单设置为null。运行后效果如下图：.如果你希望提供用户多个选择时，可以将AlertDialog.Builder.setSingleChoiceItems(CharSequence[]items,intcheckedItem,OnClickListenerlistener)改为：AlertDialog.Builder.setMultiChoiceItems(CharSequence[]items,boolean[]checkedItems,OnMultiChoiceClickListenerlistener)将之运行后得到如下图的多项选择框效果：.如果你有自己的数据源需要显示，这个时候我们可以通过自己定义的ListView来显示，并且自己的ListView我们可以更好地进行界面的设计和响应，通过setView()方法我们可以将自定义的视图显示到Dialog上，运行代码后我们可以得到如下图效果：.你同样可以自定义多项选择框，运行后显示效果如下图：.2.使用ProgressDialog除了AlertDialog外，我们还经常使用ProgressDialog来为用户提供更好地操作体验，比方我们在使用地图效劳时搜索地点一般需要很长的时间，而这个时候我们就可以使用进度对话框来提示用户“正在搜索，请稍后〞等信息了。运行后效果如下图：.7.3.4使用滑动抽屉在使用Android时，我们经常会操作滑动抽屉，实际上滑动抽屉是一种特殊的Widget，不使用时它是隐藏的，需要时可以将之拖出进行操作。使用滑动抽屉时需要如下几个步骤：1.xml局部〔1〕在xml中使用<SlidingDrawer>节点，并设置属性。〔2〕设置handle局部，即为手柄，可以理解为抽屉的把手〔3〕设置content局部，这是抽屉的内容，也就是将抽屉拉开时我们看到的界面局部。.2.Java局部在Java局部，你可以不写任何代码，但这样SlidingDrawer的成效