將圖像和簽名從 Power Apps 傳輸到 Power Automate

在本文中，我們將學習如何將圖像和簽名從 Power Apps 傳輸到 Microsoft Power Automate 平台。這做起來有點困難，因為 Power Apps 沒有默認方式來編輯圖像並將圖像上傳到 SharePoint。

我們將處理的示例是我以前使用過的費用應用程序。基本上，這是一個附加到 SharePoint 列表的庫。

如果我在這個畫廊中選擇任何東西，它基本上會在右側更新這個表格。

然後我可以在右邊的這個表格中進行編輯。

我們將轉到我們的 SharePoint 列表並添加一個名為Signature的圖像列。

讓我們轉到 Power Apps 並將該圖像列添加到此表單中。因此，我們將點擊編輯字段，然後點擊添加字段，然後從下拉字段中選擇簽名。

您會注意到我們可以添加它，但我們無法執行上傳圖片等操作。例如，如果我們點擊Edit，我們可以編輯除更新簽名圖像之外的所有內容。如果我們在 iPad 上執行此操作，那麼如果我們能夠在提交此記錄之前實際使用屏幕進行輸入或簽名，那就太好了，但不幸的是，我們不允許這樣做。

目錄

• 上傳圖像和創建簽名
• 創建 Microsoft Power Automate 平台流程
• 將 Power Apps 連接到 Microsoft Power Automate 平台
• 在 Microsoft Power Automate 平台中定義參數
• 為每個圖像創建一個變量
• 將 URI 代碼轉換為二進制代碼
• 結論

上傳圖像和創建簽名

Power Apps 沒有它的功能，但 Power Automate 可以拯救並幫助我們。所以這就是我們如何做到這一點。

首先，我們需要一種方法讓用戶實際提交圖像並繪製簽名。如果我們點擊 + 號，它會添加一個新的費用報告，如果我們點擊複選標記，我們會得到這個彈出框。

如果我們回去，什麼也不會發生。但是如果我們點擊Submit，費用報告就會通過。我們將為用戶添加上傳圖片和繪製簽名的功能。因此，讓我們轉到“媒體”，然後轉到“添加圖片”。這個控件基本上可以讓我們添加照片。

然後點擊Input然後點擊Pen input。這使我們能夠畫出我們的簽名。

讓我們把這個模型做大一點，這樣我們就有更多的空間來做這件事。

然後我們將在下面添加一些標籤，只是為了向大家展示我們在做什麼。

左側的標籤會顯示上傳收據，右側的標籤會顯示請簽名。

創建 Microsoft Power Automate 平台流程

接下來我們需要做的是創建一個Power Automate 流程，該流程基本上採用上傳收據控件和簽名控件，並將它們上傳到我們的 SharePoint 費用、收據和簽名文檔庫。同樣，無法直接在 Power Apps 中執行此操作，我們必須使用 Power Automate。

讓我們點擊New flow並選擇Instant cloud flow。

我們將選擇Power Apps作為觸發此流的方式，調用此UploadStuff，然後單擊創建。

我們將轉到我們的 SharePoint 連接器並選擇創建文件。

我們需要一個站點地址和一個文件夾路徑，在本例中稱為 /expensereceiptsandsignature。

對於文件的名稱，我們可能希望費用收據的名稱和簽名與費用收據的實際標題名稱相同。我們將向 Power Apps 詢問文件名和文件內容。

然後，我們將單擊“新建”步驟，然後再次執行相同的操作，因為我們需要一個用於實際費用收據照片的創建文件，以及另一個用於將要上傳的簽名的文件。只有文件內容會有所不同，我們需要在 Power Apps 中請求。

我們現在終於創建了我們的工作流程。

將 Power Apps 連接到 Microsoft Power Automate 平台

我們需要做的最後一件事是將 Power Apps 連接到 Power Automate。因此，如果我們添加新的費用並選中復選標記，我們將再次獲得該模型。

如果我們點擊提交按鈕，這個模型所做的就是提交表單並將可見性設置回 false。

