Modifier

布局与装饰通过 modifier prop 指定。从 supernode/widget 导入 Modifier，链式调用即可构造。小组件渲染成 RemoteViews，每个属性只能有一个值，因此小组件的修饰符与顺序无关，详见顺序。

import { Modifier, Text } from "supernode/widget";

<Text modifier={Modifier.fillMaxWidth().background("#FFFFFF").cornerRadius(12).padding(16)}>
  Hello
</Text>

与 Compose 的 Modifier.padding 一致，padding 可以是一个数字（四边相同），也可以是四边对象 { start, top, end, bottom } 或方向对象 { horizontal, vertical }，同一个对象不能混用两种写法。start 和 end 跟随布局方向。数值单位为 dp，与 widget.displaySize 一致。视图默认按内容自适应大小。

顺序

padding 总在背景内侧，多次 padding 会累加。background、cornerRadius、宽度（width、size、fillMaxWidth、fillMaxSize，以及 Row 中的 defaultWeight()）和高度（height、size、fillMaxHeight、fillMaxSize，以及 Column 中的 defaultWeight()）在一条链上都只能设置一次，重复设置时 widget.show() 会带着视图路径报错。

<Column>
  {/* 两条链效果相同：padding 都是内边距。 */}
  <Text modifier={Modifier.padding(8).background("#FFE0E0")}>内边距</Text>
  <Text modifier={Modifier.background("#FFE0E0").padding(8)}>内边距</Text>
</Column>

需要在背景外侧留白时，用带 padding 的 Box 包裹视图。

defaultWeight

defaultWeight() 是 Glance 唯一支持的 weight 形式：Row 或 Column 中所有设置了 defaultWeight() 的子视图平分主轴上的剩余空间。它只能用在 Column 和 Row 的直接子视图上（fragment 的子视图视为外层容器的子视图）。它在 Row 中设置宽度、在 Column 中设置高度，因此不能和同一主轴上的其他宽度或高度同时使用。

import { Modifier, Row, Spacer, Text } from "supernode/widget";

<Row verticalAlignment="center" modifier={Modifier.fillMaxWidth().padding(16)}>
  <Text>标题</Text>
  {/* 把“编辑”推到行尾。 */}
  <Spacer modifier={Modifier.defaultWeight()} />
  <Text>编辑</Text>
</Row>

圆角

cornerRadius(radius) 为视图的背景和内容设置圆角，仅在 Android 12（API 31）及以上生效，更早的版本显示直角。

组合修饰符

修饰符是不可变的，每次调用都返回新链。用 append 把父组件传入的 modifier 与自己的修饰组合起来，或者按条件追加修饰。append 只接受从 supernode/widget 导入的 Modifier。

import { Modifier, Text } from "supernode/widget";

function Tag({ label, selected, modifier = Modifier }: { label: string; selected: boolean; modifier?: Modifier }) {
  return (
    <Text modifier={modifier.padding({ horizontal: 8, vertical: 4 }).append(selected ? Modifier.background("#E0F0FF") : Modifier)}>
      {label}
    </Text>
  );
}