Как сохранить изображения в файл Excel и добавить их в приложениеHow to save images in an Excel file, and then add these images to your app

 

Технические условияPrerequisites

В этом руководстве вы выполните следующие действия.In this tutorial, we:

  • Создадите файл Excel и отформатируете его как таблицу.Create an Excel file and format it as a table
  • Создадите подключение к OneDrive для бизнеса.Create a connection to OneDrive for Business. Подойдет любая облачная учетная запись хранения.Any cloud storage account will work. В этом пошаговом руководстве используется OneDrive для бизнеса.In this walk-through, OneDrive for Business is used.
  • Создадите приложение с помощью элемента управления "Ввод с помощью пера".Create an app with a pen input control
  • Сохраните в файл Excel изображения, созданные с помощью элемента управления "Ввод с помощью пера".Save the images created from the pen input control to an Excel file
  • Отобразите в приложении изображения из файла Excel.Display images from an Excel file in your app

Создание таблицы в формате файла ExcelCreate the Excel file as a table

  1. Откройте пустой файл Excel и присвойте в нем столбцу имя Image [image].In a blank Excel file, name a column Image [image].
  2. Создайте таблицу, выполнив следующие действия:Create a table using the following steps:

    1. Выберите любой элемент данных в любой строке и любом столбце.Select any piece of data in any row and any column. Например, выберите изображение.For example, select Image.
    2. На ленте Вставка выберите элемент Таблица.On the Insert ribbon, select Table.
    3. В диалоговом окне выберите вариант Таблица с заголовками и выберите ОК.In the dialog window, select My table has headers, and select OK.

      Теперь файл Excel имеет формат таблицы.Your Excel file is now in a table format. Статья Форматирование таблицы Excel содержит дополнительные сведения о формате таблицы в Excel.Format the data as a table provides additional details on table formatting in Excel.

    4. Присвойте этой таблице имя Drawings:Name the table Drawings:

      Изменение имени таблицы на Drawings

  3. Присвойте файлу Excel имя SavePen.xlsx и сохраните файл в облачную учетную запись хранения (OneDrive для бизнеса, Dropbox и т. п).Name the Excel file SavePen.xlsx, and save the file to your cloud storage account (OneDrive for Business, Dropbox, and so on).

Создание приложения с элементом управления "Ввод с помощью пера"Create an app with the pen control

  1. В службе PowerApps создайте пустое приложение.In PowerApps, create a blank app.
  2. В этом приложении добавьте облачную учетную запись хранения в качестве источника данных.In your app, add the cloud storage account as a data source. Когда вы добавите источник данных, добавьте файл SavePen.xlsx в роли подключения, а затем выберите таблицу Drawings.Once added as a data source, add SavePen.xlsx as a connection, and then select the Drawings table:
    ПодключениеConnect

    Теперь таблица Drawings отображается как источник данных.Now, the Drawings table is listed as a Data source.

  3. В меню Вставка выберите Текст, а затем —элемент управления Ввод с помощью пера.On the Insert menu, select Text, and then select Pen input. Присвойте ему имя MyPen:Rename it MyPen:

    Переименовать

  4. Добавьте элемент управления Кнопка (через меню Вставка) и задайте в качестве значения свойства OnSelect следующую формулу:Add a Button control (Insert menu), and set its OnSelect property to the following formula:
    Patch(Drawings, Defaults(Drawings), {Image:MyPen.Image})
  5. Добавьте в приложение элемент управления Коллекция изображений (через меню Вставка > Коллекция) и назначьте его свойству Items значение Drawings.Add an Image gallery control (Insert menu > Gallery), and set its Items property to Drawings. Свойство Image для элемента управления "Коллекция" автоматически получает значение ThisItem.Image.The Image property of the gallery control is automatically set to ThisItem.Image.

    Окно должно выглядеть следующим образом:Your screen should look similar to the following:

    Пример экрана

  6. Нажмите клавишу F5 или выберите значок предварительного просмотра ().Press F5 or select Preview (). Нарисуйте что-нибудь в элементе управления MyPen, затем выберите кнопку.Draw something in MyPen, and the select the button. Теперь первое изображение в элементе управления "Коллекция" демонстрирует ваш новый рисунок.The first image in the gallery control displays what you drew. Дорисуйте еще что-нибудь и снова нажмите кнопку.Add something else to your drawing, and select the button. Теперь второе изображение в элементе управления "Коллекция" демонстрирует ваш новый рисунок.The second image in the gallery control displays what you drew.

    Закройте окно предварительного просмотра.Close the preview window.

  7. Перейдите к облачной учетной записи хранения.Go to your cloud storage account. Вы увидите автоматически созданную папку SavePen_images.There's a new SavePen_images folder that is automatically created. Возможно, потребуется обновить информацию, чтобы увидеть папку.You may need to refresh to see the new folder. Эта папка содержит сохраненные изображения с идентификаторами в качестве имен файлов.This folder contains your saved images with IDs for their file names.

    Откройте файл SavePen.xlsx.Open SavePen.xlsx. Столбец Image содержит путь к вашим новым изображениям.The Image column includes the path to these new images.

