Елемент керування "Кнопка" в Power Apps

Елемент керування, який користувач може натиснути, щоб взаємодіяти з програмою.

Опис

Настройте властивість OnSelect для елемента керування Кнопка, щоб виконувались одна або кілька формул, коли користувач натискає цей елемент керування.

Ключові властивості

OnSelect – дії, які виконуються, коли користувач натискає елемент керування.

Текст – текст, який відображається на елементі керування, або текст, який користувач вводить в елемент керування.

Додаткові властивості

Align  – розташування тексту відносно центра його елемента керування за горизонталлю.

AutoDisableOnSelect – автоматично вимикає елемент керування, коли виконується функція, призначена властивості OnSelect.

BorderColor  – колір межі елемента керування.

BorderStyle  – визначає стиль межі елемента керування: Суцільна, Штрихова, Пунктирна або Немає.

BorderThickness  – товщина межі елемента керування.

Color  – колір тексту в елементі керування.

DisplayMode  – визначає, чи елемент керування дозволяє ввід даних користувачем (Редагування), лише відображає дані (Перегляд) або ж є вимкнутим (Вимкнуто).

DisabledBorderColor  – колір межі елемента керування, якщо для властивості DisplayMode елемента керування встановлено значення Disabled (Вимкнуто).

DisabledColor  – колір тексту в елементі керування, якщо для властивості DisplayMode елемента керування встановлено значення Disabled.

DisabledFill  – колір фону елемента керування, якщо для властивості DisplayMode елемента керування встановлено значення Disabled.

FocusedBorderColor  – колір межі елемента керування, коли він перебуває у фокусі.

FocusedBorderThickness  – товщина межі елемента керування, коли він перебуває у фокусі.

Fill  – колір фону елемента керування.

Font  – ім’я сімейства шрифтів, що використовується для відображення тексту.

FontWeight  – стиль шрифту в елементі керування: Жирний, Напівжирний, Звичайний або Ненасичений.

Height  – відстань між верхнім і нижнім краями елемента керування.

HoverBorderColor  – колір межі елемента керування в разі наведення на нього курсору.

HoverColor  – колір тексту в елементі керування в разі наведення на нього курсору.

HoverFill  – колір фону елемента керування в разі наведення на нього курсору.

Italic  – виділення тексту в елементі керування курсивом.

PaddingBottom  – відстань між текстом в елементі керування та нижнім краєм цього елемента керування.

PaddingLeft  – відстань між текстом в елементі керування та лівим краєм цього елемента керування.

PaddingRight  – відстань між текстом в елементі керування та правим краєм цього елемента керування.

PaddingTop  – відстань між текстом в елементі керування та верхнім краєм цього елемента керування.

Натиснута – значення True під час натискання елемента керування й значення False у противному разі.

PressedBorderColor  – колір межі елемента керування, коли користувач його торкається або клацає.

PressedColor  – колір тексту в елементі керування, коли користувач його торкається або клацає.

PressedFill  – колір фону елемента керування, коли користувач його торкається або клацає.

RadiusBottomLeft – градус заокруглення нижнього лівого кута елемента керування.

RadiusBottomRight – градус заокруглення нижнього правого кута елемента керування.

RadiusTopLeft – градус заокруглення верхнього лівого кута елемента керування.

RadiusTopRight – градус заокруглення верхнього правого кута елемента керування.

Size  – розмір шрифту тексту, що відображається на елементі керування.

Strikethrough  – відображення лінії, що закреслює текст на елементі керування.

TabIndex  – порядок переходів за допомогою клавіатури відносно інших елементів керування.

Tooltip  – пояснювальний текст, що з’являється в разі наведення курсору на елемент керування.

Underline  – відображення лінії під текстом на елементі керування.

VerticalAlign – розташування тексту в елементі керування відносно центру цього елемента керування по вертикалі.

Visible  – відображення або приховання елемента керування.

Width  – відстань між лівим і правим краями елемента керування.

X  – відстань між лівим краєм елемента керування та лівим краєм його батьківського контейнера (екрана, якщо батьківський контейнер відсутній).

Y  – відстань між верхнім краєм елемента керування та верхнім краєм батьківського контейнера (екрана, якщо батьківський контейнер відсутній).

Пов’язані функції

Перейти( ScreenName, ScreenTransitionValue )

Приклади

Додавання основної формули до кнопки

1. Додайте елемент керування Text input й назвіть його Джерело.

   Не знаєте, як додати, іменувати та настроїти елемент керування?

