將清單方塊、下拉式清單、下拉式方塊或選項按鈕新增至畫布應用程式

在畫布應用程式中顯示單欄資料 (例如從多欄表格),讓使用者可以選取清單中的一或多個項目。

  • 新增清單方塊以讓使用者選取一個以上的選項。
  • 新增下拉式清單方塊或下拉式方塊以減少占用的畫面空間。
  • 針對特定設計效果新增一組選項按鈕。

本主題重點擺在清單方塊與選項按鈕,但相同的原則也適用下拉式清單。

必要條件

  1. 建立空白畫布應用程式
  2. 了解如何新增及設定控制項

建立簡單的清單

  1. 新增名為 MyListBox清單方塊控制項,並將其 Items 屬性設定為此運算式:

    ["circle","triangle","rectangle"]

    您的設計工具外觀類似:

    具有清單方塊控制項的畫面

  2. 插入索引標籤上,選取圖示,選取圓形,然後將它移到 MyListBox 下方:

    新增圖示

  3. 新增三角形和矩形,然後在 MyListBox 下方將這些圖案排成一列:

    新增形狀

  4. 將下列形狀的 Visible 屬性設定為下列函數:

    形狀 將 Visible 函數設定為
    圓形 If("circle" in MyListBox.SelectedItems.Value, true)
    三角形 If("triangle" in MyListBox.SelectedItems.Value, true)
    矩形 If("rectangle" in MyListBox.SelectedItems.Value, true)
  5. 當按住 Alt 鍵時,在 MyListBox 中選取一或多個形狀。

    只有您選取的形狀才會顯示。

在這些步驟中,您使用運算式建立項目清單。 您可以將此套用到您的其他商務元素。 例如您可以使用下拉式選單控制項顯示產品圖像、產品描述等。

新增選項按鈕

  1. 首頁索引標籤上,選取新畫面,然後選取空白

  2. 插入索引標籤上,選取控制項,然後選取單選

    新增選項按鈕

  3. 單選控制項重新命名為 Choices,然後將其 Items 屬性設定為下列公式:
    ["red","green","blue"]

    重新命名控制項

    必要時請調整控制項大小以顯示所有選項。

  4. 插入索引標籤上,選取圖示,然後選取圓形。

  5. 將圓形的 Fill 屬性設定為下列函數:
    If(Choices.Selected.Value = "red", Red, Choices.Selected.Value = "green", Green, Choices.Selected.Value = "blue", Blue)

    在此公式中,圓形顏色會根據您選擇的選項按鈕變動。

  6. 將圓形移到單選控制項下方,如下列範例所示:

    將圓形移至單選控制項下方

  7. 當按住 Alt 鍵,選取不同的選項按鈕以變更圓形的色彩。

將項目新增至現有的清單

  1. 新增**按鈕** 控制項,並將它命名為「btnReset」。

    不知道如何新增、命名和設定控制項嗎?

  2. btnResetOnSelect 屬性設定為以下公式:

    ClearCollect(MyItems, {value: "circle"},{value: "triangle"},{value: "rectangle"})
    
  3. btnResetText 屬性設定為 "Reset"

  4. 新增名為 lbItems清單方塊控制項,並將其項目屬性設為 MyItems

  5. 按住 Alt 按鍵,並選取重置按鈕。

    注意

    清單方塊應填入「MyItems」集合中的項目。

  6. 排列清單方塊和按鈕,讓它們垂直排列。

    清單方塊按鈕。

  7. 新增 文字輸入 控制項,並將其命名為「txtAdd」。

  8. txtAdd文字 屬性設定為 ""

  9. 新增**按鈕** 控制項,並將它命名為「btnAdd」。

  10. btnAddText 屬性設定為 "Add"

  11. btnAddOnSelect 屬性設為以下公式:

    Collect(MyItems,{value: txtAdd.Text}); Reset(txtAdd)
    

    注意

    • 收集函數會將文字輸入中的文字新增為集合中的項目。
    • 重設功能會將文字輸入重新設定為預設狀態。
  12. 排列 txtAddbtnAdd,讓它們在 lbItemsbtnReset 下方居中排列。

    所有控制項 - 新增之前。

  13. 依按 F5 預覽應用程式。

  14. 將文字值新增至 txtAdd 文字輸入控制項。

  1. 按下新增按鈕。

    注意

    清單方塊應填入 MyItems 集合中的項目。

(選用) 從現有清單移除項目

  1. 新增**按鈕** 控制項,並將它命名為「btnDelete」。

  2. btnDeleteText 屬性設定為 "Delete"

  3. btnDeleteOnSelect 屬性設為以下公式:

    Remove(MyItems, lbItems.Selected)
    
  4. 排列 btnDelete,讓其在 btnReset 下方居中對齊

    帶有刪除按鈕的所有控制項。

  5. 依按 F5 預覽應用程式。

  6. 請按 [重設] 按鈕,重設清單方塊。

  7. 在清單方塊中按下某個項目以選取該項目。

  1. 按 [刪除] 按鈕來刪除項目。

注意

是否能請您告知您偏好的慣用文件語言? 請填寫問卷。 (請注意,本問卷為英文版)

完成問卷大約需要七分鐘。 本問卷將不會收集個人資料 (隱私權聲明)。