我們必須返回主屏幕並激活此流程。但首先，我們將復制fx條上的內容並將其剪切，以便將其保存在我們的剪貼板中。然後我們將轉到Action，單擊Power Automate，然後選擇UploadStuff，這又是我們剛剛創建的Power Automate 工作流。然後，這會將工作流導入到我們的 Power Apps 中。

在 Microsoft Power Automate 平台中定義參數

我們需要定義一組在 Power Automate 中指定的參數。我們需要指定的第一個參數是我們想要調用它的實際文件名，在我們的例子中，它等於我們提交的費用報告的標題，它存儲在 DataCardValue1 中。

我們還需要我們正在上傳的收據的實際圖像，並粘貼我們之前擁有的所有其他命令。

現在這就是事情變得棘手的地方，不幸的是，我的意思是非常棘手。如果我們提交這個，應該發生的是UploadedImage1.Image和Pen.Input2.Image應該通過工作流，它們將創建文件內容。

但是，請注意UploadedImage1.Image實際上並不是指圖像本身。它指的是微軟為它知道在哪裡上傳圖像而製定的路徑。所以它並不是真正的圖像代碼本身；這是一條只有 Microsoft 可以訪問的隨機路徑。圖像將被保存，但它將是一些您無法理解的隨機文本文件。

所以我們需要使用這段代碼做一些調整：

為每個圖像創建一個變量

我們需要做的第一件事是為每個圖像創建一個變量。我們將創建一個名為varImage1的變量，它將等於上傳圖像的 JSON 表示形式。我們還想在 JSON 中包含二進制數據。

然後，我們將獲取存儲在varImage1中的此函數的輸出，並創建另一個名為varImageTrimmed的變量，該變量基本上獲取varImage1並使用 Mid 函數切掉它的末端。

我們正在獲取上傳的圖像並將其轉換為 URI——一段以文本形式存儲的代碼，代表圖像的實際內容。然後我們將其取出並刪除該文本的前兩個字符和最後兩個字符，因為它們是我們不需要的格式標識符。

然後，我們將對簽名執行相同的過程並將圖像替換為PenInput2並將其命名為varSig1。

將 URI 代碼轉換為二進制代碼

我們已經說過 Power Automate 不是通往圖像的隨機路徑；相反，它是圖像本身的 URI 代碼，基本上是該圖像的文本表示。我們不能只傳遞該文本圖像，因此我們需要將收到的代碼轉換為 SharePoint 可以讀取的二進制代碼。

所有文件都是二進制代碼，因此我們需要轉到Expression並使用將 URI 轉換為二進制的函數。我們會將此表達式放入此操作的文件內容元素中，然後單擊“保存”。

我們剩下要做的一件事是確保文件的名稱不同。我們希望第一個文件是圖像，第二個文件是簽名。所以我們可以用 _receipt.jpg 編輯第一個，用 _signature.jpg 編輯第二個。

讓我們嘗試一下，看看它是否有效。我們將從 400 美元的新 iPad 的新費用報告開始。

單擊複選標記後，我們可以添加圖片和簽名。

我們可以上傳我們的收據並添加我們的簽名。

然後我們可以點擊提交。為了確認，讓我們轉到我們的費用提交 SharePoint 列表以查看是否已創建該行項目。

除此之外，如果我們轉到費用收據和簽名，我們會看到新的 iPad 收據和新的 iPad 簽名，它們��與我們剛剛創建的費用報表的標題相對應。

這些是真實的圖像，我們實際上可以看到它們，而如果我們用老式的方式來做，這些將只是文本文件。

結論

想一想這是多麼強大。我們現在有辦法創建一個應用程序供人們拍照和簽名，並將它們放入 Microsoft Power Automate 平台工作流中。在這種情況下，我們使用它們將文件存儲在文檔庫中。我們今天學到的關鍵是如何將與圖像和簽名相關的數據從 Power Apps 移動到 Power Automate。

如果您喜歡本教程中涵蓋的內容，請不要忘記訂閱 LuckyTemplates 電視頻道​​。我和一系列內容創作者一直在發布大量內容，所有內容都致力於改進您使用 LuckyTemplates 和 Power Platform 的方式。

亨利