文档章节

第五讲:用户界面 View(一)

程序袁_绪龙
 程序袁_绪龙
发布于 2014/08/25 11:02
字数 1268
阅读 12
收藏 0

一、什么是View

我们上节课说,Activity是Android程序的显示层,每一个显示窗口都是一个Activity;可是Activity本身无法显示在屏幕上,我们可以把它理解成是一个抽象层,一个壳子;就譬如一个JSP页面,它本身并没有显示出来任何东西,负责显示的是他生成的HTML标签。那么Android里谁才是真正显示出来的部分?--是View和ViewGroup,而ViewGroup其实也是View的子类。

有了上述的概念,我们现在可以讲明白一个Activity中的显示元素是如何显示出来的了。首先UI组件是按层次结构来由外到内的方式逐步展示的。要将一个屏幕元素层次树绑定在一个屏幕上显示,Activity会调用它的setContentView()方法并且传入这个层次树的根节点引用。当Activity被激活并且获得焦点时,系统会通知activity并且请求根节点去计算并绘制树,根节点就会请求它的子节点去绘制它们自己。每个树上的ViewGroup节点会负责绘制它的子节点。ViewGroup会计算它的有效空间,布局所有的子显示对象,并最终调用所有的子显示对象的 Draw()方法来绘制显示对象。各个子显示对象可以向父对象请求它们在布局中的大小和位置,但最终决定各个子显示对象的大小和位置的是父对象。

Android程序借助View和ViewGroup对象来构建用户界面。Android提供了比HTML多得多的,现成的用户界面组件,譬如现在网站上常见的五角星评分效果组件RatingBar。RatingBar的显示效果如下图所示:

image

二、常用Layout介绍

ViewGroup是个特殊的View,它继承于Android.view.View。它的功能就是装载和管理下一层的View对象或ViewGroup对象,也就说他是一个容纳其它元素的的容器。ViewGroup是布局管理器(layout)及view容器的基类。 ViewGroup中,还定义了一个嵌套类ViewGroup.LayoutParams。这个类定义了一个显示对象的位置、大小等属性,view通过LayoutParams中的这些属性值来告诉父级,它们将如何放置。

image

ViewGroup是一个抽象类,所以真正充当容器的是他的子类们。我们在这里将介绍 帧布局FrameLayout,线性布局LinearLayout,绝对布局AbsoluteLayout,相对布局RelativeLayout,表格布局TableLayout等几个常用布局,大约要分3讲讲完。

1、帧布局 FrameLayout:

是最简单的一个布局对象。在他里面的的所有显示对象爱你过都将固定在屏幕的左上角,不能指定位置,但允许有多个显示对象,只是后一个会直接覆盖在前一个之上显示,会把前面的组件部分或全部挡住。下图的例子里,FrameLayout中放了3个ImageView组件,第一个是蓝色的,第二个是绿色的,第三个是树状图(透明的png格式)。ImageView就相当于Html中的img标签,接下来会讲到这个组件。

下面看一个FrameLayout的例子:

<?xml version=”1.0″ encoding=”utf-8″?>

<FrameLayout android:id=”@+id/FrameLayout01″
android:layout_width=”fill_parent” android:layout_height=”fill_parent”
xmlns:android=”http://schemas.android.com/apk/res/android”>

<ImageView android:id=”@+id/ImageView01″ android:src=”@drawable/p1″
android:layout_width=”wrap_content” android:layout_height=”wrap_content”></ImageView>

<ImageView android:id=”@+id/ImageView02″ android:src=”@drawable/p2″
android:layout_width=”wrap_content” android:layout_height=”wrap_content”></ImageView>

<ImageView android:id=”@+id/ImageView03″ android:src=”@drawable/p3″
android:layout_width=”wrap_content” android:layout_height=”wrap_content”></ImageView>

</FrameLayout>

完整的代码在PPT附带的目录中,需要的朋友可以留言向我索要。

image
(FrameLayout的显示效果)

2、线性布局 LinearLayout:

线性布局是所有布局中最常用的类之一,也是RadioGroup, TabWidget, TableLayout, TableRow, ZoomControls类的父类。LinearLayout可以让它的子元素垂直或水平的方式排成一行(不设置方向的时候默认按照垂直方向排列)。

下面看一个LinearLayout的例子:别被例子的长度吓住,仔细看一下其实就是一个LinearLayout中放5个TextView标签而已,TextView相当于Html标签中的Label。

<?xml version=”1.0″ encoding=”utf-8″?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
android:orientation=”vertical”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
android:gravity=”center_horizontal”
>
<TextView
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”给小宝宝起个名字:”
android:textSize=”20px”
android:textColor=”#0ff”
android:background=”#333″

