SuperAPI AI 工具集

makepad-2.0-widgets

前端与建站

查看项目

更新于 10-16 02:02

技能介绍

用途

Makepad 2.0 Widgets 是 Makepad 2.0 的控件目录与使用技能,面向使用 Splash 语法构建 UI 的开发者。Makepad 2.0 提供了一套丰富的内置控件,所有控件均以 Splash 语法定义,并通过 script_mod! 注册。该技能用于查询控件清单、属性与常见用法,帮助在 Makepad 项目中正确选用和组合控件。

主要能力

技能按类别组织控件,并给出关键属性:

  • 容器(布局):View(透明基础容器)、SolidView(纯色背景)、RoundedView(圆角)、RoundedAllView(统一圆角)、GradientXView / GradientYView(渐变背景)、ScrollXView / ScrollYView / ScrollXYView(滚动)。关键属性包括 width、height、flow、spacing、padding、align 等。
  • 文本控件:Label、H1–H4 标题、P 段落、TextInput(可编辑文本,支持 empty_text、password、read_only、numeric_only)、Markdown、Html、LinkLabel。
  • 按钮:Button、ButtonFlat、ButtonFlatter。
  • 开关:CheckBox、Toggle、RadioButton,关键属性 text、active。
  • 输入控件:Slider(min、max、step、default、precision)、DropDown(labels 列表)。
  • 媒体:Image(source、fit 模式)、Svg(外部 SVG,支持 crate_resource/http_resource、animating、颜色)、Icon(着色 SVG 图标)、Vector(内联矢量图形)、LoadingSpinner、MapView(center_lon、center_lat、zoom)。
  • 布局辅助:Hr(水平分隔线)、Vr(垂直分隔线)、Filler(弹性空间)、Splitter(可调整分割)、FoldHeader(可折叠区域)。
  • 列表:PortalList(虚拟化列表,适合 100+ 项,仅渲染可见项)、FlatList(简单列表,适合小列表)。
  • 导航:Modal、Tooltip、PopupNotification、SlidePanel、ExpandablePanel、PageFlip、StackNavigation。
  • Dock 系统:Dock、DockSplitter、DockTabs、DockTab。

使用方式

技能文档以本地参考文件形式提供:

  • ./references/widget-catalog.md:完整控件列表及属性。
  • ./references/widget-advanced.md:高级模式,包括 PortalList、Dock、自定义控件、MapView。

在回答相关问题前,需先阅读上述相关参考文件,并将参考内容纳入回答。

技能还给出常见控件组合模式,例如:

  • 卡片:RoundedView 配合 padding、new_batch、draw_bg.color、draw_bg.border_radius、flow、spacing,内部放置标题与正文 Label。
  • 表单输入:View 纵向排列,Label 作为字段名,TextInput 设置 empty_text。
  • 可滚动列表:ScrollYView 配合 on_render 循环渲染条目模板。

关键规则

  • 容器需显式设置 height: Fit,否则 View 默认高度为 0,子内容不可见。
  • 带背景色且包含文本子控件的容器需设置 new_batch: true,否则文本会被背景遮挡。
  • 需要引用或覆盖的子控件使用 := 命名;不命名的为静态控件,不可寻址。
  • Label 默认颜色为白色,浅色背景上需显式设置 draw_text.color。
  • MapView 必须使用固定高度,不能使用 Fill。
  • Label 不支持 animator,需要动画时应包裹在 View 中。

适用场景

适用于使用 Makepad 2.0 与 Splash 语法进行 UI 开发的场景,包括控件选型、属性查询、布局组合、列表与导航实现、Dock 布局搭建,以及排查容器高度、背景遮挡、文本颜色、地图尺寸等常见问题。

限制

资料未提供该技能的安装命令、收费方式、平台支持范围或效果数据,这些信息暂未提供。文档版本为 makepad-widgets(dev 分支),最后更新日期为 2026-03-03。