Power Apps 中的 按钮 控件

  • 项目

用户单击或点击后可与应用进行交互的控件。

描述

将 按钮 控件的 OnSelect 属性配置为，在用户单击或点击控件时运行一个或多个公式。

键属性

OnSelect – 当用户点击或单击控件时要执行的操作。

Text – 在控件上显示或用户键入到控件中的文本。

其他属性

Align – 文本相对于其控件的水平居中的位置。

AutoDisableOnSelect – 在 OnSelect 行为运行时自动禁用控件。

BorderColor – 控件边框的颜色。

BorderStyle – 控件边框是 Solid、Dashed、Dotted 还是 None。

BorderThickness – 控件边框的粗细。

Color – 控件中文本的颜色。

DisplayMode – 此控件是允许用户输入 (Edit)、仅显示数据 (View)，还是已禁用 (Disabled)。

DisabledBorderColor – 控件的 DisplayMode 属性设置为 Disabled 时，该控件边框的颜色。

DisabledColor – 控件的 DisplayMode 属性设置为 Disabled 时，该控件中的文本颜色。

DisabledFill – 控件的 DisplayMode 属性设置为 Disabled 时，该控件的背景色。

FocusedBorderColor – 当聚焦到控件时，控件的边框颜色。

FocusedBorderThickness – 当聚焦到控件时，控件的边框粗细。

Fill – 控件的背景色。

Font – 文本中所显示的字体系列的名称。

FontWeight – 控件中文本的粗细：Bold、Semibold、Normal 或 Lighter。

Height – 控件上边缘和下边缘之间的距离。

HoverBorderColor – 用户将鼠标指针停留在控件上时，该控件边框的颜色。

HoverColor – 用户将鼠标指针停留在控件上时，该控件中的文本颜色。

HoverFill – 用户将鼠标指针停留在控件上时，该控件的背景色。

Italic – 控件中的文本是否为斜体。

PaddingBottom – 控件中的文本与该控件下边缘之间的距离。

PaddingLeft – 控件中的文本与该控件左边缘之间的距离。

PaddingRight – 控件中的文本与该控件右边缘之间的距离。

PaddingTop – 控件中的文本与该控件上边缘之间的距离。

Pressed – 如果用户按下控件，值为 true，否则值为 false。

PressedBorderColor – 用户在点击或单击控件时，该控件边框的颜色。

PressedColor – 用户在点击或单击控件时，该控件中的文本的颜色。

PressedFill – 用户在点击或单击控件时，该控件的背景色。

RadiusBottomLeft – 控件左下角圆角的程度。

RadiusBottomRight – 控件右下角圆角的程度。

RadiusTopLeft – 控件左上角圆角的程度。

RadiusTopRight – 控件右上角圆角的程度。

Size – 控件上显示的文本的字号。

Strikethrough – 通过文本显示的线是否在控件上显示。

TabIndex – 相对于其他控件的键盘导航顺序。

Tooltip – 用户将鼠标悬停在控件上时显示的解释性文本。

Underline – 在文本下方显示的线是否在控件上显示。

VerticalAlign – 控件上的文本相对于该控件垂直居中的位置。

Visible – 控件显示还是隐藏。

Width – 控件左边缘和右边缘之间的距离。

X – 控件左边缘与其父容器（如果没有父容器，则为屏幕）左边缘之间的距离。

Y – 控件上边缘与其父容器（如果没有父容器，则为屏幕）上边缘之间的距离。

Navigate( ScreenName, ScreenTransitionValue )

示例

向按钮添加基本公式

  1. 添加 文本输入 控件，然后将其命名为 Source。

    不知道如何添加、命名和配置控件？

  2. 添加 按钮 控件，将**Text** 属性设置为“Add”，并将 OnSelect 属性设置为以下公式：
    UpdateContext({Total:Total + Value(Source.Text)})

    想要详细了解 UpdateContext 函数或其他函数吗？

  3. 添加**标签** 控件，在编辑栏中将其 Text 属性设置为 Value(Total)，然后按 F5。

  4. 清除源中的默认文本，键入数字，再单击或点击添加。

    此时，标签 控件显示所键入的数字。

  5. 清除源中的数字，键入另一个数字，再单击或点击添加。

    此时，标签 控件显示键入的两个数字之和。

  6. （可选）重复执行上述步骤一次或多次。

  7. 若要返回到默认工作区，请按 Esc 键（或单击或点击右上角的关闭图标）。

使用多个公式配置按钮

添加用于在两次输入间隔清除 文本输入 控件的公式。

  1. 将源的 HintText 属性设置为“Enter a number”。

  2. 将添加的 OnSelect 属性设置为以下公式：

    UpdateContext({Total:Total + Value(Source.Text)});
    UpdateContext({ClearInput: ""})

    备注

    请用分号“;”隔开多个公式。

  3. 将源的 Default 属性设置为 ClearInput。

  4. 按 F5，再通过同时添加多个数字来测试应用。

添加另一个总和重置按钮

添加另一个按钮，以便在两次计算间隔清除总和。

  1. 添加另一个 按钮 控件，将**Text** 属性设置为“Clear”，并将 OnSelect 属性设置为以下公式：

    UpdateContext({Total:0})

  2. 按 F5，将多个数字相加，再单击或点击Clear来重置总和。

更改按钮外观

更改按钮形状

默认情况下，Power Apps 创建具有圆角的矩形 按钮 控件。 可以设置 Height、Width 和 Radius 属性，对 按钮 控件的形状进行基本修改。

备注

“图标”和“形状”提供了各种设计，并可执行 按钮 控件执行的一些基本函数。 不过，图标和形状 没有 Text 属性。

  1. 添加 按钮 控件，并将 Height 和 Width 属性设置为 300，以生成大方形按钮。

  2. 修改 RadiusTopLeft、RadiusTopRight、RadiusBottomLeft 和 RadiusBottomRight 属性，以调整每个角的曲率。 下面的示例展示了一些不同形状的按钮，每种都在 300x300 方形按钮基础之上生成：

更改按钮的鼠标悬停颜色

默认情况下，当有鼠标悬停在 按钮 控件之上时，填充颜色会变暗 20%。 可以通过更改使用 ColorFade 函数的 HoverFill 属性来调整此行为。 如果将 ColorFade 公式设置为正百分比，当有鼠标悬停在按钮之上时，颜色会变浅；而如果将此公式设置为负百分比，则鼠标悬停颜色将会变深。

  • 更改所创建的一个按钮的 HoverFill 属性中的 ColorFade 百分比，并观察效果。

也可以将 按钮 的 HoverFill 属性设置为包含 ColorValue 函数（而不是 ColorFade 函数）的公式，从而指定 按钮 控件的颜色，如 ColorValue("Red") 所示。

备注

颜色值可以是任意 CSS 颜色定义（可以是名称，也可以是十六进制值）。

  • 在创建的一个按钮中，将 ColorFade 函数替换为 ColorValue 函数，并观察效果。

辅助功能准则

颜色对比度

屏幕阅读器支持

  • Text 必须存在。

键盘支持

备注

您能告诉我们您的文档语言首选项吗？ 进行简短调查。（请注意，此调查是英文版调查）

此调查大约需要七分钟。 不会收集个人数据（隐私声明）。