Day4 Android - Layout版面(上)

接续前一天提到的,每一种layout都有它不同的属性名称以及排序模式,我这边就先举三个较常用的layout,当然这之中里面都可以再包其他的layout来设计,只是要注意每个布局的特性
(另外如果你想在里面调整最外层的布局,可以滑鼠右键再design里面的component tree最外围的layout选Convert View更改,也可以在程序码里面做微改),那麽就先从ConstraintLayout(约束布局)开始。


ConstraintLayout

约束布局,首先这个布局需要至少两条的约束(上or下,左or右),否则如果x或y有一边没设,则没约束的轴会没有基准点然後跑错误,而预设位置是左上角,而约束的部分我等等会再提,这个布局方便的点主要是可以直接在design内直接做拉位置的动作。
https://ithelp.ithome.com.tw/upload/images/20210712/20139259wLNb8uPcJJ.png
这支xml档是我前几天所提到的,我的预设版面ConstraintLayout(当然不一定一样),然後里面包含了显示Hello World!的TextView,可以看到最外层的宽高是match_parent(上层物件的大小),而Hello World!的TextView的宽高是wrap_content(内容物件的大小),最外层大部分都是match_parent(也就是一个版面),我待会会再新增一个TextView来设计Hello Android!,接着提一下重要的”约束”部分。

约束大约都是这样的方式来赋予约束:

app:layout_constraint<!--(我的方向)-->_to<!--(对应元件or父层的方向)-->Of=”<!--想对应的元件id或者父层-->”;

所以 app:layout_constraintTop_toTopOf也就是我的顶部和元件or父层的顶部对齐,
而app:layout_constraintLeft_toLeftOf也就是我的左侧和元件or父层的左侧对齐,
而如果对应到的是parent的话就是会对应上一层(父层)的Top顶部或者Left左侧。


方向种类

主要有:Top(顶部)、Bottom(底部)、left(左侧)、Right(右侧)

或者是:Top(顶部)、Bottom(底部)、Start(左侧)、End(右侧)

当然Start、Right或者Left、End交杂的用虽然不会跑错误,但这样会导致後面给的属性会不太一样,分成这两组会比较好理解一点。

也可以透过打开Design後,再打开旁边的Attributes来看属性,也可以在里面做调整。
https://ithelp.ithome.com.tw/upload/images/20210712/20139259skF2K84tJG.png
而这是Hello World! TextView的属性(四边约束),属性也可以再这边做调整(但我通常是都直接用拖曳、拉大小或者从程序改属性,但还是讲一下这边ConstraintlyLayout widget的部分)
https://ithelp.ithome.com.tw/upload/images/20210712/2013925979SYJiCLGU.png
看到红方框内,这两条出现的时机主要是在左跟右或上跟下同时有约束的情况会出现,然後可以用来调整位置(你可以理解为偏差的意思),预设的值为0.5(方框内的值显示是50),值可以是0(最左)~1(最右),另外如果要取消约束的话也可以透过拿掉对应的程序码或者在这张图中,点击0旁边的实心小圆点来取消那一边的约束。

属性名称

app:layout_constraintHorizontal_bias  //x轴 值0(左)~1(右)
app:layout_constraintVertical_bias    //y轴 值0(左)~1(右)

而如果x、y轴只有设一边的情况下

属性名称(X、Y轴其中只设一边的那部分)

android:layout_margin<!--方向-->=”<!--离那个方向多少dp-->” ;

而下方也有All Attributes也就是所有的属性,就不一一做解释了,如果有用到的时候会再提。

我这边主要举比较常用的几个属性,如果想深入理解其他属性的话可以参考下面的文献。
详情:ConstraintLayout参考资料


那麽今天主要先介绍这个布局,明天来介绍RelativeLayout以及LinearLayout。


<<:  Day 06:选择排序(selection sort)

>>:  JavaScript Day 10. 阵列

Flutter学习Day4 Widget 观念 StatefulWidget

今天要来介绍StatefulWidget啦 从字面上看起来就是 有状态的部件(取名字真的很重要) w...

关於URL encode

缘由: 开发时常常会遇到要对api传送参数的状况, 但常常都是传送String Int Bool等,...

【D15】当大盘涨的时候,跟台积电有关系吗?

前言 取得众多资料後,接下来就要分析,我们来看看台积电与加权指数有关系吗? d15_2330AndT...

[DAY21] 非同步的 Boxenn Use Case

在实务中,常常会有花很长执行时间、或需要排程的逻辑,这时候便会需要进行非同步处理。 在 Boxenn...

我选择的学习语言跟框架

我选了python当作主要开发语言 因为我以前有用过python而且很潮 框架部分我选比较主流的Dj...