Ovládacie prvky Tvar a Ikona v službe PowerAppsShape controls and Icon controls in PowerApps

Grafické prvky, pre ktoré môžete nakonfigurovať vlastnosti vzhľadu a správania.Graphics for which you can configure appearance and behavior properties.

PopisDescription

Tieto ovládacie prvky obsahujú šípky, geometrické tvary, ikony akcie a symboly, pre ktoré môžete nakonfigurovať vlastnosti, ako sú výplň, veľkosť a umiestnenie.These controls include arrows, geometric shapes, action icons, and symbols for which you can configure properties such as fill, size, and location. Môžete tiež nakonfigurovať ich vlastnosť OnSelect tak, aby aplikácia reagovala, ak používateľ vyberie ovládací prvok.You can also configure their OnSelect property so that the app responds if the user selects the control.

Vlastnosti kľúča (ikony a tvary)Key properties (icons and shapes)

Fill – farba pozadia ovládacieho prvku.Fill – The background color of a control.

OnSelect – spôsob, akým aplikácia reaguje, keď používateľ vyberie ovládací prvok.OnSelect – How the app responds when the user selects a control.

Vlastnosti kľúča (iba ikony)Key properties (icons only)

Ikona – typ ikony, ktorá sa má zobraziť (napríklad ArrowDown alebo ShoppingCart).Icon - The type of icon to display (for example, ArrowDown or ShoppingCart).

Rotácia – počet stupňov na otočenie ikony.Rotation - The number of degrees to rotate the icon.

Color – Farba ikony podľa názvu alebo hodnoty RGBA.Color - The color of the icon by name or RGBA values.

Ďalšie vlastnostiAdditional properties

AccessibleLabel – označenie pre čítačky obrazovky.AccessibleLabel – Label for screen readers.

DisplayMode – údaj o tom, či ovládací prvok umožňuje vstup používateľa (Edit), iba zobrazuje údaje (View) alebo je zakázaný (Disabled).DisplayMode – Whether the control allows user input (Edit), only displays data (View), or is disabled (Disabled).

FocusedBorderColor – farba orámovania zameraného ovládacieho prvku.FocusedBorderColor – The color of a control's border when the control is focused.

FocusedBorderThickness – hrúbka orámovania zameraného ovládacieho prvku.FocusedBorderThickness – The thickness of a control's border when the control is focused.

Height – vzdialenosť medzi horným a dolným okrajom ovládacieho prvku.Height – The distance between a control's top and bottom edges.

HoverFill – farba pozadia ovládacieho prvku pri umiestnení ukazovateľa myši na ovládací prvok.HoverFill – The background color of a control when the user keeps the mouse pointer on it.

PressedBorderColor – Farba orámovania ovládacieho prvku, keď používateľ vyberie tento ovládací prvok.PressedBorderColor – The color of a control's border when the user selects that control.

PressedFill – farba pozadia ovládacieho prvku, keď používateľ vyberie tento ovládací prvok.PressedFill – The background color of a control when the user selects that control.

TabIndex – príkaz na navigáciu pomocou klávesnice vo vzťahu k iným ovládacím prvkom.TabIndex – Keyboard-navigation order in relation to other controls.

Visible – možnosť zobrazenia alebo skrytia ovládacieho prvku.Visible – Whether a control appears or is hidden.

Width – vzdialenosť medzi ľavým a pravým okrajom ovládacieho prvku.Width – The distance between a control's left and right edges.

X – vzdialenosť medzi ľavým okrajom ovládacieho prvku a ľavým okrajom jeho nadradeného kontajnera (alebo obrazovky, ak sa nadradený kontajner nepoužíva).X – The distance between the left edge of a control and the left edge of its parent container (screen if no parent container).

Y – vzdialenosť medzi horným okrajom ovládacieho prvku a horným okrajom jeho nadradeného kontajnera (alebo obrazovky, ak sa nadriadený kontajner nepoužíva).Y – The distance between the top edge of a control and the top edge of the parent container (screen if no parent container).

Navigate( NázovObrazovky; ScreenTransition )Navigate( ScreenName; ScreenTransition )

PríkladExample

  1. Pomenujte predvolený ovládací prvok Obrazovka názvom Cieľ, pridajte ovládací prvok Označenie a nastavte jeho vlastnosť Text tak, aby zobrazovala názov Cieľ.Name the default Screen control Target, add a Label control, and set its Text property to show Target.

    Pozrite sa, ako pridať a nakonfigurovať ovládací prvok.Don't know how to add and configure a control?

  2. Pridajte ovládací prvok Obrazovka a pomenujte ho Zdroj.Add a Screen control, and name it Source.

  3. Do prvku Source pridajte ovládací prvok Tvar a jeho vlastnosť OnSelect nastavte na tento vzorec:In Source, add a Shape control, and set its OnSelect property to this formula:

