Layout布局管理器.ppt

Android常用布局介绍 Android常用布局介绍 主讲人 陈树辉 6种布局的继承关系 在上面的UML图中可以看出 绝对布局帧布局网格布局相对布局线性布局是直接继承ViewGroup 表格布局是继承LinearLayout 简单的说 Activity就是布满整个窗口或者悬浮于其他窗口上的交互界面 在一个应用程序中通常由多个Activity构成 都会在Manifest xml中指定一个主的Activity 如下设置为了适应各种界面风格 Android提供了6种布局 这6种布局分别是 FrameLayout 帧布局 LinearLayout 线性布局 RelativeLayout 相对布局 TableLayout 表格布局 GridLayout 网格布局 AbsoluteLayout 绝对布局 已过时 故此不讲 等 利用以上6种布局我们可以再手机屏幕上随心所欲的摆放各种控件 布局管理器都是以ViewGroup为基类派生出来的 使用布局管理器可以适配不同手机屏幕的分辨率 尺寸大小 布局 Layout 界面编程与视图 View 组件 Android应用的所有UI组件都继承自View类 ViewGroup也是继承自View类 但是ViewGroup主要用作其他UI控件的容器 使用XML布局控制UI界面 Android推荐使用XML布局文件来控制视图 将视图控制逻辑从Java代码中分离出来 放入XML文件中控制 体现了MVC的设计思想 通过如下代码在Activity中显示视图 setContentView R layout 通过如下方法访问指定的UI组件 findViewById R id Xml布局文件是android系统中定义的视图常用方法 所有的布局文件必须包含在res layout目录中 定义XML布局的命名和定义注意事项如下 xml布局文件必须是以xml文件名结束 命名必须是符合java的规范每一个xml布局文件的根节点可以是任意的控件标签xml布局文件的根节点必须是包含android的命名空间 命名空间必须是xmlns android 使用XML布局文件定义视图 请翻到 疯狂安卓讲义 65页Android表示单位长度的方式通常有三种表示方式 px 表示屏幕实际的象素 例如 320 480的屏幕在横向有320个象素 在纵向有480个象素 px 像素 每个px对应屏幕上的一个点 dip dp deviceindependentpixels 设备的独立像素 这种单位基于屏幕密度 在每英寸160点的显示器上1dp 1px 随着屏幕密度改变 dp与px换算会发生改变 sp scalepixels 比例像素 处理字体的大小 可以根据用户字体大小进行缩放 in 英寸 标准长度单位mm 毫米 标准长度单位pt 磅 标准长度单位 1 72英寸 Android中长度单位介绍 设计技巧 如果设置表示长度 高度等属性时可以使用dp或sp 但如果设置字体 需要使用sp dp是与密度无关 sp除了与密度无关外 还与scale 渐变尺寸伸缩动画效果 无关如果使用dp和sp 系统会根据屏幕密度的变化自动进行转换 Android中长度单位设计技巧 概念清晰化 AndroidLayoutParams简单说明 其实这个LayoutParams类是用于childview 子视图 向parentview 父视图 传达自己的意愿的一个东西 孩子想变成什么样向其父亲说明 LayoutParams继承于Android View ViewGroup LayoutParams LayoutParams相当于一个Layout的信息包 它封装了Layout的位置 高 宽等信息 假设在屏幕上一块区域是由一个Layout占领的 如果将一个View添加到一个Layout中 最好告诉Layout用户期望的布局方式 也就是将一个认可的layoutParams传递进去 可以这样去形容LayoutParams 在象棋的棋盘上 每个棋子都占据一个位置 也就是每个棋子都有一个位置的信息 如这个棋子在4行4列 这里的 4行4列 就是棋子的LayoutParams 概念清晰化 父容器与本容器属性 android layout 属性是本容器的属性 定义在这个布局管理器的LayoutParams内部类中 每个布局管理器都有一个LayoutParams内部类 android 是父容器用来控制子组件的属性 如android layout gravity是控制组件本身的对齐方式 android gravity是控制本容器子组件的对齐方式 控制本身元素属性与子元素属性 设备组件本身属性 带layout的属性是设置本身组件属性 例如android layout gravity设置的是本身的对齐方式 设置子元素属性 不带layout的属性是设置其所包含的子元素 例如android gravity设置的是该容器子控件的对齐方式 LayoutParams属性 所有的布局管理器都提供了相应的LayoutParams内部类 这些内部类用于控制该布局本身 如对齐方式layout gravity 所占权重layout weight 这些属性用于设置本元素在父容器中的对齐方式 容器属性 在android 后面没有layout的属性基本都是容器属性 android gravity作用是指定指定本元素包含的子元素的对齐方式 只有容器才支持这个属性 View类常用属性及方法 任何继承自View的子类都将拥有View类的属性及对应方法 layout margin是控件边缘相对于父控件的边距取值为android layout marginTop 10dp Android布局中常用属性介绍 中间 中间元素 android layout marginTop 10dp android layout marginTop android layout marginLeft android layout marginButtom 10dp android layout margin相对于父控件的间隔 layout padding是控件内容相对于控件边缘的边距取值也为 Android padding 8dp Android布局中常用属性介绍 中间元素 Android paddingTop 8dp Android paddingButtom 8dp Android paddingRight Android paddingLeft 线性布局是最常用的布局线性布局在xml文件中使用来定义线性布局可以分为水平和垂直的方向的布局 可以通过android orientation vertical 来定义方向 该属性可以有horizontal和vertical两个方向 标签中有一个很重要的属性gravity 该属性用于控制布局中视图的位置 如果设置多个值需要使用 进行分隔 属性如下 线性布局LinearLayout 学云为您提供高品质课件 学习督导服务 即时答疑 知识交易平台 线性布局 android layout width和android layout height属性说明 线性布局LinearLayout android layout weight权重的描述layout weight用于给一个线性布局中的诸多视图 即LinearLayout的子元素 的重要度赋值 所有的视图都有一个layout weight值 默认为零 意思是需要显示多大的视图就占据多大的屏幕空间 若赋一个高于零的值 则将父视图中的可用空间分割 分割大小具体取决于每一个视图的layout weight值以及该值在当前屏幕布局的整体layout weight值和在其它视图屏幕布局的layout weight值中所占的比率而定 线性布局LinearLayout 线性布局实例 使用线性布局实现如下界面 老罗安卓视频 相对较易 刘若翘杰作 相对有难度 19 相对布局RelativeLayout 子控件的位置相对兄弟控件或父容器而定设计时按照依赖关系进行设计 20 相对布局RelativeLayout 1 RelativeLayout支持的属性 1 对齐方式xml属性 android gravity 设置方法 setGravity int 作用 设置布局容器内子元素的对齐方式 注意与android layout gravity区分 后者是设置组件本身元素对齐方式 2 忽略对齐方式xml属性 android ignoreGravity 设置方法 setIgnoreGravity int 作用 设置该组件不受gravity属性影响 因为gravity属性影响容器内所有的组件的对齐方式 设置了之后 该组件就可以例外 相对布局RelativeLayout 只取True或False的属性 2 LayoutParams属性 例如 android layout centerVertical true 相对布局RelativeLayout 取值为其他控件ID的属性 2 LayoutParams属性 android layout above id button 控件名称 相对布局RelativeLayout 取值为像素的属性避免出现循环依赖android layout marginBottom 10dp 表示与下方有10dp的距离 p 相对布局RelativeLayout 请用RelativeLayout实现以下的界面 要点 注意每个组件的属性 先要确定方位 再进行对齐 组件左边界对齐 组件上边界对齐 两个按钮 如果只有android layout above id bt1 会是这种情况 加上android layout alignLeft id bt1 就会成为这种情况 25 表格布局TableLayout 1 表格布局的一些概念继承关系 表格布局继承了LinearLayout 其本质是线性布局管理器 控制组件 表格布局采用行 列形式管理子组件 但是并不需要声明有多少行列 只需要添加TableRow和组件就可以控制表格的行数和列数 这一点与网格布局有所不同 网格布局需要指定行列数 增加行的方法 a TableRow增加行列 向TableLayout中添加一个TableRow 一个TableRow就是一个表格行 同时TableRow也是容器 可以向其中添加子元素 每添加一个组件 就增加了一列 b 组件增加行 如果直接向TableLayout中添加组件 就相当于直接添加了一行 列宽 TableLayout中 列的宽度由该列最宽的单元格决定 整个表格的宽度默认充满父容器本身 26 表格布局TableLayout 常用属性及对应方法说明 27 表格布局TableLayout 一小段代码 剩下的请看Eclipse里的代码 本节的实践也为右图 28 帧布局FrameLayout 帧布局容器为每个组件 控件 创建一个空白区域 一个区域成为一帧 这些帧会根据FrameLayout中定义的gravity属性自动对齐 帧布局是最简单的布局方式 所有添加到这个布局中的视图都是以层叠的方式显示 第一个添加到帧布局中的视图显示在最底层 最后一个被放在最顶层 上一层的视图会覆盖下一层的视图 因此帧布局类似堆栈布局 29 帧布局FrameLayout 1 绘制霓虹灯布局 要点 后挡前 后面的View组件会遮挡前面的View组件 越在前面 被遮挡的概率越大 界面居中 将所有的TextView组件的对齐方式android layout gravity设置为center 正方形 所有的TextView都设置android height和android width属性 用来设置其宽高 这里设置成正方形 宽高一样 后面的组件比前面的边长依次少40 颜色 每个TextView的背景色都设置成不一样的 详细 请看工程代码 30 网格布局GridLayout 1 网格布局介绍网格布局时Android4 0版本才有的 在低版本使用该布局需要导入对应支撑库 GridLayout将整个容器划分成rows columns个网格 每个网格可以放置一个组件 还可以设置一个组件横跨多少列 多少行 不存在一个网格放多个组件情况 2 网格布局常用属性 1 设置对齐模式xml属性 android alignmentMode 设置方法 setAlignmentMode int 作用 设置网格布局管理器的对齐模式 2 页边距xml属性 android useDefaultMargins 设置方法 setUseDefaultMargins boolean 作用 设置该布局是否使用默认的页边距 31 网格布局GridLayout 3 设置列数xml属性 android columnCount 设置方法 setColumnCount int 作用 设置该网格布局的列数 5 设置是否保留列序列号xml属性 android columnOrderPreserved 设置方法 setColumnOrderPreserved boolean 作用 设置网格容器是否保留列序列号 4 设置行数xml属性 android rowCount 设置方法 setRowCount int 作用 设置该网格的行数 6 设置是否保留行序列号xml属性 android rowOrderPreserved 设置方法 setRowOrderPreserved int 作用 设置该网格容器是否保留行序列号 32 网格布局GridLayout 3 GridLayout的LayoutParams属性 1 设置位置列xml属性 android layout column 作用 设置子组件在GridLayout的哪一列 2 横向跨列xml属性 android layout columnSpan 作用 设置该子组件在GridLayout中横向跨几列 3 占据空间方式xml属性 android layout gravity 设置方法 setGravity int 作用 设置该组件采用何种方式占据该网格的空间 4 设置行位置xml属性 android layout row 作用 设置该子组件在GridLayout的第几行 5 设置横跨行数xml属性 android layout rowSpan 作用 设置该子组件在GridLayout纵向横跨几行 33 网格布局GridLayout 4 实现一个计算机界面 这里采用xml和Java代码共同控制界面 1 布局代码tips设置行列 设置GridLayout的android rowCount为6 设置android columnCount为4 这个网格为6行 4列的 设置横跨四列 设置TextView和按钮横跨四列android layout columnSpan为4 列的合并就是占了一行 textView的一些设置 设置textView中的文本与边框有5像素间隔 android padding 5dp 34 网格布局GridLayout 4 实现一个计算机界面 35 网格布局GridLayout XML代码 36 网格布局GridLayout 2 Activity代码将组件设置给GridLayout网格流程 指定组件所在行 GridLayout SpecrowSpec GridLayout spec int 指定组件所在列 GridLayout SpeccolumnSpec GridLayout spec int 创建LayoutParams对象 GridLayout LayoutParamsparams newGridLayout LayoutParams rowSpec columnSpec 指定组件占满容器 params setGravity Gravity FILL 将组件添加到布局中 gridLayout addView view params 接下来 请看工程源码 资料来源 老罗安卓视频 学云网 CSDN博文