2. Додайте елемент керування Кнопка, встановіть для його властивості Текст значення "Додати", а для властивості OnSelect укажіть таку формулу:
   UpdateContext({Total:Total + Value(Source.Text)})

   Хочете отримати додаткові відомості про функцію UpdateContext або інші функції?

3. Додайте елемент керування Підпис, задайте у рядку формул його властивість Text як Value(Total), а тоді натисніть F5.

4. Видаліть текст за замовчуванням у полі Джерело, введіть у ньому число й натисніть кнопку Додати.

   В елементі керування Label відображатиметься введене вами число.

5. Видаліть число в полі Джерело, введіть у ньому інше число й натисніть кнопку Додати.

   В елементі керування Label відображатиметься сума двох введених вами чисел.

6. (Необов’язково) Повторіть попередній крок один або кілька разів.

7. Щоб повернутися до робочої області за замовчуванням, натисніть клавішу Esc (або клацніть піктограму закриття в правому верхньому кутку).

Настроювання кнопки з кількома формулами

Додайте формулу, яка очищає елемент керування Введення тексту перед наступним записом.

1. Для властивості HintText поля Джерело встановіть значення "Ввести число".

2. Для властивості OnSelect кнопки Додати вкажіть цю формулу:

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

   Примітка

   Якщо ви вказуєте кілька формул, розділяйте їх крапкою з комою ";".

3. Для властивості За замовчуванням поля Джерело встановіть значення ClearInput.

4. Натисніть клавішу F5, а потім протестуйте програму, додавши кілька чисел.

Додавання іншої кнопки для скидання загальної суми

Додайте другу кнопку, щоб очистити загальну суму обчислень.

1. Додайте інший елемент керування Кнопка, встановіть для його властивості Текст значення "Очистити", а для властивості OnSelect укажіть таку формулу:

   UpdateContext({Total:0})

2. Натисніть клавішу F5, додайте кілька чисел, а потім натисніть кнопку Очистити, щоб скинути загальну суму.

Зміна вигляду кнопки

Зміна форми кнопки

За замовчуванням програма Power Apps створює елемент керування Кнопка у формі прямокутника із закругленими кутами. Можна внести базові зміни у форму елемента керування Кнопка, настроївши його властивості Висота, Ширина й Радіус.

1. Додайте елемент керування Кнопка та встановіть для його властивостей Висота й Ширина значення 300, щоб створити велику квадратну кнопку.

2. Змініть властивості RadiusTopLeft, RadiusTopRight, RadiusBottomLeft і RadiusBottomRight, щоб скоригувати ступінь кривини кожного кута. Нижче наведено кілька прикладів різних фігур, створених на основі квадратної кнопки 300 x 300.

   • Щоб створити коло, для всіх чотирьох значень властивості Радіус укажіть 150.
   • Щоб створити Кнопку у формі листка, для властивостей RadiusTopLeft і RadiusBottomRight укажіть значення 300.
   • Щоб створити кнопку у формі вкладки, для властивостей RadiusTopLeft і RadiusTopRight укажіть значення 300, а для властивостей RadiusBottomLeft і RadiusBottomRight – 100.

Зміна кольору кнопки під час наведення на неї курсора

За замовчуванням колір заливки елемента керування Кнопка буде тьмяніти на 20 %, якщо навести на нього курсор миші. Цю поведінку можна скорегувати, змінивши властивість HoverFill, яка використовує функцію ColorFade. Якщо для формули ColorFade встановити позитивне значення відсотка, то під час наведення курсора на кнопку колір ставатиме світлішим, а якщо встановити негативне значення, то колір ставатиме темнішим.

• Змініть відсоток ColorFade у властивості HoverFill однієї зі створених кнопок і подивіться на результат.

Можна також указати колір елемента керування Кнопка, указавши для його властивості HoverFill формулу, яка містить функцію ColorValue замість функції ColorFade, наприклад ColorValue("Red").

• Замініть функцію ColorFade на ColorValue в одній зі створених кнопок і подивіться на результат.

Рекомендації щодо спеціальних можливостей

Контрастність кольору

• Застосовуються стандартні вимоги до контрастності кольору.

Підтримка зчитування екрана

• Обов’язковою є властивість Текст.

Підтримка клавіатури

• Для властивості TabIndex має бути встановлено значення "нуль" або більше, щоб користувачі клавіатури могли перейти до неї.
• Індикатори фокусу мають бути чітко видимі. Для цього використовуйте FocusedBorderColor і FocusedBorderThickness.