Figma 学习笔记 – Constraints 约束

用途

Constraints 用于 responsive design, 子元素和父元素建立约束关系后, 当父元素 dimension 变换的时候, 子元素的 dimension 会自动变换.

 

例子

Figma 学习笔记 – Constraints 约束

 

约束有份左右和上下, 概念是一样的,只是方向不同而已, 所以这里我指说其中一边.

默认的约束时 Left, Top

 

Left

Figma 学习笔记 – Constraints 约束

当约束 Left 时, 意味着子元素的 Left 始终保持和父元素的距离. 

所以我拉动父元素左边时, 子元素也一起移动了. 

而当我拉父元素右边时, 子元素没有任何反应.

Right

Figma 学习笔记 – Constraints 约束

和 Left 相反, 右边被固定了

 

上一篇:你一定要知道的5款交互原型设计工具


下一篇:Figma 学习笔记 – Scroll and Position Fixed