Добавление элемента управления "Рисунок" в Power AppsAdd picture control in Power Apps

Делает снимок или загружает изображения с локального устройства.Takes a photo or loads images from the local device.

ОписаниеDescription

С помощью этого элемента управления пользователи могут делать снимки или передавать файлы изображений со своих устройств, а также обновлять источник данных с применением этого содержимого.With this control users can take photos or upload image files from their device and update the data source with this content. На мобильном устройстве пользователя откроется диалоговое окно выбора устройства, в котором можно выбрать один из вариантов: сделать снимок или выбирать уже имеющийся.On a mobile device the user is presented with the device's choice dialog to choose between taking a photo or selecting one already available.

Этот элемент управления представляет собой сгруппированный элемент управления, содержащий два элемента управления: изображение и кнопка "добавить рисунок" .This control is a grouped control containing two controls: an Image and an Add picture button. Элемент управления Изображение отображает переданное изображение или заполнитель, если изображение не передавалось.The Image control shows the uploaded image or a placeholder if no image has been uploaded. Кнопка Добавить рисунок запрашивает изображение для отправки.The Add picture button prompts for an image to be uploaded.

Свойства изображения см. в разделе с рекомендациями по элементу управления "Изображение" .See the Image control reference for Image properties.

Свойства кнопки "добавить рисунок"Add picture button properties

AccessibleLabel — метка для средств чтения с экрана.AccessibleLabel – Label for screen readers. Должен описывать цель добавления изображения.Should describe the purpose of adding a picture.

Align  — расположение текста относительно центра элемента управления по горизонтали.Align – The location of text in relation to the horizontal center of its control.

BorderColor  — цвет границы элемента управления.BorderColor – The color of a control's border.

BorderStyle  — стиль границы элемента управления: Сплошная, Штриховая, Пунктирная или Отсутствует.BorderStyle – Whether a control's border is Solid, Dashed, Dotted, or None.

BorderThickness  — толщина границы элемента управления.BorderThickness – The thickness of a control's border.

ChangePictureText — текст, появляющийся на кнопке после передачи изображения.ChangePictureText – Text that appears on the button when an image has been uploaded.

Color  — цвет текста в элементе управления.Color – The color of text in a control.

DisabledBorderColor — цвет границы элемента управления, если для его свойства DisplayMode установлено значение Отключено.DisabledBorderColor – The color of a control's border if the control's DisplayMode property is set to Disabled.

DisabledColor — цвет текста в элементе управления, если для его свойства DisplayMode установлено значение Отключено.DisabledColor – The color of text in a control if its DisplayMode property is set to Disabled.

DisabledFill — цвет фона элемента управления, если для его свойства DisplayMode установлено значение Отключено.DisabledFill – The background color of a control if its DisplayMode property is set to Disabled.

DisplayMode — в зависимости от значения этого режима элемент управления разрешает пользователю вводить данные (Изменение), только отображает данные (Просмотр) или элемент вообще отключен (Отключено).DisplayMode – Whether the control allows user input (Edit), only displays data (View), or is disabled (Disabled).

Error — при наличии проблемы с передачей изображения это свойство будет содержать соответствующую строку ошибки.Error - If there is a problem uploading an image, this property will contain an appropriate error string.

Fill  — цвет фона элемента управления.Fill – The background color of a control.

FocusedBorderColor — цвет границы элемента управления при наведении фокуса.FocusedBorderColor – The color of a control's border when the control is focused.

FocusedBorderThickness — толщина границы элемента управления при наведении фокуса.FocusedBorderThickness – The thickness of a control's border when the control is focused.

Font  — имя семейства шрифтов, используемых для отображения текста.Font – The name of the family of fonts in which text appears.

FontWeight  — толщина текста в элементе управления: Жирный, Полужирный, Обычный или Очень тонкий.FontWeight – The weight of the text in a control: Bold, Semibold, Normal, or Lighter.

Height  — расстояние между верхним и нижним краем элемента управления.Height – The distance between a control's top and bottom edges.

HoverBorderColor  — цвет границы элемента управления при удерживании указателя мыши на нем.HoverBorderColor – The color of a control's border when the user keeps the mouse pointer on that control.

HoverColor  — цвет текста в элементе управления при удерживании указателя мыши на нем.HoverColor – The color of the text in a control when the user keeps the mouse pointer on it.

HoverFill  — цвет фона элемента управления при удерживании указателя мыши на нем.HoverFill – The background color of a control when the user keeps the mouse pointer on it.

Italic определяет, когда текст в элементе управления отображается курсивом.Italic – Whether the text in a control is italic.

Media — идентификатор клипа, воспроизводимого элементом управления "Звук" или "Видео".Media – An identifier for the clip that an audio or video control plays.

OnChange  — поведение приложения, когда пользователь изменяет значение элемента управления (например, перемещая ползунок).OnChange – How the app responds when the user changes the value of a control (for example, by adjusting a slider).

OnSelect  — поведение приложения, когда пользователь щелкает элемент управления или касается его.OnSelect – How the app responds when the user taps or clicks a control.

Padding  — расстояние между текстом кнопки "Импорт" или "Экспорт" и границами кнопки.Padding – The distance between the text on an import or export button and the edges of that button.

PressedBorderColor  — цвет границы элемента управления при щелчке или касании.PressedBorderColor – The color of a control's border when the user taps or clicks that control.

PressedColor  — цвет текста в элементе управления при щелчке или касании.PressedColor – The color of text in a control when the user taps or clicks that control.

PressedFill  — цвет фона элемента управления при щелчке или касании.PressedFill – The background color of a control when the user taps or clicks that control.

Reset  — определяет, возвращается ли элемент управления к значению по умолчанию.Reset – Whether a control reverts to its default value.