Добавление в приложение изображений из файла ExcelAdd the image in an Excel file to your app

В следующем примере вы сохраните изображения в облачную учетную запись хранения, а затем примените таблицу Excel для отображения изображений в приложении.In another example, you can save images in a cloud storage account, and then use an Excel table to display the images in your app.

Для этого примера нам понадобится файл CreateFirstApp.zip с несколькими изображениями в формате JPEG.In this example, we use the CreateFirstApp.zip that contains some .jpeg files.

Примечание. Если вы используете файл Excel для отображения изображений, путь к файлам должен содержать символы косой черты.NOTE When displaying images from an Excel file, the path to these images must use forward slashes. Когда PowerApps сохраняет изображения в таблице Excel (как в предыдущих шагах), путь к файлам содержит символы обратной косой черты.When PowerApps saves images to an Excel table (as with the previous steps), the path uses backslashes. Вы можете использовать в этом примере файлы SavePen_images из предыдущего примера.So, you can also use the SavePen_images from the previous example. Но для этого нужно изменить пути в таблице Excel, заменив все символы обратной косой черты обычной косой чертой.If you do, change the paths in the Excel table to use forward slashes instead of backslashes. В противном случае изображения не будут отображаться.Otherwise, the images will not display.

  1. Загрузите файл CreateFirstApp.zip и извлеките папку Assets в облачную учетную запись хранения.Download CreateFirstApp.zip, and extract the Assets folder to your cloud storage account.
  2. В электронной таблице Excel создайте таблицу, которая выглядит следующим образом:In an Excel spreadsheet, create a table that looks similar to the following:

    Таблица Jackets

  3. Присвойте этой таблице имя Jackets.Name the table Jackets. Присвойте файлу Excel имя Assets.xlsx.Name the Excel file Assets.xlsx. Также можно переименовать папку Assets, например в Assets_images.You can also rename the Assets folder to Assets_images.
  4. В приложении добавьте таблицу Jackets в качестве источника данных.In your app, add the Jackets table as a data source.
  5. Добавьте в приложение элемент управления Только изображение (через меню Вставка > Коллекция) и назначьте его свойству Items значение Jackets.Add an Image only control (Insert menu > Gallery), and set its Items property to Jackets:

    Свойство Items

    Коллекция автоматически заполнится изображениями.The gallery is automatically updated with the images:

    Изображения пиджаков

Когда вы присваиваете значение свойству Items, в таблицу Excel автоматически добавляется новый столбец с именем PowerAppsId.When you set the Items property, the Excel table is automatically updated with a new column named PowerAppsId.

В таблице Excel путь к изображению может содержать URL-адрес изображения.In the Excel table, the image path can also be the URL to an image. Загрузите пример файла Flooring Estimates в облачную учетную запись хранения, добавьте таблицу FlooringEstimates в качестве источника данных для приложения, а затем установите значение FlooringEstimates для элемента управления "Коллекция".Download the Flooring Estimates sample file to your cloud storage account, add the FlooringEstimates table as a data source in your app, and then set the gallery control to FlooringEstimates. Коллекция автоматически заполнится изображениями.The gallery is automatically updated with the images.

Дополнительные сведенияLearn more

Using multimedia files in PowerApps (Использование файлов мультимедиа в PowerApps)Add an image, a video, or a sound
Show data in a line, pie, or bar chart in your app (Отображение данных в виде графика, круговой или линейчатой диаграммы)Show data in a line, pie, or bar chart in your app
Understand tables and records in PowerApps (Общие сведения о таблицах и записях PowerApps)Understand tables and records in PowerApps