/>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”遥遥是男孩的小名”
android:textSize=”20px”
android:textColor=”#0f0″
android:background=”#eee”
android:layout_weight=”3″
/>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”瑶瑶是女孩的小名”
android:textColor=”#00f”
android:textSize=”20px”
android:background=”#ccc”
android:layout_weight=”1″
/>

<TextView
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”海因是男孩的大名”
android:textColor=”#f33″
android:textSize=”20px”
android:background=”#888″
android:layout_weight=”1″
/>
<TextView
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:text=”海音是女孩的大名”
android:textColor=”#ff3″
android:textSize=”20px”
android:background=”#333″
android:layout_weight=”1″
/>
</LinearLayout>

下图是显示效果:

image

好吧下次再讲。

本文转载自:http://android.yaohuiji.com/archives/196

程序袁_绪龙
粉丝 106
博文 242
码字总数 66750
作品 0
普陀
程序员
私信 提问
ZigBEE

手把手教你学Zigbee第一讲:http://www.tudou.com/programs/view/fQattIYSwBo/ 手把手教你学Zigbee第二讲:http://www.tudou.com/programs/view/7-dIvUgk2kg/ 手把手教你学Zigbee第三讲:htt...

GIFCOOL
2016/09/02
33
0
cyzhang/docker-training

cSphere Docker 实训课程 课程安排 第一讲 Docker 实战之入门以及 Dockerfile 第二讲 Docker 实战之 Registry 以及持续集成 第三讲 Docker 实战之监控管理以及日志管理 第四讲 Docker 实战之...

cyzhang
2016/01/28
0
0
下载基于.NET架构的农产品大数据电商平台全程实录(MVC、Web API、WCF、Redis、Solr)

转一播放码,需要少许费用,联系QQ:380539674 课程下载地址:http://pan.baidu.com/s/1o7MIuU2 180多节 一、果多芬电商系统前台部分讲解: 第一讲 果多芬电商平台概述及开发环境搭建 第二讲...

听半的曲
2016/09/15
0
0
Wex5 3.3版本仿淘宝开发视频

第一讲 仿淘宝概述 第二讲 创建应用和首页开发 第三讲 分类页和列表页 第四讲 商品详细页和微信分享 第五讲 购物车页和搜索页 视频下载地址:http://wex5.com/cn/downloads/ QQ交流群:30057...

muyu
2016/01/16
1K
0
nutch使用nodedumper命令查看inlinks

@杨尚川 你好,想跟你请教个问题: 我看了你的nutch相关视频,现在看到了第五讲。可是我遇到了一些问题: ps:我用的是nutch1.10版本。 当我使用bin/nutch nodedumper -inlinks -output inlin...

stoneHah
2015/08/30
78
0

没有更多内容

加载失败,请刷新页面

加载更多

火焰图(flame graph)是性能分析利器

Perf命令 Perf 命令(performance的简写)是 Linux 系统原生提供的性能分析工具,返回 CPU 正在执行的函数名以及调用栈(stack)。 通常,它的执行频率是 99Hz(每秒99次),如果99次都返回同一个...

呼呼南风
刚刚
0
0
 好程序员大数据知识点精讲 大数据之Linux

好程序员大数据知识点精讲 大数据之Linux -Linux是什么? Linux是一套作业系统,不是应用程序Linux的基本思想有两点:第一,一切都是文件;第二,每个软件都有确定的用途。 Shell——命令行解...

好程序员IT
5分钟前
0
0
mysql 多行结合

select a1.email as email ,a1.bg ,IFNULL(a1.bg, a2.bg) from ( select * from test01 where sdate = '2019-09-11' ) a1 LEFT join (select * from test01 where sdate = '2019-09-10') a2 ......

昏鸦
6分钟前
0
0
Netflix Eureka 续约 & 更新注册表信息

Eureka Client 要定期的向 Eureka Server 发送心跳请求以保持续约的状态。 也需要定期的从 Eureka Server 获取服务注册表数据,并将服务注册表数据缓存在客户端实例内。 Eureka Client 续约 ...

BryceLoski
10分钟前
1
0
IT兄弟连 Java语法教程 Java开发环境 JVM、JRE、JDK

要想开发Java程序,就需要知道什么是JVM、JRE以及JDK。JVM是运行Java程序的核心,JRE是支持Java程序运行的环境,而JDK是Java开发的核心,下面我们分别具体介绍它们以及它们之间的关系。 1.J...

老码农的一亩三分地
18分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部