Android 开发之旅-view的几种布局方式及实践

合集下载

view的绘制流程

view的绘制流程

view的绘制流程View是Android中最基本的UI组件之一,它负责绘制UI界面并响应用户的交互操作。

View的绘制流程是Android开发中非常重要的一个知识点,下面我们来详细了解一下。

1.测量阶段在View的绘制流程中,首先进行的是测量阶段。

在这个阶段中,系统会根据View的布局参数和父容器的尺寸来计算出View的测量宽度和测量高度。

这个过程是通过调用View的measure()方法来实现的。

2.布局阶段在测量阶段完成后,接下来进行的是布局阶段。

在这个阶段中,系统会根据View的测量宽度和测量高度以及布局参数来确定View在父容器中的位置和大小。

这个过程是通过调用View的layout()方法来实现的。

3.绘制阶段在布局阶段完成后,接下来进行的是绘制阶段。

在这个阶段中,系统会根据View的位置和大小以及其他属性来绘制View的内容。

这个过程是通过调用View的draw()方法来实现的。

4.重绘阶段在View的绘制流程中,如果View的内容发生了变化,那么系统会触发重绘阶段。

在这个阶段中,系统会重新调用View的measure()、layout()和draw()方法来重新计算View的位置和大小以及绘制View 的内容。

总结:View的绘制流程是一个非常重要的知识点,它涉及到Android UI的核心原理。

了解View的绘制流程可以帮助我们更好地理解Android UI的工作原理,从而更好地进行UI开发。

同时,我们还需要注意,View的绘制流程是一个非常复杂的过程,需要我们在开发中仔细思考和调试,才能保证UI的质量和性能。

Android开发——View绘制过程源码解析

Android开发——View绘制过程源码解析

Android开发——View绘制过程源码解析0. 前言View的绘制流程从ViewRoot的performTraversals开始,经过measure,layout,draw三个流程,之后就可以在屏幕上看到View了。

其中measure用于测量View的宽和高,layout用于确定View在父容器中放置的位置,draw则用于将View绘制到屏幕上。

1. MeasureSpec说到measure那么就不得不提MeasureSpec,一旦确定了MeasureSpec,在onMeasure()中就可以确定View的宽高。

MeasureSpec的值由SpecSize(测量值)和SpecMode(测量模式)共同组成。

它是由布局参数和父容器的测量属性一起决定的。

其中测量模式一共有三种类型:(1)EXACTL Y:表示设置了精确的值,一般当childView设置其宽高为精确值、match_parent (同时父容器也是这种模式)的情况。

(2)A T_MOST:表示子布局被限制在一个最大值内,一般当childView设置其宽高为wrap_content、match_parent(同时父容器也是这种模式)的情况。

(3)UNSPECIFIED:表示View可以设置成任意的大小,没有任何限制。

这种情况比较少见。

2. MeasureSpec的生成过程2.1 顶级View的MeasureSpec[java] view plain copy// desiredWindowWidth和desiredWindowHeight为屏幕尺寸// lp.width和lp.height都等于MA TCH_PARENTchildWidthMeasureSpec = getRootMeasureSpec(desiredWindowWidth, lp.width); childHeightMeasureSpec = getRootMeasureSpec(desiredWindowHeight, lp.height);//…private int getRootMeasureSpec(int windowSize, int rootDimension) {int measureSpec;switch (rootDimension) {case youtParams.MATCH_PARENT:measureSpec = MeasureSpec.makeMeasureSpec(windowSize, MeasureSpec.EXACTL Y);break;case youtParams.WRAP_CONTENT:measureSpec = MeasureSpec.makeMeasureSpec(windowSize, MeasureSpec.A T_MOST);break;default:measureSpec = MeasureSpec.makeMeasureSpec(rootDimension, MeasureSpec.EXACTL Y);break;}return measureSpec;}从源码中可以看出,这里使用了MeasureSpec.makeMeasureSpec()方法来组装一个MeasureSpec,rootDimension参数等于MA TCH_PARENT,MeasureSpec的SpecMode为EXACTLY。

androidactivityview原理

androidactivityview原理

androidactivityview原理Android的Activity是一种可以包含用户界面的组件,用于与用户交互。

Activity主要负责管理用户界面和协调不同组件之间的交互。

在Android中,Activity的展示是通过View来实现的,而ActivityView就是Activity中关联的View对象。

ActivityView原理主要涉及以下几个方面:1. View的渲染:ActivityView在Activity的生命周期中负责绘制Activity的用户界面,并将其呈现给用户。

View的渲染主要通过View的绘制流程实现,包括测量、布局和绘制,最终将视图内容绘制到屏幕上。

