組建畫布應用程式

發行項
11/19/2024

Power Apps 是適用於商務應用程式的高效率平台。您可以利用 Power Apps Studio 中空白畫布的強大功能來建立量身定制、像素完美的應用程式。若要與使用者共用，請在瀏覽器中呈現應用程式或嵌入到各種容器 (如 Teams 和 SharePoint 網站) 中。

SAP Procurement 範本解決方案的核心終端使用者體驗是使用畫布應用程式建立的，而且可以輕鬆擴充以支援您的當地業務需求。若要開始使用，請遵循本文中的模式和最佳做法。

遵循最佳做法和標準

所有應用程式都是使用已發行的最佳做法和標準來開發的。建議您在擴充或建立新應用程式時採用相同或類似的最佳做法和標準。

標準	意見	更多資訊
功能狀態	預設會打開或關閉的功能。包含部分預覽功能 (實驗功能除外)。	了解畫布應用中的實驗性、預覽版和停用功能
回應能力	回應單一裝置類型，例如平板電腦或行動裝置。允許應用程式貼齊各種標準畫面和容器大小，包括將應用程式嵌入 Microsoft Teams。廣泛使用自動配置回應式容器控制項。	構建回應式畫布應用
命名與編碼標準	遵循控制項、變數、集合及 Dataverse 命名標準，以提升搜尋和維護的簡易度。	Power Apps Canvas App 編碼標準和準則
網頁可及性	支援協助工具的屬性。例如，可存取標籤、角色、即時項目、焦點邊框粗細、色彩對比度和索引標籤順序。這些屬性可避免已知不支援協助工具需求的設計模式。	創建可訪問的畫布應用和畫布應用中的輔助功能限制
績效	遵循最佳做法以避免已知的效能限制。	提高畫布應用性能的提示和最佳實踐

全域應用程式色彩主題

所有應用程式都遵循自訂的主題，並可根據您組織的喜好色彩配置進行變更。 全域變數在所有應用程式的 App.OnStart 屬性中設定。此變數由應用程式中所有控制向中大多數與顏色相關的屬性使用。在同一個地方變更色彩全域主題變數，會在執行 App.OnStart 事件後立即對整個應用程式產生影響。

重要

雖然可以變更各種調色板屬性，但還是建議您只變更全域主題變數中的主要色彩屬性。

    Set(
        varThemeColors,
        {
            background: ColorValue("#FAF9F8"),
            backgroundFill: ColorValue("#FFFFFF"),
            backgroundFillDisabled: ColorValue("#F3F2F1"),
            text: ColorValue("#201F1E"),
            altText: ColorValue("#FFFFFF"),
            disabledText: ColorValue("#A19F9D"),
            primary: ColorValue("#0078D4"),
            secondary: ColorValue("#EFF6FC"),
            tertiary: ColorValue("#005A9E"),
            primaryGray: ColorValue("#8A8886"),
            secondaryGray: ColorValue ("#C8C6C4"),
            tertiaryGray: ColorValue("#605E5C"),
            requiredRed: ColorValue("#A80000"),
            lookupBlue: ColorValue("#0078D4")
        }
    )

新增您的公司標誌

先將公司標誌影像檔案上傳至應用程式，然後再將它新增至 ScreenHeader 元件，以將您的公司標誌新增至應用程式。

如需更多資訊：在畫布應用程式中使用多媒體檔案

當地語系化和全球應用程式支援

根據預設，所有畫布應用程式都支援英文語言。但是，所有應用程式都設計為當地語系化就緒，並且可加管理以支援更多語言。控制項寬度屬性可能需要根據所選部署語言直接變更。

字串當地語系化模式

在應用程式啟動期間的第一個畫面 OnVisible 屬性上，應用程式會讀取使用者的瀏覽器語言設定，並確定相應的 ISO 語言代碼選項值。

      Set(
        varISOUserLanguageCode,
        Switch(
            Left(
                Language(),
                2
            ),
            "ar",
            'ISO Language Code'.ar,
            "de",
            'ISO Language Code'.de,
            "en",
            'ISO Language Code'.en,
            "es",
            'ISO Language Code'.es,
            "fr",
            'ISO Language Code'.fr,
            "he",
            'ISO Language Code'.he,
            "it",
            'ISO Language Code'.it,
            "ja",
            'ISO Language Code'.ja,
            "pt",
            'ISO Language Code'.pt,
            "zh",
            'ISO Language Code'.zh,
            'ISO Language Code'.en
        )
    )

