卡片控制項是編輯表單顯示表單控制項的建置組塊。 表單代表整個記錄,每個卡片則代表該記錄的單一欄位。

最簡單的卡片互動方式是在已於設計工作區中選取表單控制項時透過右窗格來進行。 在該窗格中,您可以選擇所要顯示的欄位、挑選每個欄位應該如何顯示,並重新排列欄位。

若要開始使用卡片,請參閱新增表單了解資料表單。 本主題的其餘部分會更加詳細地說明卡片的運作方式,以及要如何自訂或甚至是建立自己的卡片。

預先定義的卡片

PowerApps 針對字串、數字和其他資料類型提供了一組預先定義的卡片。 在右窗格中,您可以看到各種可用卡片,並變更欄位所使用的卡片︰

在此範例中,我們選取了單行文字卡片,但 URL 的文字長度超過單行可以顯示的範圍。 讓我們將此卡片變更為多行文字卡片,以便讓使用者有更多的空間來編輯︰

您也會發現,此資料來源有幾個欄位並未顯示。 選取眼睛圖示即可顯示和隱藏這些欄位︰

自訂卡片

卡片可構成其他控制項。 使用者可在標準的文字輸入控制項中輸入資料,而您是從 [插入] 索引標籤中新增此控制項的。

讓我們逐步瀏覽一些範例,以了解如何藉由處理控制項來變更卡片外觀。

  1. 首先,讓我們回到我們最近插入的卡片,找到 [SecurityCode] 欄位。 對此卡片按一下或點選一次,來加以選取︰

  2. 對輸入控制項本身按一下或加以點選,選取卡片內部的文字輸入控制項。

  3. 拖曳選取方塊以在卡片內移動這個控制項,並拖曳選取方塊邊緣的控點來調整控制項大小︰

    您可以對控制項調整大小、移動和進行其他修改,但無法在未先解除鎖定的狀況下刪除它。 下一節會說明如何將卡片解除鎖定。

  4. 將一或多個控制項插入卡片,例如從 [插入] 索引標籤上的 [圖形] 功能表插入這個星形︰

    這個新的控制項現在成為了卡片的一部分,並且如果您重新排列表單內的卡片 (舉例來說),此控制項將會跟著卡片移動。

另一個範例是,於影像控制項中顯示影像,而非在文字輸入控制項中顯示影像的 URL,如下圖所示

  1. 在 [插入] 索引標籤上,於 [ImageURL] 卡片底下新增影像控制項︰

  2. 在公式列中,將此控制項的 Image 屬性設定為 TextBox.Text,其中 TextBox 是保有 URL 之輸入文字控制項的名稱:

    提示︰按下 Alt 鍵可顯示每個控制項的名稱。

    現在,我們可以看到影像並編輯其 URL。 請注意,我們也可以使用 Parent.Default 作為 Image 屬性,但它不會在使用者輸入了新的 URL 時隨之更新。

  3. 我們可以在此應用程式的第二個畫面上執行相同的動作,亦即使用顯示表單控制項來顯示記錄的詳細資料。 在這裡,我們可能會想要隱藏標籤 (將文字方塊控制項 (而非卡片) 的 Visible 屬性設定為 false),因為使用者不會編輯該畫面上的 URL:

解除鎖定卡片

就像其他任何控制項一樣,卡片本身除了包含控制項外,也是具有屬性和公式的控制項。 當您選擇在表單上顯示某欄位時,右窗格會自動為您建立卡片,並產生所需的公式。 我們可以在可從 [檢視] 索引標籤中開啟的 [進階] 窗格中看到這些公式︰

我們會立即看到其中一個最重要的卡片屬性︰DataField 屬性。 這個屬性指出使用者會在此卡片中看到並可編輯資料來源的哪一個欄位。

在 [進階] 檢視中,頂端的大型橫幅會指出此卡片的屬性已遭鎖定。 DataFieldDefaultDisplayName 屬性旁邊也會出現鎖定圖示。 右窗格建立了這些公式,而鎖定可防止這些屬性遭到意外變更。

按一下或點選頂端橫幅可將卡片解除鎖定,以便您可以修改這些屬性︰

讓我們修改 DisplayName,將 AssetID 之間空一格。 透過進行這項變更,我們會改變系統為我們產生的屬性。 在右窗格中,這個卡片有了不同的標籤︰

現在我們已掌控這個卡片,因此可對它進一步修改以符合我們的需求。 但是,我們會再也無法像以前一樣將卡片從某種樣式變更為另一種樣式 (例如,從單行文字變更為多行文字)。 我們已將預先定義的卡片轉換為我們現在所控制的「自訂卡片」。