2. Activity生命周期与View的关联:Activity与View之间存在一定的关联关系。

在Activity的生命周期中,当Activity处于可见状态时,Activity会通过调用setContentView方法来设置视图内容,即关联一个View对象。

当Activity被销毁时,View的相关资源也会被释放。

3. View的事件处理:ActivityView可以处理用户的交互事件,例如点击、滑动等。

Android系统通过触摸事件的分发机制将用户的触摸事件传递给具体的View,然后调用View的事件处理方法来响应用户的操作。

4. View的布局管理:ActivityView在布局中可以包含其他View对象,这些View对象形成了一个层次结构,用于展示复杂的用户界面。

Android提供了多种布局管理器,例如线性布局、相对布局、帧布局等,用于帮助开发者灵活地组织和管理View的位置和大小。

5. View的数据绑定:ActivityView可以通过数据绑定来显示和更新数据。

Android的数据绑定库可以将数据和视图进行绑定,当数据发生变化时,视图可以自动更新。

这可以方便开发者在ActivityView中展示动态数据。

view设计方法

view设计方法

view设计方法
View设计方法指的是用于设计并实现视图(View)的一系列方法和步骤。

以下是其中的一些常见的方法:
1. 确定需求和目标:在设计View之前,需要确定所要实现的功能和目标。

2. 分析数据和UI要素:通过分析输入数据、UI要素等来理解数据和UI显示的关系。

3. 分析流程和结构:对UI设计流程和界面结构进行分析,以清晰地理解视图中各个组件的关系及功能。

4. 界面设计:通过软件工具或手绘来进行界面设计,这包括颜色、字体、图标、排版及组件的位置等。

5. 布局设计:根据组件大小、位置及运动的方向来设计界面布局,以达到最佳可视效果。

6. 界面堆栈管理:管理在View中的各个界面的层级关系和相关联的逻辑关系。

7. 风格和样式定义:根据公司或客户需求来定义Logo、图标等的风格和样式。

8. 组件定制和重用:根据需求设计出组件库,并对其进行定制和重用,以确保在各个View设计上的统一性。

9. 功能和性能测试:对设计的View进行功能和性能测试,以确保其稳定运行和满足用户需求。

以上是View设计方法的一些常见步骤和方法,但实际的View设计流程可以因UI要素、开发技术和功能需求等因素而有所不同。

view 的绘制流程

view 的绘制流程

view 的绘制流程View 是 Android 开发中的一个重要概念,它负责用户界面的绘制和交互。

本文将详细介绍 View 的绘制流程,帮助读者更好地理解和使用 View。

一、View 的绘制流程概述在 Android 应用程序中,View 的绘制流程主要分为三个阶段:测量(Measure)、布局(Layout)和绘制(Draw)。

下面将详细介绍每个阶段的具体流程。

二、测量阶段(Measure)1. 测量阶段的入口是 View 的 measure() 方法。

在该方法中,View 会根据自身的布局参数(LayoutParams)来确定自身的宽度和高度。

2. 在 measure() 方法中,View 会先通过 getMeasuredWidth() 和getMeasuredHeight() 方法获取自身的宽度和高度。

如果宽度和高度都大于0,则说明该 View 已经完成了测量,测量流程结束。

否则,继续进行测量。

3. 如果View 的宽度或高度为0,则需要根据测量模式(MeasureSpec)来确定其测量值。

MeasureSpec 是一个由测量模式和测量值组成的 32 位整数,其中测量模式占高 2 位,测量值占低30 位。

4. 在确定测量值之前,测量模式会被解析为三种模式:EXACTLY、AT_MOST 和 UNSPECIFIED。

EXACTLY 表示精确的尺寸,AT_MOST 表示最大尺寸,UNSPECIFIED 表示不受限制的尺寸。

5. 根据测量模式的不同,View 的测量值也会相应地发生变化。

如果测量模式为 EXACTLY,则测量值就是精确的尺寸;如果测量模式为AT_MOST,则测量值不能超过最大尺寸;如果测量模式为UNSPECIFIED,则测量值可以任意大小。

6. 测量值确定后,会通过 setMeasuredDimension() 方法将测量值保存起来,供后续的布局和绘制使用。

三、布局阶段(Layout)1. 布局阶段的入口是 View 的 layout() 方法。

Android布局方式总结

Android布局方式总结

Android布局⽅式总结Android的布局分别是:线性布局LinearLayout、相对布局RelativeLayout、帧布局FrameLayout、⽹格布局GridLayout、约束布局ConstraintLayout、百分⽐布局PercentLayout、表格布局TableLayout、绝对布局AbsoluteLayout。

