跳转到主要内容
提示框控件
超过 4 个月前更新

通过提示框控件,您可以添加一个紧凑的提示框,这在您想要隐藏内容并节省表单或自定义页面上的空间时非常有用。您可以在页面上任何地方添加提示框,并且只需点击控件就能根据您的视觉需求进行自定义设计。

在本文中,您将学习如何轻松添加提示框控件。现在,让我们一起了解这个过程。


添加提示框控件

首先,在控件添加面板中找到提示框控件,然后将其拖放到页面上的某个区域或容器中。


内容设置

导航到提示框的内容菜单页签。这里的第一部分包含定义提示框内容的特性,让我们来看看:

  • 按钮类型:按钮可以标记为文本或图片。这里您可以选择标记类型。如果选择“文本”,则可以在相应字段中输入文本。如果选择了“图片”选项,则可以上传图片或从动态内容中选择,并设置其大小;

  • 前/后图标:您可以在按钮的文本或图片前后放置图标。这里您可以从图标库中选择;

  • 对齐方式:这里您可以选择按钮在区域内的位置;

  • 内容类型:提示框支持多种内容类型,包括:

    简单文本:如果您只想要通知,可以选择“简单文本”选项,并在简单文本文本区域中填写。

    富文本:此选项允许您添加图片、超链接和其他格式的文本,适用于需要格式化内容的情况。

    动态内容:支持将其他控件放入下拉框中。这允许您创建更丰富和定制化的内容,例如将表单、图表或其他交互式控件直接嵌入提示框中。

设置

内容菜单选项卡的设置部分包含影响提示框本身和按钮布局的特性。

  • 位置:在此下拉菜单中,您可以选择出现提示框的位置。有12种位置方向,因此可以试验它们以确定最佳位置;

  • 自动定位:如果您希望提示框自动决定出现提示框的位置,请开启此功能。

  • 打开方式:此下拉菜单允许您选择哪种动作将使提示框出现。它可以在悬停或点击时发生;选项有默认、悬停、点击。

  • 隐藏延迟:如果您在模式功能中选择了“悬停”选项,此处输入的毫秒值将定义用户停止将指针悬停在按钮上后提示框保持显示的时间;

  • 偏移量:这是按钮与提示框之间的间隙。您可以通过移动滑块或在字段中输入值来选择它;

  • 宽度:这里您可以选择提示框的宽度。如果您不调整此未来,宽度将根据内容自动设置;

  • 固定布局:您可以通过启用此开关使提示框按钮保持在一个位置。即使用户滚动页面,按钮也会保持在同一位置。位置可以在FixedPosition下拉菜单中更改,与屏幕边界的距离在Spacer字段中设置。Z-index特性允许您定义页面的哪些部分将被提示框按钮覆盖,数字越小,提示框对其他元素的优先级越高。


提示框样式

提示框控件有许多不同的样式设置,因此您可以更改其外观,使您的页面看起来非常出色。

按钮样式

  • 排版:设置按钮文本的排版选项。

  • 常规 / 悬停 / 活动:为常规、悬停和活动(提示框展开时)状态设置不同的样式。

  • 背景类型:为常规和悬停状态选择按钮的背景颜色。您可以使用纯色或渐变色

  • 文字颜色:选择按钮文本的颜色

  • 阴影:设置应用在按钮上的框阴影的选项

  • 边框类型:选择围绕按钮使用的边框类型

  • 半径:设置边框半径来控制角落的圆滑度

  • 内边距:更改按钮的内边距设置

内容样式

  • 排版:更改内容文本的默认排版选项

  • 对齐:将内容对齐到左侧、中间或右侧。

  • 背景类型:为常规和悬停状态选择内容框的背景颜色。您可以使用纯色或渐变色

  • 文字颜色:选择内容的文本颜色

  • 边框类型:选择围绕内容框使用的边框类型。

  • 半径:设置边框半径来控制角落的圆滑度

  • 阴影:设置应用在内容框上的框阴影的选项。

  • 内边距:更改内容框的内边距设置。

  • Z-index:设置内容框的Z-Index。了解更多关于Z-Index的信息

注意:

当内容类型是普通文本和富文本时,内容面板为文本样式设置。内容类型为动态内容时,内容面板为动态内容设置。


高级设置

设置适用于此控件的高级选项。

这是否解答了您的问题?