Test

Anroid开发总结一

                         Koupoo   2011-12-18

几条基本的准则

设计的UI应尽量适应各种的显示屏分辨率;

不要在非主线程中操作UI。

在非特殊情况下，应该避免使用px作为尺寸单位，而使用dip或sp

 

 

尺寸单位

使用Android为系统的机器的屏幕大小尺寸有很多种，常见的有240x320，320x480，480x800。理想下，我们希望程序能适应各种屏幕分辨率，这就要求在设计UI时，UI的大小相对的，而这可以通过使用dip或sp作为尺寸单位来实现。

UI的尺寸单位一般选择用dip，dip是destiny independent pixel（与密度无关的像素）的缩写，dip一般写作dp。

字符尺寸的单位一般选用sp，sp是scale independent pixel（与缩放无关的像素）的缩写。

使用dip或sp的作为尺寸单位的好处就是，当屏幕分辨率发生变化时，UI或字符的尺寸回自动放大或缩小。

 

 

盒子模型

在Android中，可以一个标准控件看作是一个盒子。按照盒子模型，控件可拆分为以下几个部分：内容(content)、填充(padding)、边框(border)、边界(margin)。对于这种盒子，我们能做的是设置内容、内容四周的填充大小、四周边界大小。

控件一般有一个默认的边框大小，这个是我们所不能设置的。以下图的TextView为例，content就是文字，padding就是文字与边框的距离，蓝色边框的四周便是边界（这个边界宽看作无穷小），而边界就是这个TextView周围的固有空白（透明）部分。

标准控件

Android提供了不少精美的标准UI，下面介绍笔者到目前为止接触过的标准UI和一些值得特别注意的地方（待续）。

 

TextView

用于显示不可编辑的文本

为突出效果，这里吧TextView的背景设为蓝色。TextView不仅用于显示一行，文字，也可以用于显示多行文字：

如果想控制字符与边框之间的距离，可以设置TextView的Padding属性。将上图的Padding属性设为：

则会有这样的效果

对应的

 

 

EditView

EditView继承于TextView，用户可以使用它输入信息。这个控件的突出特点是，它已经把各种数据格式的校验方法封装好了。可以通过设置该控件的input style属性来控制该控件允许接受的数据格式，如

input style属性值          说明

text                   EditView能输入任意的字符

textPassword           密码格式，输入的字符将被点号代替

textNumber            只允许输入数字    

textEmailAddress       输入的字符串的格式必须为电子右键的格式

TextView的input style的类型很多，常用数据各式都有，这可让程序员轻松了不少(^_^)。

 

ImageView

如果要显示图片，可以将View的background设置为想要显示的图片。但这样做有个明显的局限：图片会被拉伸或缩放到恰好充满整个View，而且不管你怎么修改View的属性，图片总是恰好充满整个View。想要更好的控制图片的显示方式（位置和大小），应该使用ImageView。关于如何使用ImageView控制图片的显示，打算在另写一篇文章详细介绍，所以这里就不多讲了。

 

 

不同的标准控件之间的一些共性

大部分标准控件都可以设置背景，而作为背景的可以是颜色，也可以是图片。

从布局上看，可以将控件看作盒子，具体参见前文。

 

布局

什么是布局？

一个UI控件的布局就是确定它的位置和大小。位置和大小不是完全孤立的，在相对布局中，控件位置可以影响控件的大小。

 

使用Android为系统的机器的屏幕大小尺寸有很多种，但Android系统提供了的好几种良好的UI布局机制，这使得 Android程序的UI设计具有很高的灵活性。你可以很容易使用这些UI布局机制设计出心目中的界面，并让界面自动适应种个分辨。

 

在Android程序界面的设计中有多种UI布局方式，最常用的是线性布局（LinearLayout）和相对布局相对布局（RelativeLayout）。下面将重点介绍常用的相对布局（RelativeLayout）。

 

一般我们希望程序能够在分辨率不同的机器上都能使用，

 

如果同一个方向上只有一个控件或两个两个控件，使用线性布局，否则使用相对布局。

 

LinearLayout 

线性布局，这中布局方式跟网页设计中使用的流式布局很相似。

 

RelativeLayout

相对布局。线性布局能做到的，相对布局也能做到；而相对布局能做到的，线性布局不一定能做到。一个线性布局不能做到的典型事情：将一个控件覆盖在另一个控件之上。下图将一个Button放到一个ImageView的正中间，这是线性布局所不能做到的。

上图的布局方式是：

imageView1和button1放在一个相对布局之中，而imageView和button1的位置布局设置是：Layout center in parent = true;

 

相对布局的原理是：一个控件的位置是根据其他控件的位置来确定的。比如上图中。若问button1在哪？则回答是button1在relativeLayout1的正中间。

注意控件的位置可能决定控件的大小，下面你将看到这一点；另外，一个控件位置的参照对象可以是同一个RelativeLayout之中（包括RelativeLayout自身）的其他任意一个控件对象。

 

相对布局能结局好另外一个线性布局所不能解决的问题：两边要挨着，中间要充满。

上图中蓝色矩形中，“条码”要在最左边，而“选择”按钮和“扫描”按钮要在最右边，中间的TextEdit要充满剩余空间。并且如果手机屏幕的分辨率不同，这种摆放方式应该不变，而这是线性布局所不能实现的，只能使用使用相对布局：

让TextView1和RelataiveLayout2的左边对齐：

 

让barCode位于TextView01的右边：

 

让barCode位于shopChoseBtn的左边：

 

让shopScanBtn和RelataiveLayout2的右边对齐：

 

让shopChoseBtn位于shopScanBtn的左边：

在这个例子中，另外值得注意是， TextView01的宽是由它的位置所确定的。

 

 

再举个例子来证明下相对布局的优越之处。现在，有一系列的信息需要放在圆角矩形框中显示，并且信息和各边框之间有一个固定的空白距离；各个信息的长度不同，假设最长的信息等于下图第三个圆角框中的信息，而最短的信息等于下图第二个圆角框中的信息。对应这种情况，该怎么处理呢？

 

由于圆角矩形的大小变化不算太大，可以使用同一张大小适中的圆角矩形图片作为信息的边框，这样对于显示任何信息，作为背景的圆角矩形图片都不会放生太大的变形。

 

因为显示信息的TextView的Layout Width肯定要为WRAP_CONTENT，所以圆角矩形图片不能直接设为信息TextView的背景，否则WRAP_CONTENT的范围就是圆角矩形图片而不是信息。这样，只能在显示信息的TextView之后放一个显示圆角矩形图片的控件（这里选择了ImageView）作为背景。控件要重叠在一起，所以只能用RelativeLayout。

 

ImageView02图片缩放方式：

 

ImageView02的布局方式：

TextView02的布局方式: 

 

 

流式布局VS相对布局

 

流式布局使用起来十分简单，因为下一个控件的位置总是在前一个控件的右边或下边, 这使得流式布局在控件位置的控制上显得十分的古板；想法，相对布局使用起来麻烦的多，你要自己参照其他控件来控制每个控件的位置，但正是这种麻烦，使得控件位置的布局上相当灵活（你将把控件放哪呢？）。

 

 

限于笔者水平有限，如果文中有不妥之处，敬请读者批评指正。联系邮箱：[e-mail]。