其中,表格布局是线性布局的⼦类。

在⼿机程序设计中,绝对布局和框架布局基本上不⽤,⽤得相对较多的是线性布局和相对布局。

1.布局管理器类图2.布局管理器⾥⾯既可以添加多个布局管理器⼜可以添加多个控件,⽽控件⾥⾯不能在添加布局或控件了。

3.各个布局的特点线性布局:开发中使⽤最多,具有垂直⽅向与⽔平⽅向的布局⽅式相对布局:最灵活的⼀种布局⽅式,可以让⼦控件相对于兄弟控件或⽗控件进⾏布局,可以设置⼦控件相对于兄弟控件或⽗控件进⾏上下左右对齐。

RelativeLayout能替换⼀些嵌套视图,当我们⽤LinearLayout来实现⼀个简单的布局但⼜使⽤了过多的嵌套时,就可以考虑使⽤RelativeLayout重新布局。

相对布局就是⼀定要加Id才能管理。

帧布局:⽤于⽐较简单的布局,从屏幕左上⾓按照层次堆叠⽅式布局,后⾯的控件覆盖前⾯的控件。

该布局在开发中设计地图经常⽤到,因为是按层次⽅式布局,我们需要实现层⾯显⽰的样式时就可以⽤这种布局⽅式,⽐如我们要实现⼀个类似百度地图的布局,我们移动的标志是在⼀个图层的上⾯。

在普通功能的软件设计中⽤得也不多。

帧布局主要应⽤就是地图和引导页。

⽹格布局:可以取代表格布局,作为android 4.0 后新增的⼀个布局,与前⾯介绍过的TableLayout(表格布局)其实有点⼤同⼩异;不过新增了⼀些东东①跟LinearLayout(线性布局)⼀样,他可以设置容器中组件的对齐⽅式②容器中的组件可以跨多⾏也可以跨多列(相⽐TableLayout直接放组件,占⼀⾏相⽐较)因为是android 4.0新增的,API Level 14,在这个版本以前的sdk都需要导⼊项⽬。

Android应用界面设计的创意思路和实践

Android应用界面设计的创意思路和实践

Android应用界面设计的创意思路和实践一、引言Android应用界面设计是移动应用开发中至关重要的一环,能够直接影响用户体验和用户对应用的印象。

本文将从创意思路和实践两个方面,分享一些关于Android应用界面设计的经验和技巧。

二、创意思路1. 用户调研在设计Android应用界面之前,我们首先要了解目标用户的需求和喜好。

通过用户调研,可以深入了解用户的偏好、习惯以及群体特点,以便在界面设计中更好地迎合用户的需求。

2. 风格选择Android应用的界面设计风格有多种选择,包括扁平化、骨架屏、卡片式等。

我们可以根据应用的定位和用户群体选择适合的风格,以达到良好的用户体验和界面美感。

3. 布局创新创新的布局能够让应用界面显得与众不同。

例如,可以尝试非传统的布局方式,如瀑布流布局、环形布局等,使得应用界面在视觉上更有吸引力和创意。

4. 动画效果适当的动画效果能够为应用界面增添生动感和交互性。

可以运用淡入淡出、缩放、旋转等动画效果,为用户提供良好的交互体验和视觉享受。

三、实践技巧1. 界面简洁在设计Android应用界面时,要追求简洁而不失重要信息。

过于复杂的界面会给用户带来困扰,因此要尽量避免过多的按钮、文字等冗余信息,使得界面清晰明了。

2. 色彩搭配色彩搭配是界面设计中一个非常重要的方面。

要选择适合应用定位和用户情感的色彩搭配,使得界面既美观又能传达正确的情感和氛围。

3. 排版设计合理的排版设计能够提高用户的阅读体验和界面的可读性。

要注意合理的字体大小、行间距、段落划分等,以及合适的标题和副标题的使用,让用户能够快速浏览和理解界面内容。

4. 图标设计图标是Android应用界面设计中不可或缺的一部分,可以用来增加界面的可识别性和美感。

要选择直观易懂的图标,避免过于复杂或模糊的设计,以免影响用户的使用体验。

5. 响应速度用户对于应用的响应速度有很高的期望,因此在界面设计中,要确保应用的操作流畅、反应迅速,以提供良好的用户体验。

源码解析Android中View的layout布局过程

