備註
- 本節說明包含低程式碼 UI 擴充功能的畫布元件。 專業開發人員也可以使用 Power Apps 元件架構 來建置程式碼元件。
- 畫布元件也可以在使用自訂頁面和元件庫的模型導向應用程式中使用。 其他資訊： 將畫布元件新增至模型導向應用程式中的自訂頁面
元件是畫布應用程式的可重複使用的建置區塊，讓應用程式製作者可以建立自訂控制項，以便在應用程式內使用，或使用 元件庫跨應用程式使用。 元件可以使用自訂屬性等進階功能，並啟用複雜的功能。 本文介紹了元件概念和一些範例。
元件在建置具有類似控制模式的大型應用程式時很有用。 如果您更新應用程式內的元件定義，應用程式中的所有執行個體都會反映您的變更。 元件也可消除複製/貼上控制項的需要，並改善效能，從而減少重複的工作。 當您使用 元件程式庫時，元件也有助於建立協同開發，並標準化組織中的外觀和風格。
觀看這段影片，瞭解如何在畫布應用程式中使用元件：
畫布應用程式中的元件
您可以從應用程式內建立元件，如本文所述，或在 元件程式庫內建立新元件。 元件程式庫應用於在多個應用程式畫面上使用元件的需求。 您也可以將現有元件複製到現有或新的元件資源庫中。
若要在應用程式內建立元件，請移至 [樹狀檢視]，選取 [ 元件] 索引標籤，然後選取 [新增元件]：
選取 新增元件 會開啟空白畫布。 您可以將控制項新增為畫布上元件定義的一部分。 如果您在畫布中編輯元件，其他應用程式畫面中的相同元件實例也會更新。 重複使用已建立元件的應用程式也可以在您發佈元件變更後接收元件更新。
選取畫面後，您可以從左窗格中的現有元件清單中選取元件。 當您選取元件時，您會將該元件的實例插入畫面，就像插入控制項一樣。
應用程式內可用的元件會列在樹狀檢視內元件清單中的 自訂 類別下。 從元件資源庫匯入的元件列在 「資源庫元件 」品類下：
備註
本文討論的元件與 Power Apps 元件架構不同，Power Apps 元件架構可讓開發人員和製作者為模型導向和畫布應用程式建立程式碼元件。 如需更多資訊，請前往 Power Apps component framework 總覽。
自訂屬性
如果您建立一或多個自訂內容，元件可以接收輸入值並發出資料。 這些場景是高級的，需要您了解 公式 和約束性合約。
備註
增強元件屬性的實驗性功能為屬性提供了更多選項，包括函數和行為函數。 如需詳細資訊，請參閱 Canvas 元件屬性 （實驗性）
輸入屬性 是元件接收要在元件中使用的資料的方式。 如果選取了元件實例，輸入屬性會出現在右側窗格的 「屬性」 標籤中。 您可以使用運算式或公式來設定輸入屬性，就像在其他控制項中設定標準屬性一樣。 其他控制項具有輸入屬性，例如 Text 輸入控制項的 Default 屬性。
Output 屬性 可用來發出資料或元件狀態。 例如，資源庫控制項上的 Selected 屬性是輸出屬性。 當您建立輸出屬性時，您可以決定哪些其他控制項可以參照元件狀態。
下列逐步解說會進一步說明這些概念。
建立範例元件
在此範例中，您將建立類似下圖的功能表元件。 您可以稍後更改文本以在多個屏幕、應用程序或兩者中使用它：
備註
我們建議您在建立元件以供重複使用時使用 元件庫 。 更新應用程式內的元件只會讓元件更新在應用程式內可用。 使用元件資源庫時，如果程式庫內的元件已更新並發佈，系統會提示您更新元件。
建立新元件
建立 空白畫布應用程式。
在 樹狀檢視中，選取 元件， 然後選取 新增元件 以建立新元件。
在左窗格中選取新元件，選取省略符號 （...），然後選取重新 命名。 輸入或貼上名稱為 MenuComponent。
在右側窗格中，將元件的寬度設定為 150 ，將高度設定為 250，然後選取 [新增自訂屬性]。 您也可以視需要將高度和寬度設定為任何其他值。
在 [顯示名稱]、[屬性名稱] 和 [描述] 方塊中，輸入或貼上文字作為 [項目]。
請勿在屬性名稱中包含空格，因為當您撰寫公式時，您會以此名稱來參照元件。 例如， ComponentName.PropertyName。
如果您選取元件，顯示名稱會顯示在右側窗格的 屬性 標籤上。 描述性顯示名稱可協助您和其他製作者瞭解此屬性的用途。 如果您將滑鼠停留在 [屬性] 索引標籤中此屬性的顯示名稱上，則 [描述] 會出現在工具提示中。
在 [資料類型] 清單中，選取 [資料表]，然後選取 [建立]。
Items 屬性會根據您指定的資料類型設定為預設值。 您可以將其設定為符合您需求的值。 如果您指定的資料類型為 [資料表 ] 或 [記錄]，您可能想要變更 [項目] 內容的值，以符合您要輸入至元件的資料綱目。 在此情況下，您會將其變更為字串清單。
如果您在右側窗格的 [屬性 ] 索引標籤上選取屬性的名稱，則可以在編輯列中設定屬性的值。
如下圖所示，您也可以在右側窗格的 [ 進階 ] 索引標籤上編輯屬性的值。
將元件的 Items 屬性設定為下列公式：
Table({Item:"SampleText"})
在元件中，插入空白的垂直 Gallery 控制項，然後在屬性窗格中選取 Layout 作為 Title。
請確定屬性清單會顯示 Items 屬性 （預設會如此）。 然後將該屬性的值設定為以下運算式：
MenuComponent.Items如此一來，資源庫控制項的 Items 屬性會讀取並相依於元件的 Items 輸入屬性。
選擇性 - 將 資源庫 控制項的 BorderThickness 屬性設定為 1 ，並將其 TemplateSize 屬性設定為 50。 您也可以視需要將邊框粗細和樣板大小的值更新為任何其他值。
將元件新增至畫面
接下來，您將元件新增至畫面，並指定元件要顯示的字串表格。
在左窗格中，選取畫面清單，然後選取預設畫面。
在 [插入] 索引標籤上，開啟 [元件] 功能表，然後選取 [功能表元件]。
依預設，新元件會命名為 MenuComponent_1 。
將 MenuComponent_1 的 Items 屬性設定為下列公式：
Table({Item:"Home"}, {Item:"Admin"}, {Item:"About"}, {Item:"Help"})此例證類似於此圖形，但您可以自訂每個例證的文字和其他內容。
建立和使用輸出屬性
到目前為止，您已經建立了一個元件並將其新增至應用程式。 接下來，您將建立輸出屬性，以反映使用者在功能表中選取的項目。
開啟元件清單，然後選取 MenuComponent。
在右側窗格中，選取 [屬性] 索引標籤，然後選取 [新增自訂屬性]。
在 [顯示名稱]、[屬性名稱] 和 [描述] 方塊中，輸入或貼上 [已選取]。
在 [屬性類型] 底下，選取 [輸出]，然後選取 [建立]。
在 進階 索引標籤上，將 Selected 屬性的值設定為此運算式，並視需要調整資源庫名稱中的數字：
Gallery1.Selected.Item
在應用程式的預設畫面上，新增標籤，並將其 Text 屬性設定為此運算式，視需要調整元件名稱中的數字：
MenuComponent_1.SelectedMenuComponent_1 是實例的預設名稱，而不是元件定義的名稱。 您可以重新命名任何執行個體。
按住 Alt 鍵的同時，選擇選單中的每個項目。
標籤控制項反映您最近選取的功能表項目。
Scope
輸入和輸出屬性會清楚定義元件與其主機應用程式之間的介面。 根據預設，元件是封裝的，以便更容易在不同的應用程式中重複使用，此過程需要利用屬性將資訊傳入和傳出元件。 範圍限制可讓元件的資料合約保持簡單且一致，並有助於啟用元件定義更新，尤其是在具有元件程式庫的應用程式之間。
但有時元件可能想要與其主機共用資料來源或變數。 特別是當元件僅用於一個特定應用程式時。 針對這些情況，您可以開啟元件屬性窗格中的 [ 存取應用程式範圍 ] 參數，直接存取應用程式層級資訊：
開啟 Access 應用程式範圍 時，可從元件內存取下列項目：
- 全域變數
- Collections
- 畫面上的控制項和元件，例如 TextInput 控制項
- 表格式資料來源，例如 Dataverse 資料表
當此設定關閉時，上述項目都不適用於元件。 Set 和 Collect 函式仍可供使用，但產生的變數和集合的範圍限定為元件執行個體，且不會與應用程式共用。
非表格式資料來源，例如 Azure Blob 儲存體或自訂連接器，無論此設定是開啟還是關閉，都可供使用。 將這些資料來源視為參考環境資源，而不是應用程式資源。 當元件從元件庫帶入應用程式時，也會從環境中帶入這些資料來源。
元件程式庫中的元件永遠無法存取應用程式範圍，因為沒有單一應用程式範圍可供參考。 因此，此設定在此內容中無法使用，而且實際上已關閉。 匯入應用程式之後，如果元件製作者允許自訂，則可以啟用切換，並修改元件以使用應用程式範圍。
備註
- 您可以將元件的實例插入元件資源庫內的畫面中，並預覽該畫面以進行測試。
- 使用 Power Apps Mobile 時，元件庫不會顯示。
匯出和匯入元件 (已取代)
備註
此功能已淘汰。 元件程式庫 是跨應用程式重複使用元件的建議方式。 使用元件程式庫時，應用程式會維護其使用的元件的相依性。 當出現相依元件的更新版內容時，應用程式決策者會收到警示。 因此，您應該在元件庫內改為建立所有全新可重複使用的元件。
預設情況下，匯入和匯出元件的功能處於停用狀態，因為此功能已淘汰。 雖然使用元件的建議方法是使用 元件程式庫，但您仍然可以針對每個應用程式啟用此功能，直到移除該功能為止。 若要這麼做，請在 Power Apps Studio 中 編輯您的應用程式 ，然後移至 設定 即將>推出的功能>已淘汰> 將 匯出和匯入元件 設定為 開啟。
啟用此功能之後，您可以使用下列功能來匯入和匯出元件。
從其他應用程式匯入元件
若要將一或多個元件從一個應用程式匯入另一個應用程式，請從 [插入] 功能表中選取 [匯入元件]，然後使用 [自訂] 下拉式功能表。 或者使用左窗格樹狀檢視中的 元件 。
對話方塊會列出包含您有權編輯之元件的所有應用程式。 選取應用程式，然後選取 匯入 以將該應用程式中所有元件的最新發佈版本匯入。 匯入至少一個元件之後，您可以編輯副本並刪除任何不需要的元件。
您可以將具有現有元件的應用程式儲存到本機檔案中，然後匯入檔案來重複使用該檔案。 您可以使用該檔案將元件匯入至另一個應用程式。
如果應用程式包含相同元件的修改版本，系統會提示您決定是否要取代修改版本或取消匯入。
在應用程式中建立元件之後，其他應用程式可以透過匯入元件來取用此應用程式中的元件。
備註
如果您從其他應用程式匯入的元件在原始應用程式中修改，您必須在取用應用程式中再次手動匯入元件，才能接收最新的元件變更。 請改用元件資源庫，以更有效率地處理 元件更新 。
從應用程式匯出元件
您可以將元件匯出至檔案，並下載以匯入至另一個應用程式。
從左窗格樹狀檢視中的 Components 區段選取 Export components 選項：
您也可以使用 插入 選單，然後選擇 自訂 下拉式選單。
選取匯出元件將元件下載至檔案：
下載的元件檔案會使用 .msapp 副檔名。
從匯出的元件檔案匯入元件
若要從匯出的元件檔案匯入元件，請從「插入」功能表中選取「匯入元件」，然後使用「自訂」下拉式功能表，或在左窗格的樹狀檢視中使用「元件」。 從元件對話方塊中，選取 上傳檔案 ， 而不是選取任何其他元件或應用程式：
從 [ 開啟 ] 對話方塊中，瀏覽至元件檔案的位置，然後選取 [ 開啟 ] 以匯入應用程式內的元件。
從匯出的應用程式匯入元件
您可以使用 「檔案>另存新檔」 選項在本機儲存應用程式：
儲存應用程式之後，您可以使用從檔案匯入元件的相同方法重複使用此應用程式的元件。 請遵循上一節中有關從匯出元件檔案匯入元件的步驟。
已知的限制
- 當您在應用程式中有相同元件的兩個或多個執行個體時，無法將自訂輸入屬性設定為相同或不同執行個體的自訂輸出屬性值。 此動作將導致循環參考警告訊息。 若要解決此限制，您可以在應用程式內建立元件的副本。
- 不支援在元件庫中新增和執行 Power Automate 流程。
- 您無法將包含來自這些資料來源 （例如表單、流體方格或資料表） 資料的資料來源或控制項與元件一起儲存。
- 您無法將元件插入資源庫或表單 （包括 SharePoint 表單） 。
- 元件不支援 UpdateContext 函式，但您可以使用 Set 函式在元件中建立和更新變數。 這些變數的範圍僅限於元件，但您可以透過自訂輸出屬性從元件外部存取它們。
後續步驟
瞭解如何使用 元件程式庫 來建立可重複使用元件的儲存庫。