第三章 界面UI的基石—UI布局（1）

第三章界面UI的基石—UI布局

上一章我们一起学习了Android中的常用组件及一些UI编程的技术。在此基础上，我们就可以将这些组件有效的组织起来，构成一个美观、合理的界面。

在本章，我们先来详细说明Android中UI的几种布局，通过这几种布局就能将组件有效的组合到一起。然后说明在Android开发中如何应用样式和主题，通过样式和主题，可以预定义一系列的属性值，使整个应用程序形成统一的显示风格。

3.1 用户界面的基本单元—View视图

在Android SDK中，View（视图）类是视图类的一个超类。View代表了用户界面组件的一块可绘制的空间块。每一个View在屏幕上占据一个长方形区域。在这个区域内，这个View对象负责图形绘制和事件处理。每一个View都有一个用于绘图的画布，这个画布可以进行任意扩展。在游戏开发中也可以自定义View，这样画布的功能更能满足我们开发的需要。在Android SDK开发中，任何一个自定义的View都只需要重写onDraw()方法来实现界面显示。自定义的View可以是复杂的3D实现，也可以是非常简单的文本形式等。

下面，我们以一个为图片添加边框的例子来看看View是如何工作的吧。

首先，我们定义一个MyImageView继承自ImageView：

// import略 public class MyImageView extends ImageView{           private int color;         private int borderwidth;         public Canvas canvas = new Canvas();         public int status = 0;           public MyImageView(Context context) {             super(context);         }         public MyImageView(Context context, AttributeSet attrs,                 int defStyle) {             super(context, attrs, defStyle);         }         public MyImageView(Context context, AttributeSet attrs) {                         super(context, attrs);         }         // 设置颜色         public void setColour(int color){             this.color = color;         }           // 设置边框宽度         public void setBorderWidth(int width){             borderwidth = width;         }         @Override         protected void onDraw(Canvas canvas) {             super.onDraw(canvas);             this.canvas = canvas;             // 画边框             Rect rec = canvas.getClipBounds();             rec.bottom--;             rec.right--;             Paint paint = new Paint();             // 设置边框颜色             paint.setColor(color);             paint.setStyle(Paint.Style.STROKE);             // 设置边框宽度             paint.setStrokeWidth(borderwidth);             canvas.drawRect(rec, paint);         } }

 

接着，在布局文件中添加MyImageView。

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout     xmlns:android="http://schemas.android.com/apk/res/android"     android:orientation="vertical"     android:layout_width="match_parent"     android:layout_height="match_parent">     <com.chapter2.MyImageView         android:id="@+id/my_image"         android:layout_centerHorizontal="true"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:background="@drawable/ball"/> </RelativeLayout>

 

然后，在Activity中定义MyImageView，并为它设定边框宽度和颜色。

MyImageView image = (MyImageView)findViewById(R.id.my_image); image.setBorderWidth(5); image.setColour(Color.WHITE);

 

运行程序，让我们来看看效果图，如图3-1所示。

图3-1 为图片添加边框

 

可以看到，我们已经为这张图片添加好了边框。

在这个例子中，我们自定义了一个继承自ImageView的View，并重写了onDraw()方法，在onDraw()方法中对界面进行了重新的绘制，其中关于Canvas及Paint的使用，我们在后续的章节中会有介绍。

--------------------------------------------

试着放个广告 现在没工作 要生存 没办法

平安陆金所 隶属于平安集团的p2p平台

年投资回报率7%－9% 是替代银行理财的首选

个人经验教训 推荐投资安鑫或者有担保的彩虹项目

不要投资安e 那个几乎无法转让 想提前提现非常困难

注册链接  http://affiliate.lufax.com/action/36XBU

用此链接注册 你我都会有几十元的额外现金奖励

--------------------------------------------

 

经验分享： 我们在写布局文件的时候，第一行需要加入： xmlns:android="http://schemas.android.com/apk/res/android" 这个是xml的命名空间，有了它，当你需要输入内容时，你就可以按住“alt”和“/”键，这个时候，它就会提示你接下来有哪些是可以供选择输入的；另外，它还可以帮助你判断语法，当你出错的时候会给出相应的提示。