Skip to content

Label 富文本与链接 ​

用于在一个 Label 中混排样式,并通过 OnLinkClicked 处理局部链接点击。该能力仅用于客户端 GameUI。

字号采用设计画布单位,先读 UI 字号与可读性。下面的 26 是默认画布下桌面正文的排版起点,需结合目标窗口和移动设备验证。

公开标签 ​

text
<b>粗体</b>
<i>斜体</i>
<u>下划线</u>
<color value="#48C9FF">颜色</color>
<color value="#48C9FFCC">带透明度颜色</color>
第一行<br/>第二行
<link id="open_shop">打开商店</link>

仅使用以上 GameUI 标记子集,不生成 href 或任意 HTML 标签。

推荐实现 ​

csharp
#if CLIENT
var label = new Label
{
    Text = "请选择:" +
           "<link id=\"open_shop\"><color value=\"#48C9FF\"><b>打开商店</b></color></link> " +
           "<color value=\"#FFCB57\"><link id=\"show_rules\">查看规则</link></color>",
    FontSize = 26,
    TextWrap = true,
    Width = 480,
};

label.OnLinkClicked += (_, args) =>
{
    switch (args.LinkId)
    {
        case "open_shop":
            OpenShop();
            break;
        case "show_rules":
            ShowRules();
            break;
    }
};

label.AddToRoot();
#endif

事件规则 ​

  • 使用 Label.OnLinkClicked,不要用控件级普通点击事件猜测点击了哪段文字。
  • args.LinkId 来自 <link id="...">。
  • args.PointerButtons 表示触发点击的指针按钮。
  • 只有链接范围内的文字触发事件;同一 Label 的普通文字不触发。
  • 多个链接共用一个处理器,通过稳定的语义 LinkId 路由。
  • OnLinkClicked 仅在客户端 API 中可用,相关代码放入 #if CLIENT。

嵌套规则 ​

下面两种写法都支持:

text
<link id="details"><color value="#48C9FF"><b>查看详情</b></color></link>
<color value="#FFCB57"><link id="details">查看详情</link></color>

优先保持标签完整闭合。复杂段落可以拆成多个 Label,避免把布局、按钮和长文本全部塞进一个富文本字符串。

控件选择 ​

  • 一段文字里只有局部词语可点击:Label + <link> + OnLinkClicked。
  • 整个区域都是一个操作:使用 Button / TextButton。
  • 只需要整体控件点击、不关心文字片段:使用对应控件的普通点击事件。

验证清单 ​

  1. Client-Debug 编译通过。
  2. 粗体、斜体、下划线、颜色和换行显示正确。
  3. 分别点击每个链接,确认收到预期 LinkId。
  4. 点击普通文字,确认不会触发 OnLinkClicked。
  5. 改写嵌套顺序后,确认链接标识仍然正确。

完整说明见 Label 富文本与链接指南。