表格元件-Axure教程

编辑表数据

您可以通过以下任何选项向表格单元格添加文本或编辑其当前文本：

• 双击单元格进入文本编辑模式

• 选择单元格并按下ENTER进入文本编辑模式

• 选择单元格并开始键入。（此选项仅在您禁用了单键快捷键时可用）

从电子表格应用程序粘贴数据

您可以从 Microsoft Excel 和 Google Sheets 等电子表格应用程序复制表格数据，并将其作为表格元件粘贴到 Axure RP 中。首先，复制电子表格应用中的表格单元格。然后，在 Axure RP 中，右键单击画布并选择粘贴选项 → 粘贴为表格。

您还可以将其它表格数据粘贴到现有的表格元件中。为此，请选择表格左上角的单元格并按CTRL+V或CMD+V。粘贴的数据将填充表格中已经存在的单元格。

将数据粘贴到现有表格元件中时，不会将新的列和行添加到它们中。如果表格太小而无法容纳粘贴的数据，请在粘贴数据之前向表格中添加更多的列或行。

编辑行和列

添加、删除和移动行和列

要将行或列添加到表格元件，请右键单击其单元格之一或灰色的行或列控件之一。在上下文菜单中，从以下选项中进行选择：

• 在上方插入行

• 在下方插入行

• 在左侧插入列

• 在右侧插入列

要删除行或列，请右键单击该行或列中的单元格，或右键单击相应的灰色行或列控件。在上下文菜单中，选择删除行或删除列。

要重新排列表格的行和列，请选择一个灰色的行或列控件，然后向上/向下或向左/向右拖动它。

调整行和列的大小

您可以通过单击其边框之一并拖动来更改行的高度或列的宽度。

您还可以使用样式窗格中的W和H字段设置单个单元格的宽度和高度。这将自动调整单元格所属的行和列的大小。

要一次调整多个单元格的大小，请通过单击并拖动或通过SHIFT单击每个单元格来选择单元格。然后，使用W和H字段。

特殊交互

与单个单元格的交互

表格元件中的每个单元格都有自己的事件，您可以使用这些事件来设置特定于该单元格的交互。例如，您可以配置单元格的单击事件以在页面上显示另一个元件。

您还可以在交互和条件中定位单个表格单元格。例如，您可以使用设置文本操作更改单元格上的文本，并且您可以使用元件上的文本值选项判断单元格上的文本。

当您将鼠标悬停在“选择元件”下拉列表中的单元格名称上时，该单元格在画布上以黄色突出显示。以上面屏幕截图中的第 3 列单元格为例。

您还可以在交互和备注窗格中命名单个表格单元格，以便于查找。

限制和解决方法

图片

表格单元格不能包含图像，只能包含文本。要模拟一列图像，请在您的表格中创建一个空列并将图像元件放在其顶部。

合并单元格

无法合并表格元件的单元格。要呈现合并表格单元格的外观，请在要合并的单元格上方放置一个矩形元件。然后，将矩形上的文本设置为将占据合并单元格的文本。

交替行颜色

要显示交替的行颜色，请将每隔一行中的单元格的填充颜色更改为所需的颜色。

您可以使用表格元件侧面的灰色框来选择一行中的所有单元格，并且您可以按住CMD/CTRL并单击它们以多选行。

行的鼠标悬停样式

要为整个表格行提供鼠标悬停或鼠标悬停样式的外观，请在该行的顶部放置一个矩形小部件。给矩形一个半透明的填充，并给它一个鼠标悬停样式的效果。

动态添加、删除、排序和过滤行

无法在 Web 浏览器中动态添加、删除、排序或过滤表格行。代替的方案是以下两种：

• 使用动态面板模拟表格元件的动态变化。在动态面板的每个状态中，放置一个已经进行了预期更改的表格元件。当需要发生给定的更改时，显示其相应的动态面板状态。

• 如果您需要能够对表格进行真正的动态更改，请改用中继器元件。

—— 作者：Axure工坊，智新信息科技(广州)有限公司旗下的原创软件与互联网原型作品、素材、模板的共享交易平台，提供PC、APP、小程序、WEB等各端及电商、O2O、门户网、大数据等各行业的原型设计资源。

—— 官网：www.axured.cn

—— Axure交流群：681760590

—— 作品中心：原型作品及元件库下载