注意︰卡片一經解除鎖定,就無法重新鎖定。 若要回到鎖定狀態,請移除卡片,然後將它重新插入右窗格中。

與表單互動

在將卡片解除鎖定之後,您可以變更它與所在表單的互動方式。

以下有一些方針,指出控制項該如何使用其卡片,以及卡片該如何使用表單。 這些就只是方針而已。 和 PowerApps 中的任何控制項一樣,您也可以建立參考 PowerApps 中其他任何控制項的公式,卡片和卡片內的控制項也是如此。 發揮您的創意︰建立應用程式的方式不只一種。

DataField 屬性

卡片上最重要的屬性是 DataField 屬性。 這個屬性會驅動驗證、要更新什麼欄位,以及卡片的其他方面。

流入的資訊

作為容器,表單會讓 ThisItem 可供其內的所有卡片使用。 這個記錄包含目前相關記錄的所有欄位。

每個卡片的 Default 屬性都應該設定為 ThisItem.FieldName。 在某些情況下,您可能會想要在值傳入時加以轉換。 例如,您可能會想要將字串格式化,或將值從某一種語言轉譯為另一種語言。

卡片內的每個控制項都應該參考 Parent.Default 以得到該欄位的值。 這項策略可為卡片提供一層封裝,讓卡片的 Default 屬性可以變更,而不會變更卡片的內部公式。

依預設,系統會根據 DataField 屬性從資料來源的中繼資料取得 DefaultValueRequired 屬性。 您可以依照自己的邏輯來覆寫這些公式,使用 DataSourceInfo 函式來整合資料來源的中繼資料。

流出的資訊

使用者使用卡片中的控制項修改記錄後,SubmitForm 函式會將這些變更儲存至資料來源。 當該函式執行時,表單控制項會讀取每個卡片之 DataField 屬性的值,以了解要變更什麼欄位。

表單控制項也會讀取每個卡片之 Update 屬性的值。 這個值會儲存在此欄位的資料來源中。 您可以在這裡套用另一個轉換,或許是為了反轉對卡片的 Default 公式所套用的轉換。

系統會根據 DataField 屬性,從資料來源的中繼資料驅動 Valid 屬性。 此外,還會根據 Required 屬性以及 Update 屬性是否包含值。 如果 Update 屬性上的值無效,Error 屬性就會提供使用者容易了解的錯誤訊息。

如果卡片的 DataField 屬性「空白」,該卡片就只是控制項的容器。 當您提交表單時,其 ValidUpdate 屬性不會參與其中。

剖析範例

讓我們看看可構成基本資料輸入卡片的控制項。 控制項之間的空間已拉大,以便更清楚地顯示每個控制項︰

按住 Alt 鍵可顯示構成這個卡片之控制項的名稱︰

四個控制項讓這個卡片能夠運作︰

名稱 類型 說明
TextRequiredStar 標籤控制項 顯示星號,這通常用於資料輸入表單以指出該欄位必填。
TextFieldDisplayName 標籤控制項 顯示此欄位的使用者易記名稱。 此名稱可與資料來源結構描述中的名稱不同。
InputText 輸入文字控制項 顯示欄位的初始值,並允許使用者變更該值。
TextErrorMessage 標籤控制項 如果驗證發生問題,會向使用者顯示使用者容易了解的錯誤訊息。 另可確保欄位有值 (如果必須有值的話)。

若要在這些控制項中填入資料,您可以透過下列重要公式,從卡片的屬性中驅動其屬性。 請注意,這些公式皆未參考特定欄位。 相反地,所有資訊皆來自卡片。

控制項屬性 公式 說明
TextRequiredStar.Visible Parent.Required 欄位必填時才會出現星號。 必填是由您或資料來源的中繼資料所驅動的公式。
TextFieldDisplayName.Text Parent.DisplayName 文字方塊控制項會顯示使用者易記名稱,此名稱是由您或資料來源的中繼資料所提供,並設定於卡片的 DisplayName 屬性上。
InputText.Default Parent.Default 文字輸入控制項一開始會顯示來自資料來源的欄位值,而此值是由卡片的預設值所提供。
TextErrorMessage.Text Parent.Error 如果發生驗證問題,卡片的 Error 屬性會提供適當的錯誤訊息。

為了從這些控制項提取出資訊,並將它推送回資料來源,我們提供了下列重要公式︰

控制項名稱 公式 說明
DataCard.DataField "ApproverEmail" 使用者可以在此卡片中顯示和編輯之欄位的名稱。
DataCard.Update InputText.Text SubmitForm 執行時,要驗證並推送回資料來源的值。