网站首页 > 知识剖析 正文
anchors(锚)是一种指定元素与其他元素位置关系的方法。
anchors属性又可以分为AnchorLine、Margin和Offset三个部分。
1.AnchorLine是anchors指定位置关系的基础,AnchorLine有top、bottom、
left、right、horizontalCenter、verticalCenter和baseline七条。
从图上看很直观,前六条线分别是元素的四条边外加水平居中线和垂直居中线。baseline是相对于文字而言的。
知道了有这么多条AnchorLine,那么又该如何使用呢?
AnchorLine属性的值也是AnchorLine,换句话说就是用元素的AnchorLine和另一个元素的AnchorLine去对齐。
例如a设置了anchors.left为b的left就表示a的左边和b的左边对齐。
2.margin可以作为AnchorLine的补充,分为topMargin、bottomMargin、leftMargin和rightMargin。分别表示上下左右四个方向的边距。也可以用margins一次性设置四个方向的边距。margin的取值是浮点型。
接上一个例子:
3. 之前说AnchorLine有七条,可以margin只有四个,那另外三种AnchorLine怎么进一步调整位置呢?
答案就是使用Offset。horizontalCenterOffset、verticalCenterOffset和baselineOffset,从名字就可以看出分别对应水平居中、垂直居中和baseline。
例:
4.除了以上对齐方式,anchors还有两个特殊的属性,anchors.fill和anchors.centerIn,分别表示填满元素和在元素中居中。两个属性的取值是Item(元素)
示例:
centerIn的效果和同时使用水平居中和垂直居中对齐是一样的,有兴趣可以试一试。
---> 文章来源于我的个人博客:fearlazy
---> 编程是一件怎么也学不会的事情,但是如果能享受学习的过程也是挺好的。
- 上一篇: 超优秀 仿B站蒙版弹幕组件Barrage-UI
- 下一篇: 一文讲解HTML元素类型
猜你喜欢
- 2024-11-22 UI: 为啥你这个页面边框1px看起来这么粗?
- 2024-11-22 开源推荐!一款支持pc端&移动端的滑动验证码组件
- 2024-11-22 Android 约束布局
- 2024-11-22 Android常用布局总结之(LinearLayout、GridLayout等4种)
- 2024-11-22 Visual Studio跨平台开发实战(4):Xamarin Android控制项介绍
- 2024-11-22 开源版SearchGPT来了,两张3090就可复现,超越Perplexity付费版
- 2024-11-22 不得不佩服,美观小巧的网页内容编辑器——ContentTools
- 2024-11-22 HTML中一些常见的特殊标签样式属性
- 2024-11-22 4.10「HarmonyOS鸿蒙开发」自定义布局
- 2024-11-22 NBA勇士队的五个历史荣誉,你见证过几个?揭晓勇士队的球队文化
- 08-01技术栈:SQL server数据库教程第八集
- 08-01威纶通触摸屏宏指令基本应用二
- 08-01如何实现动态钟表转动?
- 08-01Dart编程学习笔记03-函数
- 08-01人事管理中经常要用到的5个函数公式,总有一个你会用到
- 08-01Is系列判断函数都不掌握,那就真的Out了
- 08-01数据库 SQL 约束之 DEFAULT
- 08-01支付宝新功能?手把手教你调整花呗还款日
- 最近发表
- 标签列表
-
- xml (46)
- css animation (57)
- array_slice (60)
- htmlspecialchars (54)
- position: absolute (54)
- datediff函数 (47)
- array_pop (49)
- jsmap (52)
- toggleclass (43)
- console.time (63)
- .sql (41)
- ahref (40)
- js json.parse (59)
- html复选框 (60)
- css 透明 (44)
- css 颜色 (47)
- php replace (41)
- css nth-child (48)
- min-height (40)
- xml schema (44)
- css 最后一个元素 (46)
- location.origin (44)
- table border (49)
- html tr (40)
- video controls (49)