Size  — размер шрифта текста, отображаемого в элементе управления.Size – The font size of the text that appears on a control.

Strikethrough определяет, когда через текст, отображаемый в элементе управления, проходит линия.Strikethrough – Whether a line appears through the text that appears on a control.

TabIndex — порядок навигации с помощью клавиатуры относительно других элементов управления.TabIndex – Keyboard navigation order in relation to other controls.

Text — текст, появляющийся на кнопке, если изображение не было передано.Text – Text that appears on the button when an image has not been uploaded.

Tooltip — пояснительный текст, отображаемый при наведении указателя мыши на элемент управления.Tooltip – Explanatory text that appears when the user hovers over a control.

Underline определяет, когда под текстом, отображаемым в элементе управления, проходит линия.Underline – Whether a line appears under the text that appears on a control.

VerticalAlign  — расположение текста в элементе управления относительно центра этого элемента управления по вертикали.VerticalAlign – The location of text on a control in relation to the vertical center of that control.

Visible определяет, отображается ли элемент управления или он скрыт.Visible – Whether a control appears or is hidden.

Width  — расстояние между левым и правым краем элемента управления.Width – The distance between a control's left and right edges.

X  — расстояние между левым краем элемента управления и левым краем его родительского контейнера (или экрана, если родительского контейнера нет).X – The distance between the left edge of a control and the left edge of its parent container (screen if no parent container).

Y  — расстояние между верхним краем элемента управления и верхним краем его родительского контейнера (или экрана, если родительского контейнера нет).Y – The distance between the top edge of a control and the top edge of the parent container (screen if no parent container).

Patch( DataSource;; BaseRecord;; ChangeRecord )Patch( DataSource; BaseRecord; ChangeRecord )

ПримерыExamples

  1. Добавьте элемент управления Добавить изображение и щелкните его три раза.Add an Add picture control, and then triple-click it.

    Не знаете, как добавить, назвать и настроить элемент управления?Don't know how to add, name, and configure a control?

  2. В диалоговом окне Открыть выберите файл изображения и нажмите Открыть.In the Open dialog box, click or tap an image file, and then click or tap Open.

  3. Добавьте элемент управления Кнопка , переместите его под элемент управления Добавить изображение и укажите для свойства OnSelect элемента Кнопка следующую формулу:Add a Button control, move it under the Add picture control, and set the OnSelect property for the Button control to this formula:
    Collect(MyPix; AddMediaButton1.Media)Collect(MyPix; AddMediaButton1.Media)

    Нужны дополнительные сведения о функции Collect или других функциях?Want more information about the Collect function or other functions?

  4. Добавьте вертикальный элемент управления "Коллекция" и задайте для его свойства Items значение мипикс.Add a Vertical gallery control, and set its Items property to MyPix.

  5. Выберите элемент управления изображение в коллекции и задайте для его свойства Image значение сиситем. Value.Select the Image control in the gallery and set it's Image property to ThisItem.Value.

  6. Нажмите клавишу F5 и выберите элемент управления Кнопка .Press F5, and then click or tap the Button control.

    Изображение из элемента управления Добавление рисунка отображается в вертикальном элементе управления аллери.The image from the Add picture control appears in the Vertical allery control. Если изображение не имеет тех же пропорций, что и элемент управления изображением в вертикальном элементе управления "Коллекция", задайте для свойства Имажепоситион элемента управления изображение значение вписать.If your image doesn't have the same aspect ratio as the Image control in the Vertical gallery control, set the ImagePosition property of the Image control to Fit.

  7. Нажмите элемент управления Добавить изображение, выберите другой файл изображения, нажмите Открыть, а затем нажмите добавленный вами элемент управления Кнопка .Click or tap the Add picture control, click or tap another image file, click or tap Open, and then click or tap the Button control that you added.

    В элементе управления Коллекция изображений появляется второе изображение.The second image appears in the Image gallery control.

  8. (Необязательно) Повторите предыдущее действие один и несколько раз, а затем нажмите клавишу ESC, чтобы вернуться в рабочую область по умолчанию.(optional) Repeat the previous step one or more times, and then return to the default workspace by pressing Esc.

Для сохранения изображений на локальном устройстве используйте функцию SaveData , а для обновления источника данных — функцию Patch .Use the SaveData function to save the images locally or the Patch function to update a data source.

Руководство по настройке специальных возможностейAccessibility guidelines

Применяются те же рекомендации, что и для кнопки и изображения .The same guidelines for Button and Image apply. Кроме того, рассмотрим следующее.In addition, consider the following:

КонтрастностьColor contrast

  • Кнопка "добавить рисунок" должна иметь достаточную контрастность между текстом и фоном.Add picture button must have adequate contrast between its text and background. Так как загруженное изображение может иметь различные цвета, используйте непрозрачную заливку кнопки Добавить рисунок , чтобы обеспечить единообразие контраста.Since the uploaded image may have varying colors, use an opaque Fill on the Add picture button to ensure consistent contrast.

Поддержка средства чтения с экранаScreen reader support

  • Кнопка Добавить рисунок должна содержать текст и чанжепиктуретекст , предлагающие пользователю добавить или изменить изображение.Add picture button must have Text and ChangePictureText that prompts the user to add or change a picture.

Поддержка клавиатурыKeyboard support

  • Кнопка "добавить рисунок" должна иметь значение TabIndex , равное нулю или больше, чтобы пользователи могли переходить к ней.Add picture button must have TabIndex of zero or greater so that keyboard users can navigate to it.
  • Кнопка Добавить рисунок должна иметь четко видимые индикаторы фокуса.Add picture button must have clearly visible focus indicators. Для этого используйте элементы FocusedBorderColor и FocusedBorderThickness .Use FocusedBorderColor and FocusedBorderThickness to achieve this.