Navigate(Target; ScreenTransition.Fade)

  1. Stlačte kláves F5 a potom vyberte ovládací prvok tvar .Press F5, and then select the Shape control.

    Spustí sa obrazovka Target.The Target screen appears.

  2. (voliteľné) Stlačením klávesu Esc sa vráťte do predvoleného pracovného priestoru, pridajte ovládací prvok Tvar do ovládacieho prvku Target a nastavte vlastnosť OnSelect ovládacieho prvku Tvar na tento vzorec:(optional) Press Esc to return to the default workspace, add a Shape control to Target, and set the OnSelect property of the Shape control to this formula:

Navigate(Source; ScreenTransition.Fade)

Pokyny na zjednodušenie ovládaniaAccessibility guidelines

Farebný kontrastColor contrast

Nasledujúce informácie sa vzťahujú len na grafické prvky, ktoré slúžia ako tlačidlá alebo nie sú určené len na dekoráciu.The following applies only to graphics that are used as buttons or are otherwise not just for decoration.

Ikony:For icons:

Tvary s orámovaním:For shapes with borders:

Tvary bez orámovania:For shapes without borders:

  • Fill a farba okolo ovládacieho prvkuFill and the color outside the control
  • PressedFill a farba okolo ovládacieho prvku (ak sa používa ako tlačidlo)PressedFill and the color outside the control (if used as a button)
  • HoverFill a farba okolo ovládacieho prvku (ak sa používa ako tlačidlo)HoverFill and the color outside the control (if used as a button)

Podpora čítačky obrazovkyScreen-reader support

  • Vlastnosť accessiblelabel sa musí nastaviť na neprázdny reťazec, ak sa grafický prvok používa ako tlačidlo alebo inak nie je len na dekoráciu.AccessibleLabel must be set to a non-empty string if the graphic is used as a button or is otherwise not just for decoration.

  • Vlastnosť accessiblelabel musí byť prázdny alebo prázdny reťazec " , ak grafický prvok poskytuje nadbytočné informácie alebo je čisto na dekoráciu.AccessibleLabel must be empty or the empty string "" if the graphic provides redundant information or is purely for decoration. Táto hodnota spôsobuje, že čítačky obrazovky ignorujú grafiku.This value causes screen readers to ignore the graphic.

Môžete napríklad nastaviť vlastnosť vlastnosť accessiblelabel ikony nastavenia na nastavenia.For example, you might set the AccessibleLabel property of a Settings icon to Settings. Táto ikona sa nepoužíva ako tlačidlo.This icon isn't used as a button. Nachádza sa vedľa označenia , ktoré tiež hovorí nastavenia.It's next to a Label that also says Settings. Čítačky obrazovky budú čítať ikonu aj označenie ako nastavenia, čo je zbytočne podrobné.Screen readers will read both the icon and the label as Settings, which is unnecessarily verbose. V tomto prípade ikona nepotrebuje vlastnosť accessiblelabel .In this case, the icon doesn't need an AccessibleLabel.

Dôležité

Čítačky obrazovky budú čítať ikonu alebo tvar ako tlačidlo , ak je jeho vlastnosť accessiblelabel nastavená na prázdny reťazec a jeho TabIndex je nastavená na nulu alebo viac.Screen readers will read an icon or shape as button if its AccessibleLabel is set to an empty string and its TabIndex is set to zero or greater. Tieto ikony alebo tvary sa vykreslia ako tlačidlá.Such icons or shapes are rendered as buttons.

Podpora klávesniceKeyboard support

  • Ak sa grafický prvok používa ako tlačidlo, TabIndex musí byť nula alebo väčší.TabIndex must be zero or greater if the graphic is used as a button. Ak nastavíte túto hodnotu pre ikonu alebo tvar, používatelia klávesnice môžu k nemu prejsť.If you set this value for an icon or shape, keyboard users can navigate to it.

  • Indikátory zamerania musia byť zreteľne viditeľné, ak sa grafický prvok používa ako tlačidlo.Focus indicators must be clearly visible if the graphic is used as a button. Na dosiahnutie tohto výsledku použite FocusedBorderColor a FocusedBorderThickness .Use FocusedBorderColor and FocusedBorderThickness to achieve this result.

    Poznámka

    Ak je vlastnosť TabIndex nastavená na nulu alebo väčšiu hodnotu, ikona alebo tvar sa vykreslí ako tlačidlo.When TabIndex is zero or greater, the icon or shape is rendered as a button. Jeho vzhľad sa nezmení, ale čítačky obrazovky správne identifikujú obrázok ako tlačidlo.Its appearance doesn't change, but screen readers will correctly identify the image as a button. Ak je vlastnosť TabIndex nastavená na menšiu hodnotu ako nula, ikona alebo tvar sa identifikuje ako obrázok.When TabIndex is less than zero, the icon or shape is identified as an image.