这是一个专门讨论 idea 的地方。
每个人的时间，资源是有限的，有的时候你或许能够想到很多 idea，但是由于现实的限制，却并不是所有的 idea 都能够成为现实。
那这个时候，不妨可以把那些 idea 分享出来，启发别人。
每个人的时间，资源是有限的，有的时候你或许能够想到很多 idea，但是由于现实的限制，却并不是所有的 idea 都能够成为现实。
那这个时候，不妨可以把那些 idea 分享出来，启发别人。
这是一个创建于 665 天前的主题，其中的信息可能已经有所发展或是发生改变。
UI 的本质可能就是一个大盒子装着很多小盒子，然后每个小盒子又装着更小的盒子，一直这样多级嵌套下去，直到所有的视觉元素都被表达出来。在交互上，一个盒子上发生的事件可能会触发其他的多个盒子上的事件。盒子们可以被创建、可以被删除，可以改变形状和位置……
 |
1
acmore 2023-02-22 09:03:50 +08:00
上古时代的一种设计思路更极端：UI 是一个 table 套一个 table
|
 |
2
wanguorui123 2023-02-22 09:07:55 +08:00
就是组件套组件
|
 |
3
kop1989smurf 2023-02-22 09:14:45 +08:00  1
这是布局思路之一。也就是线性 /盒子布局。
相对应的，还有相对布局（ x 的上边缘对其 y 的下边缘，z 的左边缘对其 y 的右边缘） 还有绝对布局（屏幕坐标点 x,y 处有一个高宽分别为 a ，b 的矩形，层级为 z ） |
 |
4
Mithril 2023-02-22 09:15:15 +08:00 2
盒子模型，因为屏幕是方的。
要是从一开始显示设备就是用极坐标设计的话，没准屏幕就做成圆的了，那就成蛋模型了。 但不管怎么算，都可以统一认为是套娃模型。 |
 |
5
debuggerx 2023-02-22 09:39:59 +08:00 3
没错，所以 UI 的本质就是嵌套，用嵌套语法写 UI 其实才是最直观最接近根源的。
吐槽 flutter 嵌套的都是不懂 UI 本质的，用了 flutter 却总想着“优化”嵌套的也都是“大聪明”行为。 |
 |
6
retrocode 2023-02-22 09:56:55 +08:00
借一个老梗
郭德纲: UI 的本质应该像穿衣服, 你得一层一层把衣服穿起来, 才能好看 于谦: UI 的本质应该像脱衣服, 你得一层一层把衣服脱了, 把最重要的露出来 |
 |
7
cmdOptionKana 2023-02-22 10:00:47 +08:00
这不是 UI 的本质，只是解决 UI 问题的一种常用、易用的思路 /模型。
|
 |
8
HeyWeGo 2023-02-22 10:59:46 +08:00
描述看看上去更像是 现有的 UI 实现方式的总结。
|
 |
9
sunwayTaihulight 2023-02-22 11:37:14 +08:00 1
嵌套 → 树
树形结构是描述页面 UI 的一种方式，而不是本质。 |
 |
10
mango111 2023-02-22 13:00:32 +08:00
这叫节点树
|
 |
11
Xusually 2023-02-22 13:07:58 +08:00
不然 CSS 的盒子模型是怎么来的？
|
 |
12
movax21h 2023-02-22 14:35:50 +08:00
比尔盖兹叫他，window ，视窗。
|
 |
14
mingl0280 2023-02-22 15:09:00 +08:00 via Android
这不就是 HTML XML CSS XAML 甚至 MDI……等等所有 UI 设计工具的原理么？
|
 |
15
tool2d 2023-02-22 15:18:49 +08:00
你说的是 UX 设计，不能全算 UI 。
程序 UI 开发到后面就是面对组件开发，光一个列表组件，就有几十个消息需要处理。 nodepad3 作者就是写了一个 richedit 组件，就能耀武扬威，因为复杂度上去后，普通人写不出来。 |
 |
16
cheng6563 2023-02-22 16:06:10 +08:00
套到最里面的盒子就是 canvas
|
 |
17
deesan 2023-02-22 16:16:24 +08:00
都是树，ps 、sketch 、figma 的图层也是树
|
 |
18
lower 2023-02-22 17:32:44 +08:00
@kop1989smurf 赞同，之前看过一本游戏开发的书，里面还讲到三维空间坐标 跟屏幕坐标 转换的相关知识点，还有什么三维模型投影到二维屏幕上，栅格化之类的各种算法，太复杂了
|
Select Language