# 使用者可以按一下或點選以與應用程式互動的控制項。

說明

## 設定按鈕控制項的 OnSelect 屬性,以在使用者按一下或點選控制項時執行一個或多個公式。

主要屬性

##

OnSelect – 在使用者點選或按一下控制項時,應用程式的回應方式。

Text – 控制項上顯示的文字,或使用者在控制項中輸入的文字。

其他屬性

##

Align – 文字相對於其控制項水平中心的位置。

AutoDisableOnSelect – 在執行 OnSelect 行為時自動停用控制項。

BorderColor – 控制項框線的色彩。

BorderStyle – 決定控制項的框線為實線虛線點線

BorderThickness – 控制項框線的粗細。

FocusedBorderThickness – 控制項具有鍵盤焦點時的框線粗細。

Color – 控制項文字的色彩。

Disabled決定使用者能否與控制項互動。

DisabledBorderColor – 控制項的 Disabled 屬性設為 true 時,該控制項所呈現的框線色彩。

DisabledColor – 控制項的 Disabled 屬性設為 true 時,該控制項所呈現的文字色彩。

DisabledFill – 控制項的 Disabled 屬性設為 true 時,該控制項所呈現的背景色彩。

Fill – 控制項的背景色彩。

Font – 文字可使用的字型家族名稱。

FontWeight – 控制項的文字字型粗細︰BoldSemiboldNormalLighter

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

不知道如何[新增、命名和設定控制項](../add-configure-controls.md)嗎?
  1. 新增按鈕控制項,將其 Text 屬性設定為 "Add",然後將其 OnSelect 屬性設為以下公式:
    UpdateContext({Total:Total + Value(Source.Text)})

    想要了解 UpdateContext 函式或其他函式的詳細資訊嗎?

  2. 新增標籤控制項,將其 Text 屬性設定為 Total,然後按下 F5 鍵。

  3. 來源清除預設文字,在其中輸入數字,然後按一下或點選 [新增]。

    標籤控制項會顯示您所輸入的數字。

  4. 來源清除數字,在其中輸入其他數字,然後按一下或點選 [新增]。

    標籤控制項會顯示您所輸入兩個數字的總和。

  5. (選擇性) 重複上述步驟一或多次。

  6. 若要返回預設工作區,請按下 Esc 鍵 (或者按一下或點選右上角的關閉圖示)。

使用多個公式設定按鈕

### 新增公式,該公式會在項目之間清除文字輸入控制項。

  1. 來源HintText屬性設定為「輸入數字」。

  2. 新增OnSelect 屬性設為以下公式︰

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

    注意:以分號 ";" 分隔多個公式。

  3. 來源Default 屬性設定為 ClearInput

  4. 按下 F5 鍵,然後藉由將數個數字相加來測試應用程式。

新增另一個按鈕來重設總計

### 新增第二個按鈕來清除計算之間的總計。

  1. 新增另一個按鈕控制項、將其 Text 屬性設定為 "Clear",然後將其 OnSelect 屬性設為以下公式:

    UpdateContext({Total:0})

  2. 按下 F5 鍵,將數個數字相加,然後按一下或點選 [清除] 以重設總計。

變更按鈕的外觀

###

變更按鈕的圖形

####

根據預設,PowerApps 會建立具有圓角的矩形按鈕控制項。 您可以對按鈕控制項的圖形進行基本修改,方法是設定其 HeightWidthRadius 屬性。

注意:圖示和圖形提供各種不同的設計,而且可以執行一些與按鈕控制項相同的基本功能。 不過,圖示和圖形沒有 Text 屬性。

  1. 新增按鈕控制項,將其 HeightWidth 屬性設定為 300,以製作大型的方形按鈕。

  2. 修改 RadiusTopLeftRadiusTopRightRadiusBottomLeftRadiusBottomRight 屬性,以調整每個角的彎曲度。 以下是不同圖形的範例,每個按鈕是從 300 x 300 方形按鈕開始:

變更當您將滑鼠游標停留在按鈕上面時的色彩

#### 根據預設,按鈕控制項的填滿色彩會在您將滑鼠游標停留在上面時變暗 20%。 您可以藉由變更 HoverFill 屬性來調整此行為,該屬性使用 ColorFade 函式。 如果您將 ColorFade 公式設定為正數百分比,當您將滑鼠游標停留在按鈕上面時,色彩會變淡,而負數百分比則會讓色彩變濃。

  • 變更您建立之其中一個按鈕的 HoverFill 屬性中的 ColorFade 百分比,並且觀察效果。

您也可以指定按鈕控制項的色彩,方法是將其 HoverFill 屬性設定為包含 ColorValue 函式而非 ColorFade 函式的公式,如 ColorValue("Red") 所示。

注意:色彩值可以是任何 CSS 色彩定義,可能是一個名稱或十六進位值。 - 在您建立的其中一個按鈕中,將 ColorFade 函式取代為 ColorValue 函式,並且觀察效果。