Power Apps 中的按钮控件

用户可以单击或点击的控件以与应用交互。

Description

配置 Button 控件的 OnSelect 属性,以在用户单击或点击控件时运行一个或多个公式。

键属性

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

文本 - 显示在控件上或用户键入控件的文本。

其他属性

对齐 - 文本相对于其控件的水平中心的位置。

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

BorderColor – 控件边框的颜色。

BorderStyle – 控件的边框是 SolidDashedDotted 还是 None

BorderThickness – 控件边框的粗细。

颜色 – 控件中的文本颜色。

ContentLanguage - 控件内容的语言(如果不同于控件的容器)。

DisplayMode – 控件是否允许用户输入(编辑)、仅显示数据(视图)或已禁用(已禁用)。

DisabledBorderColor – 如果控件的 DisplayMode 属性设置为 Disabled,则控件边框的颜色。

DisabledColor – 控件中的文本颜色(如果控件的 DisplayMode 属性设置为 Disabled)。

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

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

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

填充 – 控件的背景色。

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

FontWeight – 控件中文本的粗细: 粗体半曲普通较轻

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

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

HoverColor – 当用户将鼠标指针放在控件上时,控件中文本的颜色。

HoverFill – 当用户将鼠标指针放在控件上时,控件的背景色。

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

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

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

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

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

按下 – 在 按下控件时为 True ,否则 为 false

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

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

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

RadiusBottomLeft – 控件左下角舍入的程度。

RadiusBottomRight – 控件右下角舍入的程度。

RadiusTopLeft – 控件左上角舍入的程度。

RadiusTopRight – 控件右上角舍入的程度。

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

删除线 – 是否通过控件上显示的文本显示线条。

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

工具提示 – 当用户将鼠标悬停在控件上时出现的解释性文本。

下划线 – 是否在控件上显示的文本下显示一行。

VerticalAlign – 控件上与该控件的垂直中心相关的文本位置。

可见 – 控件是显示还是隐藏。

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

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

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

Navigate( ScreenNameScreenTransitionValue

例子

向按钮添加基本公式

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

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

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

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

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

  4. 清除 中的默认文本,在其中键入数字,然后单击或点击“ 添加”。

    “标签”控件显示键入的数字。

  5. 清除 中的数字,在其中键入另一个数字,然后单击或点击“ 添加”。

    “标签”控件显示键入的两个数字的总和。

  6. (可选)重复上一步或多次。

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

使用多个公式配置按钮

添加一个公式,用于清除条目之间的 文本输入 控件。

  1. SourceHintText 属性设置为“输入数字”。

  2. 设置添加到此公式的 OnSelect 属性:

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

    注释

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

  3. 的默认属性设置为 ClearInput

  4. F5,然后通过一起添加多个数字来测试应用。

添加另一个按钮以重置总计

添加第二个按钮以清除计算之间的总计。

  1. 添加另一个 Button 控件,将其 Text 属性设置为“Clear”,并将其 OnSelect 属性设置为以下公式:

    UpdateContext({Total:0})

  2. F5,一起添加多个数字,然后单击或点击“ 清除 ”重置总计。

更改按钮的外观

更改按钮的形状

默认情况下,Power Apps 会创建带有圆角的矩形 按钮 控件。 可以通过设置按钮控件的高度宽度Radius 属性来对按钮控件的形状进行基本修改。

注释

图标和形状 提供了各种各样的设计,并且可以执行 按钮 控件执行的一些相同的基本功能。 但是, 图标和形状 没有 Text 属性。

  1. 添加 按钮 控件,并将其 “高度 ”和 “宽度 ”属性设置为 300 以创建一个大方形按钮。

  2. 修改 RadiusTopLeft、RadiusTopRightRadiusBottomLeftRadiusBottomRight 属性,以调整每个角的曲率量。 下面是不同形状的一些示例,每个形状从 300 x 300 正方形按钮开始:

将鼠标悬停在按钮上方时更改按钮的颜色

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

  • 更改你创建的某个按钮的 HoverFill 属性中的 ColorFade 百分比,并观察效果。

还可以通过将 Button 控件的 HoverFill 属性设置为包含 ColorValue 函数而不是 ColorFade 函数的公式来指定按钮控件的颜色,如 ColorValue(“Red”)中所示。

注释

颜色值可以是任何 CSS 颜色定义,可以是名称或十六进制值。

  • ColorFade 函数替换为你创建的按钮之一中的 ColorValue 函数,并观察效果。

辅助功能指南

颜色对比度

屏幕阅读器支持

键盘支持