Kotlin入门-Android的基础布局
线性布局
线性布局LinearLayout是最常用的布局,顾名思义,它下面的子视图像是用一根线串了起来,所以其内部视图的排列是有顺序的,要么从上到下垂直排列,要么从左到右水平排列。排列顺序只能指定一维方向的视图次序,可是手机屏幕是个二维的平面,这意味着还剩另一维方向需要指定视图的对齐方式。故而线性布局主要有以下两种属性设置方法:
1. setOrientation: 设置内部视图的排列方向。LinearLayout.HORIZONTAL表示水平布局,LinearLayout.VERTICAL表示垂直布局。
2. setGravity: 设置内部视图的对齐方式。Gravity.LEFT表示靠左对齐、Gravity.RIGHT表示靠右对齐、Gravity.TOP表示靠上对齐、Gravity.BOTTOM表示靠下对齐、Gravity.CENTER表示居中对齐。
空白距离margin和间隔距离padding是另外两个常见的视图概念,margin指的当前视图与周围视图的距离,而padding指的是当前视图与内部视图的距离。这么说可能有些抽象,接下来还是做个实验,看看它们的显示效果到底有什么不同。下面是个实验用的布局文件内容,通过背景色观察每个视图的区域范围:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- 外层布局的背景色是蓝色 -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="#00aaff" >
<!-- 中间布局的背景色是黄色 -->
<LinearLayout
android:id="@+id/ll_margin"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffff99" >
<!-- 内层视图的背景色是红色 -->
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff0000" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
与上述布局文件对应的页面Kotlin代码如下,根据不同的按钮分别设置不同方向上的margin和padding数值:
//该页面用于演示margin和padding的区别
class LinearLayoutActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_linear_layout)
//设置ll_margin内部视图的排列方式为水平排列
ll_margin.orientation = LinearLayout.HORIZONTAL
//设置ll_margin内部视图的对齐方式为居中对齐
ll_margin.gravity = Gravity.CENTER
btn_margin_vertical.setOnClickListener {
//Kotlin对变量进行类型转换的关键字是as
val params = ll_margin.layoutParams as LinearLayout.LayoutParams
//setMargins方法为设置该视图与外部视图的空白距离
//此处设置左边和右边的margin空白距离为50dp
params.setMargins(0, dip(50), 0, dip(50))
ll_margin.layoutParams = params
}
btn_margin_horizontal.setOnClickListener {
val params = ll_margin.layoutParams as LinearLayout.LayoutParams
//此处设置顶部和底部的margin空白距离为50dp
params.setMargins(dip(50), 0, dip(50), 0)
ll_margin.layoutParams = params
}
//setPadding方法为设置该视图与内部视图的间隔距离
btn_padding_vertical.setOnClickListener {
//此处设置左边和右边的padding间隔距离为50dp
ll_margin.setPadding(0, dip(50), 0, dip(50))
}
btn_padding_horizontal.setOnClickListener {
//此处设置顶部和底部的padding间隔距离为50dp
ll_margin.setPadding(dip(50), 0, dip(50), 0)
}
}
}
依据页面代码例子,Kotlin代码与Java代码的写法有以下三点区别:
1. Kotlin允许对属性orientation直接赋值,从而取代了setOrientation方法;类似的还有属性gravity取代了setGravity方法;
2. Kotlin使用关键字as进行变量的类型转换;
3. Kolin支持调用dip方法将dip数值转换为px数值,倘若由Java编码则需开发者自己实现一个像素转换的工具类;
因为dip方法来自于Kotlin扩展的Anko库,所以需要在Activity代码头部加上下面一行导入语句:
import org.jetbrains.anko.dip
既然用到了Anko库,自然要修改模块的build.gradle,在dependencies节点中补充下述的anko-common包编译配置:
compile "org.jetbrains.anko:anko-common:$anko_version"
Anko库除了提供dip方法,还提供了sp、px2dip、px2sp、dimen等像素单位的转换方法,具体的方法说明见下表。
dip 将dip单位的数值转换为以px为单位的数值
sp 将sp单位的数值转换为以px为单位的数值
px2dip 将px单位的数值转换为以dip为单位的数值
px2sp 将px单位的数值转换为以sp为单位的数值
dimen 将dip单位的数值转换为以sp为单位的数值
相对布局
由于线性布局的视图排列方式比较固定,既不能重叠显示也不能灵活布局,因此复杂一些的界面往往用到相对布局RelativeLayout。相对布局内部的视图位置不依赖于排列规则,而依赖于指定的参照物,这个参照物可以是与该视图平级的视图,也可以是该视图的上级视图(上级视图即相对布局自身)。有了参照物之后,还得指定当前视图位于参照物的哪个方向,才能确定该视图的具体位置。
在代码中指定参照物及其所处方位,调用的是布局参数对象的addRule方法,方法格式形如“addRule(方位类型, 参照物的资源ID)”。下面是个给相对布局添加下级视图的Kotlin代码例子:
//根据参照物与方位类型添加下级视图
private fun addNewView(align: Int, referId: Int) {
var v = View(this)
v.setBackgroundColor(Color.GREEN)
val rl_params = RelativeLayout.LayoutParams(100, 100)
rl_params.addRule(align, referId)
v.layoutParams = rl_params
v.setOnLongClickListener { vv -> rl_content.removeView(vv); true}
rl_content.addView(v)
}
代码里的方位类型有多种取值,比如RelativeLayout.LEFT_OF表示位于指定视图的左边,RelativeLayout.ALIGN_RIGHT表示与指定视图右侧对齐,RelativeLayout.CENTER_IN_PARENT表示位于上级视图中央等等。举个例子,让某视图位于指定视图上方,且与上级视图的左侧对齐,则调用addRule方法的Kotlin代码如下所示:
rl_params.addRule(RelativeLayout.ABOVE, 指定视图的资源ID)
rl_params.addRule(RelativeLayout.ALIGN_PARENT_LEFT, 上级视图的资源ID)
由此可见,常规的addRule调用代码有点冗长,因此Kotlin利用Anko库将相对位置进行了简化,具体办法是引入扩展函数实现相对位置的设定,譬如above方法代表位于指定视图上方,alignParentLeft方法代表与上级视图的左侧对齐。于是原来的Kotlin代码简化如下:
rl_params.above(指定视图的资源ID)
rl_params.alignParentLeft()
因为这几个新方法来自于Anko库,所以要在代码头部加上下面一行导入语句:
import org.jetbrains.anko.*
另外要修改模块的build.gradle,在dependencies节点中补充下述的anko-common包编译配置:
compile "org.jetbrains.anko:anko-common:$anko_version"
除了above和alignParentLeft之外,Anko也提供了所有的相对位置设定方法,具体的对应关系说明见下表。
Anko库的相对位置 RelativeLayout类的相对位置
leftOf LEFT_OF
sameTop ALIGN_TOP
above ABOVE
sameLeft ALIGN_LEFT
rightOf RIGHT_OF
sameBottom ALIGN_BOTTOM
below BELOW
sameRight ALIGN_RIGHT
centerInParent CENTER_IN_PARENT
alignParentLeft ALIGN_PARENT_LEFT
centerVertically CENTER_VERTICAL
alignParentTop ALIGN_PARENT_TOP
centerHorizontally CENTER_HORIZONTAL
alignParentRight ALIGN_PARENT_RIGHT
alignParentBottom ALIGN_PARENT_BOTTOM
---------------------
作者:湖前琴亭
来源:CSDN
原文:https://blog.csdn.net/aqi00/article/details/82829481
版权声明:本文为博主原创文章,转载请附上博文链接!
Kotlin入门-Android的基础布局的更多相关文章
- Kotlin入门(19)Android的基础布局
线性布局线性布局LinearLayout是最常用的布局,顾名思义,它下面的子视图像是用一根线串了起来,所以其内部视图的排列是有顺序的,要么从上到下垂直排列,要么从左到右水平排列.排列顺序只能指定一维方 ...
- Kotlin入门教程——目录索引
Kotlin是谷歌官方认可的Android开发语言,Android Studio从3.0版本开始就内置了Kotlin,所以未来在App开发中Kotlin取代Java是大势所趋,就像当初Android ...
- 写给Android开发者的Kotlin入门
写给Android开发者的Kotlin入门 转 https://www.jianshu.com/p/bb53cba6c8f4 Google在今年的IO大会上宣布,将Android开发的官方语言更换为K ...
- Android零基础入门第29节:善用TableLayout表格布局,事半功倍
原文:Android零基础入门第29节:善用TableLayout表格布局,事半功倍 前面学习了线性布局和相对布局,线性布局虽然方便,但如果遇到控件需要排列整齐的情况就很难达到要求,用相对布局又比较麻 ...
- Android零基础入门第30节:两分钟掌握FrameLayout帧布局
原文:Android零基础入门第30节:两分钟掌握FrameLayout帧布局 前面学习了线性布局.相对布局.表格布局,那么本期来学习第四种布局--FrameLayout帧布局. 一.认识FrameL ...
- Android零基础入门第28节:轻松掌握RelativeLayout相对布局
原文:Android零基础入门第28节:轻松掌握RelativeLayout相对布局 在前面三期中我们对LinearLayout进行了详细的解析,LinearLayout也是我们用的比较多的一个布局. ...
- Android零基础入门第25节:最简单最常用的LinearLayout线性布局
原文:Android零基础入门第25节:最简单最常用的LinearLayout线性布局 良好的布局设计对于UI界面至关重要,在前面也简单介绍过,目前Android中的布局主要有6种,创建的布局文件默认 ...
- Android零基础入门第32节:新推出的GridLayout网格布局
原文:Android零基础入门第32节:新推出的GridLayout网格布局 本期主要学习的是网格布局是Android 4.0新增的布局,和前面所学的TableLayout表格布局 有点类似,不过他有 ...
- Android零基础入门第31节:几乎不用但要了解的AbsoluteLayout绝对布局
原文:Android零基础入门第31节:几乎不用但要了解的AbsoluteLayout绝对布局 前面几期基本学习了Android开发中常用的四种布局,之所以把AbsoluteLayout放在后面来学习 ...
随机推荐
- WeixinJSBridge目前还能够直接使用的功能(2019)
参考地址:http://mmlike.sinaapp.com/ 其余功能不是不能用了,而是有各种条件了. 以下列出的功能,均可直接使用,无需appid等任何东东,只要在手机微信网页环境中 发送邮件 W ...
- 查看mysql的bin-log日志
1.查看有哪些binlog show binary logs; show master logs; 2.如何查看log_bin中的内容 show binlog events; 查看第一个binlog的 ...
- IMSI-catcher:可发现附近手机敏感信息的工具
严正声明:该工具主要是为了让大家更好的了解GSM网络的工作原理而设计开发的,请不要用于恶意目的! 前言 IMSI-catcher是一个可以帮助你发现附近手机的IMSI号码,国家,品牌和运营商等信息 ...
- 【2017-09-04】JavaWeb内置对象
Jsp页面中引入别的页面 include命令 <%@ include file="要引入的页面路径"%> 页面中的form表单提交方式: post: 提交内容不可见, ...
- idou老师教你学Istio06: 如何用istio实现流量迁移
流量迁移是流量管理的一个重要功能.istio提供的流量管理功能将流量从基础设施扩展中解耦,支持动态请求路由,故障注入.超时重试.熔断和流量迁移等.流量迁移的主要目的是将流量从微服务的某一版本的逐步迁移 ...
- less注释
less中的注释 1.可以使用css中的注释(/***/) 2.也可以用//注释 //编译时会自动过滤掉 /**我是会被编译的*/ ul{ // padding: 0px; // height: ...
- 使用@ConfigurationProperties注解 提示 “Spring Boot Configuration Annotation Processor not found in classpath ”
解决方案: 在 pom.xml 添加依赖 <dependency> <groupId>org.springframework.boot</groupId> < ...
- 14、Spring Boot 2.x 集成 Druid 数据源
14.Spring Boot 2.x 集成 Druid 数据源 完整源码: Spring-Boot-Demos
- SIGAI深度学习第五集 自动编码器
深度学习模型-自动编码器(AE),就是一个神经网络的映射函数,f(x)——>y,把输入的一个原始信号,如图像.声音转换为特征. 大纲: 自动编码器的基本思想 网络结构 损失函数与训练算法 实际使 ...
- Activiti服务类- ManagementService服务类
一共含有17个方法 // 获取包含了Activiti数据库模式的{表名.行计数}项的映射.Map<String, Long> getTableCount();//获取诸如任务.执行之类的A ...