Rate
ui.widgets.Rate星評価、または上限付きの個数による評価。
BEHAVIOR CONTRACT
count、value、サイズ、読み取り専用に対応し、hover のプレビューは確定値と一致します。
RECORDED INTERACTION
5 項目と 10 項目、読み取り専用、3 種類のサイズを示します。
// ── Rate ──
pub fn buildRate(scope: *ui.Scope, cx: *ui.Cx) anyerror!*ui.Node {
const a = cx.allocator;
const c = try col(cx, 16);
const r1 = try W.Rate(.{ .count = 5, .value = 3 }).mount(scope, cx);
try c.appendChild(a, try label(cx, "value 3 / 5"));
try c.appendChild(a, r1.wrapper);
const r2 = try W.Rate(.{ .count = 5, .value = 4, .disabled = true }).mount(scope, cx);
try c.appendChild(a, try label(cx, "readonly value 4"));
try c.appendChild(a, r2.wrapper);
// ── count 变体 ──
const r3 = try W.Rate(.{ .count = 10, .value = 7 }).mount(scope, cx);
try c.appendChild(a, try label(cx, "count 10, value 7"));
try c.appendChild(a, r3.wrapper);
// ── size 变体 ──
try c.appendChild(a, try label(cx, "Sizes (16 / 24 / 36)"));
const sizes_row = try row(cx, 24);
inline for (.{ 16, 24, 36 }) |sz| {
const rn = try W.Rate(.{ .count = 5, .value = 3, .size = @as(f32, sz) }).mount(scope, cx);
try sizes_row.appendChild(a, rn.wrapper);
}
try c.appendChild(a, sizes_row);
return c;
}Storybook にあるこの story のコードそのままです(zenit 5f9add5+wip 2026-09-30)。W は ui.widgets のことで、col / row / label は Storybook 内の小さなレイアウトヘルパーです。
RateProps
ui.widgets.Ratefn Rate(props: RateProps) RateBuilderフィールド
型
デフォルト値
説明
countu85—
valuef320—
disabledboolfalse—
sizef3224—
on_change?core.HandlerRefnull—
star_icon_assetsvg_assets.Assetsvg_assets.common.star_filled星标图标。默认实心星(common.star_filled,亮/灭只靠 tint 区分); 可换成自定义 SVG(心形、描边星等)。曾经默认为 null 时退化成 "*" 文本。
RateResult
ui.widgets.Rateフィールド
型
デフォルト値
説明
wrapper*Node—
—
state*RateState—
—