Android Studio 笔记3.3 相对布局
文章目录
- 一、前言
- 二、笔记3.3 相对布局
- (一)相对布局概述
- 1、布局特点
- 2、继承关系图
- 3、常用属性
- (1)相对于父容器居中
- (2)相对于父容器对齐
- (3)相对于其它控件位置
- (4)相对于其它控件对齐
- (5)标识符问题
- (二)案例演示:相对布局演示
- 1、创建安卓应用
- 2、准备图片素材
- 3、字符串资源文件
- 4、主布局资源文件
- 5、启动应用,查看效果
- 三、总结
一、前言
- 了解相对布局优点
- 熟悉相对布局常用属性
- 掌握线性布局嵌套相对布局
- 如果需要在多个方向上进行布局,就要嵌套多个线性布局。如果UI足够复杂,那么从工作量和性能上都将是一场噩梦。因此引出另一种布局方式——相对布局,很多时候需要嵌套多个线性布局才能实现的布局,使用相对布局,一层就能够完成。相对布局十分灵活,可以实现复杂界面的设计,当然掌握起来比较难。
二、笔记3.3 相对布局
(一)相对布局概述
- 顾名思义,相对布局就是让内部的 View 根据其他 View 或者 Parent 的位置来确定自己的摆放位置和尺寸。比如你买了套沙发,你告诉师傅把沙发放到客厅内,面对电视机并且和茶几平行,靠墙摆放。其中沙发就是我们的目标 View,客厅就是 Parent,电视机和茶几就是其他的 View。这样一来,就能够准确的确定出你希望摆放的位置。RelativeLayout 的原理就是这样,我们可以指定某个 View 相对于它的兄弟 View 而言的摆放位置(比如在 TextView 的左边 10 dp或者在上面 25 dp),另外也可以指定它在父布局(RelativeLayout)中的摆放位置。RelativeLayout 应该说是在 Android GUI 设计中最常用的布局方式。
1、布局特点
- 在相对布局中,一个控件的位置取决于它和其它控件的相对关系
- 优点:使用比较灵活
- 缺点:复杂,掌握较难
2、继承关系图
- RelativeLayout类是ViewGroup的子类
3、常用属性
(1)相对于父容器居中
属性 | 含义 |
---|---|
layout_centerInParent | 在父容器居中 |
layout_centerHorizontal | 在父容器水平居中(true |
layout_centerVertical | 在父容器垂直居中 |
(2)相对于父容器对齐
属性 | 含义 |
---|---|
layout_alignParentLeft | 与父容器左对齐 |
layout_alignParentRight | 与父容器右对齐 |
layout_alignParentTop | 与父容器顶对齐 |
layout_alignParentBottom | 与父容器底对齐 |
(3)相对于其它控件位置
属性 | 含义 |
---|---|
layout_toLeftOf | 在……左边 |
layout_toRightOf | 在……右边 |
layout_above | 在……上面 |
layout_below | 在……下面 |
(4)相对于其它控件对齐
属性 | 含义 |
---|---|
layout_alignLeft | 与……左对齐 |
layout_alignRight | 与……右对齐 |
layout_alignTop | 与……顶对齐 |
layout_alignBottom | 与……底对齐 |
layout_alignBaseLine | 与……基线对齐 |
(5)标识符问题
标识符 | 含义 |
---|---|
@+id/button | 创建新的id(建议使用) |
@id/button | 引用已有的id |
(二)案例演示:相对布局演示
1、创建安卓应用
基于
Empty Activity
创建安卓应用 -RelativeLayoutDemo2
单击【Finish】按钮
2、准备图片素材
- 将背景图片拷贝到drawable目录
3、字符串资源文件
- 字符串资源文件 -
strings.xml
<resources><string name="app_name">相对布局演示</string><string name="upper_left_corner">左上角</string><string name="upper_right_corner">右上角</string><string name="lower_left_corner">左下角</string><string name="lower_right_corner">右下角</string><string name="center">中央</string><string name="upper_left">左上</string><string name="upper_right">右上</string><string name="lower_left">左下</string><string name="lower_right">右下</string><string name="ok">确定</string><string name="cancel">取消</string>
</resources>
4、主布局资源文件
- 主布局资源文件 -
activity_main.xml
分析界面:首先确定【中央】按钮,然后其它按钮可以根据与它的相对位置关系来定位。【左上角】按钮、【右上角】按钮、【左下角】按钮与【右下角】按钮可以根据它与父容器的对齐方式来确定。
添加中央按钮
- 查看预览效果
- 以【中央】按钮为参考点,添加【左上】按钮
查看预览效果
同理,添加【右上】、【左下】和【右下】按钮
查看预览效果
- 在【左下】按钮正下方添加【确定】按钮
- 查看预览效果
在【右下】按钮正下方添加【取消】按钮
查看预览效果
添加【左上角】、【右上角】、【左下角】和【右下角】按钮
查看预览效果
- activity_main.xml 完整代码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@drawable/background"tools:context=".MainActivity"><Buttonandroid:id="@+id/btn_center"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerInParent="true"android:text="中央" /><Buttonandroid:id="@+id/btn_upper_left"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_above="@+id/btn_center"android:layout_toLeftOf="@+id/btn_center"android:text="@string/upper_left"/><Buttonandroid:id="@+id/btn_upper_right"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_above="@+id/btn_center"android:layout_toRightOf="@+id/btn_center"android:text="@string/upper_right"/><Buttonandroid:id="@+id/btn_lower_left"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@+id/btn_center"android:layout_toLeftOf="@+id/btn_center"android:text="@string/lower_left"/><Buttonandroid:id="@+id/btn_lower_right"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@+id/btn_center"android:layout_toRightOf="@+id/btn_center"android:text="@string/lower_right"/><Buttonandroid:id="@+id/btn_ok"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@+id/btn_lower_left"android:layout_toLeftOf="@+id/btn_lower_left"android:text="@string/ok"/><Buttonandroid:id="@+id/btn_canel"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@+id/btn_lower_right"android:layout_toRightOf="@+id/btn_lower_right"android:text="@string/cancel"/><Buttonandroid:id="@+id/btn_upper_left_corner"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentLeft="true"android:layout_alignParentTop="true"android:text="@string/upper_left_corner"/><Buttonandroid:id="@+id/btn_upper_right_corner"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_alignParentTop="true"android:text="@string/upper_right_corner"/><Buttonandroid:id="@+id/btn_lower_left_corner"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentLeft="true"android:layout_alignParentBottom="true"android:text="@string/lower_left_corner"/><Buttonandroid:id="@+id/btn_lower_right_corner"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_alignParentBottom="true"android:text="@string/lower_right_corner"/></RelativeLayout>
5、启动应用,查看效果
- 查看11个按钮的相对位置
三、总结
- 相对布局可以让子控件相对于兄弟控件或父控件进行布局,可以设置子控件相对于兄弟控件或父控件进行上下左右对齐。
RelativeLayout能替换一些嵌套视图,当我们用LinearLayout来实现一个简单的布局但又使用了过多的嵌套时,就可以考虑使用RelativeLayout重新布局。
相对布局就是一定要加Id才能管理。
Android Studio 笔记3.3 相对布局相关推荐
- android获取其他app布局,Android Studio查看其它APP的布局结构
概述 日常使用别家的APP过程中,会遇到一些比较好看的布局,这时候我们就想学习一下别人的布局结构,以便参考. (1)手机连接电脑.设置手机为USB调试模式 (2)运行Android Studio,打开 ...
- Android Studio 工具窗口浮动与布局恢复【申明:来源于网络】
Android Studio 工具窗口浮动与布局恢复[申明:来源于网络] http://bbs.chinaunix.net/thread-4182438-1-1.html 转载于:https://ww ...
- Android Studio 笔记1.3 安卓应用目录结构
这里写目录标题 一.学习目标 二.前言 三.笔记1.3概述 (一)安卓应用视图 1.Project视图 2.Package视图 3.Android视图 (二)安卓应用目录结构 1.项目清单目录 - m ...
- Android Studio xml文件中的布局预览视图
操作系统:Windows 10 x64 IDE:Android Studio 3.3.1 更新了Android Studio之后,xml文件中的布局预览视图变得如此简洁! 原因是没有勾选Show La ...
- ubuntu12.04 安装Android Studio笔记
2019独角兽企业重金招聘Python工程师标准>>> Ubuntu安装Android Studio ###说明 安装教程参考stormzhang的博客 所有的软件在这里(已经备份到 ...
- android 自定义窗口,Android studio如何自定义设置窗口布局?
1.进行打开电脑中的Android studio中进行设置布局上的窗口选项. 2.默认布局设定完成之后,然后进行Android studio菜单中的"windows"的选项. 3. ...
- Android学习笔记 56. TabLayout 选项卡布局
Android学习笔记 Android基础开发--布局 文章目录 Android学习笔记 Android基础开发--布局 56. TabLayout 选项卡布局 56.1 简介 56.2 TabIte ...
- Android Studio笔记4.2 安卓触摸事件
文章目录 一.前言 二.笔记4.2 安卓触摸事件 (一)安卓触摸事件概述 1.触摸分类 (1).单点触摸 (2).多点触摸 2.触摸动作 3.触摸监听器 4.触摸方法 5.触点个数与坐标 6.安卓触摸 ...
- Android Studio 笔记4.2 安卓触摸事件
文章目录 一.前言 二.笔记4.2 安卓触摸事件 (一)安卓触摸事件概述 1.触摸分类 (1).单点触摸 (2).多点触摸 2.触摸动作 3.触摸监听器 4.触摸方法 5.触点个数与坐标 6.安卓触摸 ...
最新文章
- mysql执行事务的语句_详解MySQL执行事务的语法和流程
- 统计数字,空白符,制表符_为什么您应该在HTML中使用制表符空间而不是多个非空白空间(nbsp)...
- sql help cs
- 『设计模式』设计模式--策略模式
- python 编码规范
- json格式校验并显示错误_使用postman做自动化接口校验
- 计算机应用基础精品课程申报表,《计算机应用基础》精品课程申报书(修改意见)...
- 自动驾驶公司Momenta完成B2轮融资,凯辉领投GGV跟投
- linux+echo+权限不够,解决linux echo命令以及linux echo命令提示权限不够的方法
- 关于快逸报表超链接的使用方式。
- 《软件设计师教程最新版(第三版》
- 【Altium Designer10详细安装】
- 基于ssm的仓库管理系统
- 计算机无法读取tf卡,为什么电脑不识别TF卡?
- [转载]提升你幽默感的100句经典短语
- 数学与计算机学院校友会,忆青春成长路 话数计奋斗情——数学与计算机学院校友会...
- 天猫精灵python开发_天猫精灵X1智能音箱使用感想
- linux vi编辑器操作手册
- flutter 高效计算时间差
- 每天3分钟知晓天下事,一句话新闻资讯简报的公众号推荐