源码解析Android中View的layout布局过程
if (li != null && li.mOnLayoutChangeListeners != null) { //首 先对mOnLayoutChangeListeners中 的 事 件监听 器进行 拷贝
ArrayList<OnLayoutChangeListener> listenersCopy = (ArrayList<OnLayoutChangeListener>)li.mOnLayoutChangeListeners.clone();
对View进行布局的目的是计算 出View的尺寸以及在其父控件中的位置,具体来说就 是计算 出View的 四条边界 分别到其父控件左边界、上 边界的距离, 即计算View的left、top、right、bottom的值。
layout
layout()方法是View布局的入口,其源码如下所示:
public void layout(int l, int t, int r, int b) { //成员 变量mPrivateFlags3中的一些比特位存储着和layout相关的 信 息
//如 果isLayoutModeOptical()返 回true, 那么就会执行setOpticalFrame()方 法 , //否则会执行setFrame()方 法 。并且setOpticalFrame()内部会调用setFrame(), //所 以无论如 何 都会执行setFrame()方 法 。 //setFrame()方 法会 将View新 的left、top、right、bottom存储到View的 成员 变量 中 //并且 返 回 一个boolean值,如果返回true表 示View的位置或尺寸发生 了变化 , //否则表 示 未发生变化 boolean changed = isLayoutModeOptical(mParent) ?
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

Android 开发之旅:view的几种布局方式及实践/1943397/3635522010-06-06 14:14:00标签:布局 View 实践移动开发 Android原创作品,允许转载,转载时请务必以超链接形式标明文章原始出处、作者信息和本声明。

否则将追究法律责任。

/1943397/363552引言通过前面两篇:1.Android 开发之旅:又见Hello World!2.Android 开发之旅:深入分析布局文件&又是“Hello World!”我们对Android应用程序运行原理及布局文件可谓有了比较深刻的认识和理解,并且用“Hello World!”程序来实践证明了。

在继续深入Android开发之旅之前,有必要解决前两篇中没有介绍的遗留问题:View的几种布局显示方法,以后就不会在针对布局方面做过多的介绍。

View的布局显示方式有下面几种:线性布局(Linear Layout)、相对布局(Relative Layout)、表格布局(Table Layout)、网格视图(Grid View)、标签布局(Tab Layout)、列表视图(List View)、绝对布局(AbsoluteLayout)。

本文虽然是介绍View的布局方式,但不仅仅是这样,其中涉及了很多小的知识点,绝对能给你带来Android大餐!本文的主要内容就是分别介绍以上视图的七种布局显示方式效果及实现,大纲如下:1.1、View布局概述2.2、线性布局(Linear Layout)1. 2.1、Tips:android:layout_weight="1"3.3、相对布局(Relative Layout)4.4、表格布局(Table Layout)5.5、列表视图(List View)1. 5.1、一个小的改进2. 5.2、补充说明6.6、网格视图(Grid View)7.7 、绝对布局()8.8、标签布局(Tab Layout)1、view的布局显示概述通过前面的学习我们知道:在一个Android应用程序中,用户界面通过View和ViewGroup对象构建。

Android中有很多种View和ViewGroup,他们都继承自View类。

View对象是Android平台上表示用户界面的基本单元。

View的布局显示方式直接影响用户界面,View的布局方式是指一组View元素如何布局,准确的说是一个ViewGroup中包含的一些View怎么样布局。

ViewGroup类是布局(layout)和视图容器(View container)的基类,此类也定义了youtParams类,它作为布局参数的基类,此类告诉父视图其中的子视图想如何显示。

例如,XML布局文件中名为layout_something的属性(参加上篇的4.2节)。

我们要介绍的View的布局方式的类,都是直接或间接继承自ViewGroup类,如下图所示:图1、继承自ViewGroup的一些布局类其实,所有的布局方式都可以归类为ViewGroup的5个类别,即ViewGroup的5个直接子类。

其它的一些布局都扩展自这5个类。

下面分小节分别介绍View的七种布局显示方式。

2、线性布局(Linear Layout)线性布局:是一个ViewGroup以线性方向显示它的子视图(view)元素,即垂直地或水平地。

之前我们的Hello World!程序中view的布局方式就是线性布局的,一定不陌生!如下所示res/layour/main.xml:1.<?xml version="1.0"encoding="utf-8"?>2.<LinearLayout xmlns:android="/apk/res/android"3.android:layout_width="fill_parent"4.android:layout_height="fill_parent"5.android:orientation="horizontal"><!-- have an eye on ! -->6.<Button android:id="@+id/button1"7.android:layout_width="wrap_content"8.android:layout_height="wrap_content"9.android:text="Hello, I am a Button1"10.android:layout_weight="1"11./>12.<Button android:id="@+id/button2"13.android:layout_width="wrap_content"14.android:layout_height="wrap_content"15.android:text="Hello, I am a Button2"16.android:layout_weight="1"17./>18.<Button android:id="@+id/button3"19.android:layout_width="wrap_content"20.android:layout_height="wrap_content"21.android:text="Hello, I am a Button3"22.android:layout_weight="1"23./>24.<Button android:id="@+id/button4"25.android:layout_width="wrap_content"26.android:layout_height="wrap_content"27.android:text="Hello, I am a Button4"28.android:layout_weight="1"29./>30.<Button android:id="@+id/button5"31.android:layout_width="wrap_content"32.android:layout_height="wrap_content"33.android:text="Hello, I am a Button5"34.android:layout_weight="1"35./>36.</LinearLayout>从上面可以看出根LinearLayout视图组(ViewGroup)包含5个Button,它的子元素是以线性方式(horizontal,水平的)布局,运行效果如下图所示:图2、线性布局(水平或者说是横向)如果你在android:orientation="horizontal"设置为vertical,则是是垂直或者说是纵向的,如下图所示:图3、线性布局(垂直或者说是纵向)2.1、Tips:android:layout_weight="1"这个属性很关键,如果你没有显示设置它,它默认为0。

把上面布局文件(水平显示的那个)中的这个属性都去掉,运行会得出如下结果:图4、layout_weight属性没有了这个属性,我们本来定义的5个Button运行后却只显示了2个Button,为什么呢??"weight"顾名思义是权重的意思,layout_weight 用于给一个线性布局中的诸多视图的重要程度赋值。

所有的视图都有一个layout_weight值,默认为零,意思是需要显示多大的视图就占据多大的屏幕空间。

这就不难解释为什么会造成上面的情况了:Button1~Button5都设置了layout_height和layout_width属性为wrap_content即包住文字内容,他们都没有设置layout_weight 属性,即默认为0.,这样Button1和Button2根据需要的内容占据了整个屏幕,别的就显示不了啦!若赋一个高于零的值,则将父视图中的可用空间分割,分割大小具体取决于每一个视图的layout_weight值以及该值在当前屏幕布局的整体layout_weight值和在其它视图屏幕布局的layout_weight值中所占的比率而定。

举个例子:比如说我们在水平方向上有一个文本标签和两个文本编辑元素。

该文本标签并无指定layout_weight值,所以它将占据需要提供的最少空间。

如果两个文本编辑元素每一个的layout_weight值都设置为1,则两者平分在父视图布局剩余的宽度(因为我们声明这两者的重要度相等)。

如果两个文本编辑元素其中第一个的layout_weight值设置为1,而第二个的设置为2,则剩余空间的三分之二分给第一个,三分之一分给第二个(数值越小,重要度越高)。

3、相对布局(Relative Layout)相对布局:是一个ViewGroup以相对位置显示它的子视图(view)元素,一个视图可以指定相对于它的兄弟视图的位置(例如在给定视图的左边或者下面)或相对于RelativeLayout的特定区域的位置(例如底部对齐,或中间偏左)。

相对布局是设计用户界面的有力工具,因为它消除了嵌套视图组。

如果你发现你使用了多个嵌套的LinearLayout视图组后,你可以考虑使用一个RelativeLayout 视图组了。

看下面的res/layour/main.xml:1.<?xml version="1.0"encoding="utf-8"?>2.<RelativeLayout xmlns:android="/apk/res/android"3.android:layout_width="fill_parent"4.android:layout_height="fill_parent">5.<TextView6.android:id="@+id/label"7.android:layout_width="fill_parent"8.android:layout_height="wrap_content"9.android:text="Type here:"/>10.<EditText11.android:id="@+id/entry"12.android:layout_width="fill_parent"13.android:layout_height="wrap_content"14.android:background="@android:drawable/editbox_background"15.android:layout_below="@id/label"/><!-- have an eye on ! -->16.<Button17.android:id="@+id/ok"18.android:layout_width="wrap_content"19.android:layout_height="wrap_content"20.android:layout_below="@id/entry"<!-- have an eye on ! -->21.android:layout_alignParentRight="true"<!-- have an eye on ! -->22.android:layout_marginLeft="10dip"23.android:text="OK"/>24.<Button25.android:layout_width="wrap_content"26.android:layout_height="wrap_content"27.android:layout_toLeftOf="@id/ok"<!-- have an eye on ! -->28.android:layout_alignTop="@id/ok"<!-- have an eye on ! -->29.android:text="Cancel"/>30.</RelativeLayout>从上面的布局文件我们知道,RelativeLayout视图组包含一个TextView、一个EditView、两个Button,注意标记了<!-- have an ey e on ! -->的属性,在使用相对布局方式中就是使用这些类似的属性来定位视图到你想要的位置,它们的值是你参照的视图的id。

相关文档
最新文档