注意

標籤和輸入控制項屬性會嘗試預測當地語系化文字值的寬度，但考慮到該計算的複雜性，可能不一定會成功。因此，建議在當地語系化字串和變更後始終對應用程式進行測試和小幅編輯。

提示

向 SAP 基礎解決方案中包含的 ISO 語言代碼選擇元件新增更多值，即可新增和支援其他語言。

應用程式會針對已根據使用者的登入語言當地語系化的字串查詢 SAP 當地語系化 Dataverse 實體，並將它們快取在本機集合中。

        ClearCollect(
            colUserLocalizedStrings,
            Filter(
                'SAP Localizations',
                Language = varISOUserLanguageCode,
                'SAP Localizations (Views)'.'Active SAP Localizations'
            )
        )

各種控制項 (如 Text、HintText、Accessible Label、InputTextPlaceholder、NoSelectionText 和 ToolTips) 中所有與文字相關的屬性，都具有先尋找相當於當地語系化字串的公式。如果找不到相當的項目，則預設為英文，這是在 With 區塊中 Text 屬性中設定的。

  With(
      {Text: "Vendor name"},
      If(
          IsBlank(
              LookUp(
                  colUserLocalizedStrings,
                  'English Value' = Text
              ).'Localized Value'
          ),
          Text,
          LookUp(
              colUserLocalizedStrings,
              'English Value' = Text
          ).'Localized Value'
      )
  )

對於從 SAP 值清單表中篩選值的下拉式方塊控制向，使用者瀏覽器設定中對應的 ISO 語言代碼始終套用於篩選條件，如果沒有為其語言管理的值清單，則預設為英語。

Sort(
    Filter(
        'SAP List of Values',
        Status = 'Status (SAP List of Values)'.Active,
        Domain = 'Domain (SAP List of Values)'.Country,
        Language = varISOUserLanguageCode
    ),
    'Display Value'
)

瀏覽器地區設定

根據預設，畫布應用程式中的所有數字、日期和時間欄位預設會遵循使用者的瀏覽器地區設定。例如，使用美國作為其地區設定的使用者，日期顯示為 3/23/2023，對於使用德國地區設定的使用者戶，日期將顯示為 23.03.2023。

其他資訊：組建全域支援到畫布應用程式內

元件

元件是簡化應用程式開發和維護程序，並協助改善效能的絕佳方式。

對於需要在內部或跨應用程式提用一般使用者體驗的區域，會設定元件。考慮到元件庫在支援存取應用程式範圍和內嵌雲端流程等方面的限制，本機元件可以在所有應用程式中使用，然後可以匯入到其他應用程式。

例如，VendorSearch 元件用於支援採購到付款程序的所有應用程式，其主要在 SAP 廠商管理應用程式中組建，並匯入以在其他採購到付款應用程式中使用。

警告

使用本機應用程式元件而不是元件庫的負面後果是，如果確定變更，則需要在已經匯入該元件的所有應用程式中進行這些變更。

在整個應用程式中使用的一般元件：

組件	描述:
ScreenHeader	每個畫面上的通用標題
LeftNavigation	允許快速存取由功能表項目 Dataverse來源驅動的其他應用程式的主要瀏覽
CommandBar	建立、變更、儲存、取消、搜尋、最近搜尋或進階搜尋物件的一般控制項清單
ScreenTabs	將邏輯元件群組排列到索引標籤中以便於瀏覽
NoItemsDisplay	當沒有任何記錄時，項目會顯示在方格中
ObjectNameSearch	一般 SAP 物件搜尋元件會包含在適當的應用程式中，並視需要匯入至其他應用程式中。範例包括 VendorSearch、GLAccountSearch、MaterialSearch 和 RequisitionSearch

