- 浏览: 10429 次
- 性别:
- 来自: 北京
最近访客 更多访客>>
文章分类
- 全部博客 (7)
- BINDER_VM_SIZE (0)
- android实现触摸屏校准 (0)
- android api 中文(82) —— InputConnection (0)
- ext4数据丢失 (0)
- Lost all settings after battery change (0)
- Unable to find decl for native > Lcom/android/internal/os/RuntimeInit (0)
- busybox unmount data (0)
- fix permission (0)
- watchdog systerver重启原因 (0)
- android LocalSocketImpl.readba_native hang (0)
- GpsLocationProvider.java中的reportAGpsStatus调用 (0)
- libkia.so (0)
- /data/dalvik-cache (0)
- ActivityManagerService启动新的process过程分析 (0)
- 分析tombstone (0)
- SSSAAAAAAAA (0)
- 优缺点 (0)
- monkey test mms unable to find or allocate a thread id force close (0)
- loadLabel (0)
- 心理咨询中 (0)
- 手写先识别,之后提交五笔识别 (0)
- hipri (0)
- SetScreenState(true) (0)
- events (0)
- PowerManager (0)
- 啊啊啊 (0)
- 关机闹钟 (0)
- powermanagerservice屏幕亮灭屏 (0)
- svn cache (0)
- message处理 (0)
- core/res/res/values/styles.xml themes.xml (0)
- Screen off timer (0)
最新评论
【转】 android UI优化
2010-05-20 17:22
转载自 liuhuman
最终编辑 liuhuman
在Android中最常用LinearLayout表示UI的框架,而且也是最直观和方便的方法。例如创建一个UI用于展现Item的基本内容。如图所示:
线框图:
直接可以通过LinearLayout快速的实现这个UI的排列:
?View Code XML
<LinearLayout xmlns:
android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginRight="6dip"
android:src="@drawable/icon" />
<LinearLayout
android:orientation="vertical"
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="fill_parent">
<TextView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="My Application" />
<TextView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:singleLine="true"
android:ellipsize="marquee"
android:text="Simple application that shows how to use RelativeLayout" />
</LinearLayout>
</LinearLayout>
尽管可以通过Linearlayout实现我们所预想的结果,但是在这里存在一个优化的问题,尤其是针对为大量Items。比较RelativeLayout和LinearLayout,在资源利用上前者会占用更少的资源而达到相同的效果,以下是用RelativeLayout实现的代码:
View Code XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:layout_marginRight="6dip"
android:src="@drawable/icon" />
<TextView
android:id="@+id/secondLine"
android:layout_width="fill_parent"
android:layout_height="26dip"
android:layout_toRightOf="@id/icon"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:singleLine="true"
android:ellipsize="marquee"
android:text="Simple application that shows how to use RelativeLayout" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/icon"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_above="@id/secondLine"
android:layout_alignWithParentIfMissing="true"
android:gravity="center_vertical"
android:text="My Application" />
</RelativeLayout>
针对RelativeLayout有一点需要注意,因为它内部是通过多个View之间的关系而确定的框架,那么当其中某一个View因为某些需要调用GONE来完全隐藏掉后,会影响与其相关联的Views。Android为我们提供了一个属性 alignWithParentIfMissing 用于解决类似问题,当某一个View无法找到与其相关联的Views后将依据alignWithParentIfMissing的设定判断是否与父级View对齐。
下边是两种不同layout在Hierarchy Viewer中的层级关系图:
简单或复杂的问题都需要时常考虑如何优化资源的分配。比如一个功能很简单的应用程序,它会调用一些我们常用的对话框或者输入面板,这需要采用统一的方式来针对不同的应用程序制定统一标准。
当我们面对Android UI优化时,有必要继续考虑资源复用。手机开发给我们的直观感觉是运行其上的软件应该尽可能的达到资源高效利用的极致,而不能像开发PC机那样,似乎有用之不尽的资源。
定义Android Layout(XML)时,有四个比较特别的标签是非常重要的,其中有三个是与资源复用有关,分别是 <viewStub />, <requestFocus />, <merge /> and <include />。可是以往我们所接触的案例或者官方文档的例子都没有着重去介绍这些标签的重要性。
<viewStub />: 此标签可以使UI在特殊情况下,直观效果类似于设置View的不可见性,但是其更大的(R)意义在于被这个标签所包裹的Views在默认状态下不会占用任何内存空间。viewStub通过include从外部导入Views元素。
用法:通过android:layout来指定所包含的内容。默认情况下,ViewStub所包含的标签都属于visibility=GONE。viewStub通过方法inflate()来召唤系统加载其内部的Views。
<ViewStub android:id="@+id/stub"
android:inflatedId="@+id/subTree"
android:layout="@layout/mySubTree"
android:layout_width="120dip"
android:layout_height="40dip" />
<merge />: 将在下面做详细介绍。
<include />:可以通过这个标签直接加载外部的xml到当前结构中,是复用UI资源的常用标签。
用法:将需要复用xml文件路径赋予include标签的Layout属性。
<include android:id="@+id/cell1" layout="@layout/ar01" />
<include android:layout_width="fill_parent" layout="@layout/ar02" />
<requestFocus />: 标签用于指定屏幕内的焦点View。
用法: 将标签置于Views标签内部 <!-- Easy AdSenser V2.37 --><!-- Post[count: 2] -->
<EditText id="@+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:paddingBottom="4">
<requestFocus />
</EditText>
单独将<merge />标签做个介绍,是因为它在优化UI结构时起到很重要的作用。目的是通过删减多余或者额外的层级,从而优化整个Android Layout的结构。
将通过一个例子来了解这个标签实际所产生的作用,这样可以更直观的了解<merge/>的用法。
建立一个简单的Layout,其中包含两个Views元素:ImageView和TextView 默认状态下我们将这两个元素放在FrameLayout中。其效果是在主视图中全屏显示一张图片,之后将标题显示在图片上,并位于视图的下方。以下是xml代码:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="center"
android:src="@drawable/golden_gate" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dip"
android:layout_gravity="center_horizontal|bottom"
android:padding="12dip"
android:background="#AA000000"
android:textColor="#ffffffff"
android:text="Golden Gate" />
</FrameLayout>
应用上边的Layout运行的视图为:
启动 tools> hierarchyviewer.bat工具查看当前UI结构视图:
我们可以很明显的看到由红色线框所包含的结构出现了两个framelayout节点,很明显这两个完全意义相同的节点造成了资源浪费(这里可以提醒大家在开发工程中可以习惯性的通过hierarchyViewer查看当前UI资源的分配情况),那么如何才能解决这种问题呢(就当前例子是如何去掉多余的frameLayout节点)?这时候就要用到<merge />标签来处理类似的问题了。我们将上边xml代码中的framLayout替换成merge:
<!-- Easy AdSenser V2.37 --><!-- Post[count: 2] -->
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="center"
android:src="@drawable/golden_gate" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dip"
android:layout_gravity="center_horizontal|bottom"
android:padding="12dip"
android:background="#AA000000"
android:textColor="#ffffffff"
android:text="Golden Gate" />
</merge>
运行程序后在Emulator中显示的效果是一样的,可是通过hierarchyviewer查看的UI结构是有变化的,当初多余的 FrameLayout节点被合并在一起了,或者可以理解为将merge标签中的子集直接加到Activity的FrameLayout跟节点下(这里需要提醒大家注意:所有的Activity视图的根节点都是frameLayout)。如果你所创建的Layout并不是用framLayout作为根节点(而是应用LinerLayout等定义root标签),就不能应用上边的例子通过merge来优化UI结构。
除了上边的例子外,meger还有另外一个用法
当应用Include或者ViewStub标签从外部导入xml结构时,可以将被导入的xml用merge作为根节点表示,这样当被嵌入父级结构中后可以很好的将它所包含的子集融合到父级结构中,而不会出现冗余的节点。
另外有两点需要特别注意:
<merge />只可以作为xml layout的根节点。
当需要扩充的xml layout本身是由merge作为根节点的话,需要将被导入的xml layout置于 viewGroup中,同时需要设置attachToRoot为True。(更多说明请参见inflate()文档)
本文来自:http://wghjay.iteye.com/blog/425623
类别:Android | | 添加到搜藏 | 分享到i贴吧 | 浏览(94) | 评论 (0)
下一篇:[转]CSDN赵新 事件处理
相关文章:
• 关于android ui的优化 view 的绘... • Android优化UI秘籍【zt】
• Android UI学习 - FrameLayou和... • Android开发之ListView 适配器(A...
• 安卓优化大师 v1.29!Android手机... • android 应用TabHost优化Activit...
• 关于android "shake shake 摇摆 ... • 优化Android代码的知识
• Android进程管理机制及优化 for ... • Android layout 优化
更多>>
2010-05-20 17:22
转载自 liuhuman
最终编辑 liuhuman
在Android中最常用LinearLayout表示UI的框架,而且也是最直观和方便的方法。例如创建一个UI用于展现Item的基本内容。如图所示:
线框图:
直接可以通过LinearLayout快速的实现这个UI的排列:
?View Code XML
<LinearLayout xmlns:
android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_marginRight="6dip"
android:src="@drawable/icon" />
<LinearLayout
android:orientation="vertical"
android:layout_width="0dip"
android:layout_weight="1"
android:layout_height="fill_parent">
<TextView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="My Application" />
<TextView
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:singleLine="true"
android:ellipsize="marquee"
android:text="Simple application that shows how to use RelativeLayout" />
</LinearLayout>
</LinearLayout>
尽管可以通过Linearlayout实现我们所预想的结果,但是在这里存在一个优化的问题,尤其是针对为大量Items。比较RelativeLayout和LinearLayout,在资源利用上前者会占用更少的资源而达到相同的效果,以下是用RelativeLayout实现的代码:
View Code XML
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<ImageView
android:id="@+id/icon"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:layout_marginRight="6dip"
android:src="@drawable/icon" />
<TextView
android:id="@+id/secondLine"
android:layout_width="fill_parent"
android:layout_height="26dip"
android:layout_toRightOf="@id/icon"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:singleLine="true"
android:ellipsize="marquee"
android:text="Simple application that shows how to use RelativeLayout" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/icon"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_above="@id/secondLine"
android:layout_alignWithParentIfMissing="true"
android:gravity="center_vertical"
android:text="My Application" />
</RelativeLayout>
针对RelativeLayout有一点需要注意,因为它内部是通过多个View之间的关系而确定的框架,那么当其中某一个View因为某些需要调用GONE来完全隐藏掉后,会影响与其相关联的Views。Android为我们提供了一个属性 alignWithParentIfMissing 用于解决类似问题,当某一个View无法找到与其相关联的Views后将依据alignWithParentIfMissing的设定判断是否与父级View对齐。
下边是两种不同layout在Hierarchy Viewer中的层级关系图:
简单或复杂的问题都需要时常考虑如何优化资源的分配。比如一个功能很简单的应用程序,它会调用一些我们常用的对话框或者输入面板,这需要采用统一的方式来针对不同的应用程序制定统一标准。
当我们面对Android UI优化时,有必要继续考虑资源复用。手机开发给我们的直观感觉是运行其上的软件应该尽可能的达到资源高效利用的极致,而不能像开发PC机那样,似乎有用之不尽的资源。
定义Android Layout(XML)时,有四个比较特别的标签是非常重要的,其中有三个是与资源复用有关,分别是 <viewStub />, <requestFocus />, <merge /> and <include />。可是以往我们所接触的案例或者官方文档的例子都没有着重去介绍这些标签的重要性。
<viewStub />: 此标签可以使UI在特殊情况下,直观效果类似于设置View的不可见性,但是其更大的(R)意义在于被这个标签所包裹的Views在默认状态下不会占用任何内存空间。viewStub通过include从外部导入Views元素。
用法:通过android:layout来指定所包含的内容。默认情况下,ViewStub所包含的标签都属于visibility=GONE。viewStub通过方法inflate()来召唤系统加载其内部的Views。
<ViewStub android:id="@+id/stub"
android:inflatedId="@+id/subTree"
android:layout="@layout/mySubTree"
android:layout_width="120dip"
android:layout_height="40dip" />
<merge />: 将在下面做详细介绍。
<include />:可以通过这个标签直接加载外部的xml到当前结构中,是复用UI资源的常用标签。
用法:将需要复用xml文件路径赋予include标签的Layout属性。
<include android:id="@+id/cell1" layout="@layout/ar01" />
<include android:layout_width="fill_parent" layout="@layout/ar02" />
<requestFocus />: 标签用于指定屏幕内的焦点View。
用法: 将标签置于Views标签内部 <!-- Easy AdSenser V2.37 --><!-- Post[count: 2] -->
<EditText id="@+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:paddingBottom="4">
<requestFocus />
</EditText>
单独将<merge />标签做个介绍,是因为它在优化UI结构时起到很重要的作用。目的是通过删减多余或者额外的层级,从而优化整个Android Layout的结构。
将通过一个例子来了解这个标签实际所产生的作用,这样可以更直观的了解<merge/>的用法。
建立一个简单的Layout,其中包含两个Views元素:ImageView和TextView 默认状态下我们将这两个元素放在FrameLayout中。其效果是在主视图中全屏显示一张图片,之后将标题显示在图片上,并位于视图的下方。以下是xml代码:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="center"
android:src="@drawable/golden_gate" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dip"
android:layout_gravity="center_horizontal|bottom"
android:padding="12dip"
android:background="#AA000000"
android:textColor="#ffffffff"
android:text="Golden Gate" />
</FrameLayout>
应用上边的Layout运行的视图为:
启动 tools> hierarchyviewer.bat工具查看当前UI结构视图:
我们可以很明显的看到由红色线框所包含的结构出现了两个framelayout节点,很明显这两个完全意义相同的节点造成了资源浪费(这里可以提醒大家在开发工程中可以习惯性的通过hierarchyViewer查看当前UI资源的分配情况),那么如何才能解决这种问题呢(就当前例子是如何去掉多余的frameLayout节点)?这时候就要用到<merge />标签来处理类似的问题了。我们将上边xml代码中的framLayout替换成merge:
<!-- Easy AdSenser V2.37 --><!-- Post[count: 2] -->
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="center"
android:src="@drawable/golden_gate" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dip"
android:layout_gravity="center_horizontal|bottom"
android:padding="12dip"
android:background="#AA000000"
android:textColor="#ffffffff"
android:text="Golden Gate" />
</merge>
运行程序后在Emulator中显示的效果是一样的,可是通过hierarchyviewer查看的UI结构是有变化的,当初多余的 FrameLayout节点被合并在一起了,或者可以理解为将merge标签中的子集直接加到Activity的FrameLayout跟节点下(这里需要提醒大家注意:所有的Activity视图的根节点都是frameLayout)。如果你所创建的Layout并不是用framLayout作为根节点(而是应用LinerLayout等定义root标签),就不能应用上边的例子通过merge来优化UI结构。
除了上边的例子外,meger还有另外一个用法
当应用Include或者ViewStub标签从外部导入xml结构时,可以将被导入的xml用merge作为根节点表示,这样当被嵌入父级结构中后可以很好的将它所包含的子集融合到父级结构中,而不会出现冗余的节点。
另外有两点需要特别注意:
<merge />只可以作为xml layout的根节点。
当需要扩充的xml layout本身是由merge作为根节点的话,需要将被导入的xml layout置于 viewGroup中,同时需要设置attachToRoot为True。(更多说明请参见inflate()文档)
本文来自:http://wghjay.iteye.com/blog/425623
类别:Android | | 添加到搜藏 | 分享到i贴吧 | 浏览(94) | 评论 (0)
下一篇:[转]CSDN赵新 事件处理
相关文章:
• 关于android ui的优化 view 的绘... • Android优化UI秘籍【zt】
• Android UI学习 - FrameLayou和... • Android开发之ListView 适配器(A...
• 安卓优化大师 v1.29!Android手机... • android 应用TabHost优化Activit...
• 关于android "shake shake 摇摆 ... • 优化Android代码的知识
• Android进程管理机制及优化 for ... • Android layout 优化
更多>>
相关推荐
有关“colorbrewer”的更多信息,请访问: http ://colorbrewer2.org/ 这些表格是从网站上提供的 MS-Excel 文件中生成的http://www.personal.psu.edu/cab38/ColorBrewer/ColorBrewer_updates.html 此函数还允许通过...
//json-ld.org/contexts/person.jsonld" , "@id" : "http://dbpedia.org/resource/John_Lennon" , "name" : "John Lennon" , "born" : "1940-10-09" , "spouse" : "http://dbpedia.org/resource/Cynthia_Lennon"} ;...
游戏试玩地址 http://cynthia0li.github.io/
git clone https://github.com/cynthia-sg/chat_angular.git 跑步 获取依赖: npm install 启动Redis: redis-server 启动聊天服务器: (don't forget to launch Redis before!) node chatServer.js 现在在...
git clone https://github.com/cynthia-sg/chat_react.git 跑步 获取依赖: npm install 启动Redis: redis-server 启动聊天服务器: (don't forget to launch Redis before!) node chatServer.js 现在在...
git clone https://github.com/cynthia-sg/chat.git 跑步 获取依赖项: npm install 启动Redis: redis-server 启动聊天服务器: (don't forget to launch Redis before!) node chatServer.js 现在,在浏览器中...
贡献者:辛西娅·加西亚(Cynthia Garcia),理查德·霍尔(Richard Hall),马修·莫洪德(Matthew Mohondro),凯尔·麦金莱(Kyle McKinley) 描述 Survive 2020是一款基于文本的交互式游戏,在该游戏中,用户将...
该软件包使 Cynthia Brewer 的 ColorBrewer 方案在 MATLAB 中可用,并具有用户友好的界面。 可以对这些方案进行插值以包含更多颜色。 默认情况下,这是在几乎感知一致的 CIELAB 色彩空间中使用三次插值完成的,以...
npm start yarn start执照版权所有:copyright:2018 Cynthia Lin 根据Apache许可证2.0版(“许可证”)获得许可; 除非遵守许可,否则您不得使用此文件。 您可以在以下位置获得许可证的副本: ...
这些方案大多数都来自Cynthia A. Brewer的 。 由于ColorBrewer仅发布离散的配色方案,因此使用插值顺序和发散的比例尺。 例如,要使用“配色方案创建分类色标: var accent = d3 . scaleOrdinal ( d3 . ...
源码学习,压缩包解压密码:www.cqlsoft.com
1、线上下载cynthia.war包2、将下载的cynthia.war包解压后,放在tomcat的webapps目录下面3、新建数据库命名为cynthia,导入docs目录下的cynthia.sql文件4、打开config目录下的config.properties 根据docs目录下的...
cynthia
test_cynthia
Cynthia管理系统 v1.0.zip
Firefox 操作系统砂岩视频:Intro .mov / Template .psd / Font Open Sans Light参考执照麻省理工学院许可证 (MIT) 版权所有 (c) [2014] [Cynthia Pereira] 特此授予任何人免费获得本软件和相关文档文件(“软件”)...
archive_ Cynthia管理系统 v1.0 [江西新余电信].zip
[Drupal.The.Guide.to.Planning.and.Building.Websites(第1版)].(Drupal.The.Guide.to.Planning.and.Building.Websites).Cynthia.McCourt.文字版.pdf
-专业人士:辛西娅·赖利(Cynthia Reilly)苹果APP商店感言:“一个很棒的给教育工作者和学生的程序!我的学生们真正享受该程序,并且更愿意阅读具有挑战性的文字。” -Cre8tive Kay“我已经习惯了《 Voice Dream》...
为您提供Cynthia管理系统下载,Cynthia是个问题管理/BUG管理/任务管理/项目管理系统。Cynthia提供了一个基于Web的、开源的、跨平台的软件项目管理和问题管理的解决方案。通过极大的灵活度,实现了特殊性和普遍性的...