詳細資訊：畫布元件概觀

其他 SAP 欄位

每個 SAP 實施都是不同的，完全可以新增您自己的欄位來支援您的商務程序。因此，我們會實施充足的畫面空間和設計考慮，讓您輕鬆地新增所需的欄位。

一般控制項容器

大部分控制項都包含在由標籤和輸入控制項組成的容器中。例如，在 SAP Vendor Management 應用程式中擷取廠商名稱的欄位由 Label 和 Text Input 控制項組成，如以下螢幕擷取畫面所示。若要新增欄位，請複製現有的容器控制項，並將其貼到適當的回應元件中，更新名稱、文字與最終對應的欄位。

使用容器控制項。

注意

其他類型的輸入控制項 (如 Comboboxes、Date Pickers和 Buttons)，也有類似的容器。

回應式容器

這些應用程式的設計目的是要使用垂直和水準容器控制項來回應平板電腦/桌面裝置類型，如下方的螢幕擷取畫面所示。這些容器會設定成具有 height、width、LayoutMinHeight、LayoutMinWidth 和 Wrap 屬性的起始點。當您將其他欄位新增至這些容器時，請確定這些屬性也已更新，以繼續適當地處理回應。

使用回應式容器。

其他資訊：自動配置容器

連線其他資料

畫布應用程式的強大之處在於，它們可以輕鬆地使用其原生連接器庫，安全地連線至幾百個其他系統和應用程式。

例如，如果您的 SAP Procurement 訂購單程序需要 CRM 中已存在的上游售前商機資料來完成該程序，您可以使用 Salesforce 或 Dataverse 連接器與 Dynamics 365 整合，以便您只要選取一個按鈕，即可將這些資料輕鬆地新增至 SAP 訂購單應用程式。

此外，如果您有內部專屬系統或沒有原生連接器的系統，您可以與您的 IT 團隊合作建立一個自訂連接器，以允許 Power Apps 透過支援的 API 輕鬆與該系統互動。

其他資訊：

應用程式錯誤處理

根據預設，所有內嵌流程呼叫都會評估流程傳回的回覆狀態欄位，並透過 Notify 函數發出訊息來處理。若要深入了解，請參閱錯誤處理。

If(
    !IsBlank(FirstError.Message),
    Patch(
        'SAP Integration Errors',
        Defaults('SAP Integration Errors'),
        {
            Action: FirstError.Source,
            'Additional Information': App.ActiveScreen.Name,
            'Error Message': FirstError.Message,
            Name: "SAP Vendor Management",
            'Source Type': 'Source Type (SAP Integration Errors)'.'Power App',
            'Workflow Status': 'Workflow Status (SAP Integration Errors)'.Failed
        }
    );
Trace(FirstError.Message);
Error(FirstError);  
)

應用程式所產生的所有非預期例外狀況都是在 App.OnError 屬性中處理，在再次引發和追蹤錯誤之前，會先建立 SAP 解決方案範本錯誤記錄。管理員可以在適當的位置查看錯誤詳細資料，以便在應用程式未處理例外狀況時收到警報，如監視錯誤文件中所示。

其他資訊：OnError 屬性

後續步驟

擴展模型驅動應用和 Dataverse

另請參閱

開始使用 SAP Procurement 範本

共用方式為

組建畫布應用程式

遵循最佳做法和標準

全域應用程式色彩主題

新增您的公司標誌

當地語系化和全球應用程式支援

字串當地語系化模式

瀏覽器地區設定

元件

其他 SAP 欄位

一般控制項容器

回應式容器

連線其他資料

應用程式錯誤處理

後續步驟

另請參閱

意見反應

其他資源

共用方式為

組建畫布應用程式

遵循最佳做法和標準

全域應用程式色彩主題

新增您的公司標誌

當地語系化和全球應用程式支援

字串當地語系化模式

瀏覽器地區設定

元件

其他 SAP 欄位

一般控制項容器

回應式容器

連線其他資料

應用程式錯誤處理

相關內容

後續步驟

另請參閱

意見反應

其他資源