使用原生 AppSheet 資料庫建構無程式碼應用程式

1. 事前準備

AppSheet 資料庫 (ASDB) 是 AppSheet 的第一方原生資料庫，用於整理及管理支援 AppSheet 應用程式的資料。相較於 Google 試算表、BigQuery 和 Cloud SQL 等其他常用的外部資料來源，新版介面的介面和效能大幅提升，讓應用程式建立者和使用者都能享有更優質的體驗。AppSheet 資料庫是所有 AppSheet 應用程式的預設資料選項。

課程內容

  • 如何使用範例資料建立新的 AppSheet 資料庫，或是從 Google 試算表匯入資料。
  • 如何在 AppSheet 資料庫編輯器中自訂資料。
  • 如何從 AppSheet 資料庫產生 AppSheet 應用程式。
  • 如何在 AppSheet 中修改資料庫並重新產生表格，以因應表格結構異動。

建構項目

本程式碼研究室將逐步說明如何產生及自訂新的 AppSheet 資料庫，首先使用 AppSheet 資料庫提供的預設資料，再從 Google 試算表中的現有資料開始。接著逐步說明如何運用 AppSheet 資料庫產生新的 AppSheet 應用程式。最後說明如何在資料庫編輯器中修改資料庫表格，然後在 AppSheet 應用程式編輯器中重新產生資料表。

軟硬體需求

2. 從頭開始建立及自訂新的 AppSheet 資料庫

首先，請使用預設的 AppSheet 資料庫，從頭開始建立並自訂新的資料庫。這讓您有機會對資料庫編輯器進行實驗，而不會破壞程式碼研究室中的任何後續步驟。

  1. 前往 AppSheet ( appsheet.com) 首頁，然後按一下「建立」>資料庫 >新增資料庫。

從頭開始建立新的資料庫

  1. 建立新的範例資料庫，並顯示 AppSheet 資料庫編輯器。

AppSheet 資料庫編輯器中的新範例資料庫圖片。

  1. 將資料庫名稱從「Untitled database」(未命名的資料庫) 變更為「Tasks DB」(工作資料庫)，即可自訂資料庫。(按兩下預設標題「未命名的資料庫」，即可編輯資料庫名稱)。
  2. 將「Table 1」表格的名稱變更為「Tasks」。(按兩下分頁即可進行編輯)。
  3. 將第一欄從「Title」變更為「Task」。
  4. 按一下左上角的「+」即可新增記錄。

這張圖片顯示如何點選左上角的「+」來新增記錄

  1. 按兩下「狀態」欄，查看「列舉類型」和「下拉式選單項目」類型的使用方式。

「狀態」的屬性編輯器。類型：「列舉」和項目類型：「下拉式選單」使用

  1. 選用：按一下 = 符號後方的按鈕，為每個下拉式選單選項上色。

使用顏色挑選器調整下拉式選單選項的顏色。

  1. 選擇性步驟：新增「狀態」列舉 (點選「新增選項」) 和新的顏色選項，進一步使用編輯器進行實驗。
  2. 選用步驟：使用「顏色」、「進度」、「是/否」和「電話」等不同的欄類型進行實驗，然後觀察欄行為的結果。

ASDB 中所有支援資料類型的內容選單。

您可以進一步使用資料庫編輯器進行實驗。在後續步驟中，您將建立新的資料庫。

3. 從 Google 試算表匯入檔案，藉此建立及自訂新的資料庫

如要瞭解如何從 Google 試算表匯入資料，請按照下列步驟操作。

使用試算表建立資料庫

  1. 首先，請複製這份公開的 Google 試算表，並將其重新命名為 ASDB: IO Codelab。

請注意，這個頁面有「Tasks」和「Owners」這兩個分頁。

  1. 和先前一樣，前往 AppSheet ( appsheet.com) 首頁，然後點按「建立」>資料庫 >從試算表匯入。

透過匯入試算表的方式建立資料庫

  1. 在 Google 雲端硬碟檔案選擇器中，選取試算表 ASDB: IO Codelab 的副本或命名的名稱。

系統就會根據工作表中的資料，產生新的 AppSheet 資料庫。

在資料庫編輯器中，透過試算表產生的 AppSheet 資料庫螢幕截圖。

新增 Tasks 資料表的參考資料

接著，從「工作」表格中新增「擁有者」表格的參照。

  1. 在 AppSheet 資料庫的「工作」表格中，按兩下「擁有者」欄，即可編輯設定。
  2. 將類型從「文字」變更為「參考資料」>參考資料。

選取參照類型

  1. 將「Table to reference」設為「Owners」，然後按一下「Save」。

設定「類型」的對話方塊：要參照的參考資料和表格：擁有者

  1. 變更資料欄類型時，系統會顯示警告訊息。在這個情況下，這一欄的資料與新的資料欄類型相容，因此點選「Yes」即可繼續操作。

變更欄類型「是」或「否」對話方塊。

  1. 接著，AppSheet 資料庫會嘗試將「擁有者」表格中的對應資料列與 Tasks 資料表中的名稱進行比對。由於這個資料集相符，AppSheet 資料庫應將正確的「Owners」資料列參照填入「Owner」資料欄。

ASDB 編輯器中的工作資料表，顯示正確的擁有者欄值。

  1. 如要測試參考檔案，請按一下「擁有者」儲存格，然後將儲存格更新為其他擁有者，例如 Sarah。

透過該參考資料提供的彈出式視窗選取其他擁有者。

選取完畢後，新的值 (「Sarah」) 就會出現在「Tasks」表格中的「擁有者」儲存格中。

選取不同擁有者後，擁有者的名稱就會出現在工作表格的「擁有者」欄中。

變更參照表格的「標籤」欄

您可以透過 AppSheet 資料庫為任何資料表選取標籤欄。這可讓您指定要在父項資料表中顯示的資料欄。這項設定也會控管已連結的 AppSheet 前端應用程式中顯示的父項表格內容。因此，您可以改為顯示「擁有者」表格中的「電子郵件」欄，而不是在「工作」表格中顯示「擁有者」表格中的「名稱」欄。

  1. 如要這樣做，請將滑鼠遊標懸停在「電子郵件」欄標題右側，然後按一下垂直刪節號，將「擁有者」表格中的「標籤欄」變更為「電子郵件」。

這張圖片顯示欄標頭右側的垂直刪節號。

這會叫用資料欄的內容選單。

資料欄的內容選單會顯示「使用資料欄做為標籤」已選取。

  1. 在內容選單中選取「使用資料欄做為標籤」，將資料欄標籤設為「電子郵件」欄。

電子郵件欄標題，標題左上角顯示「欄標籤」標記。

  1. 如想確認「電子郵件」欄已選為參照「工作」表格的資料欄標籤，請按一下「工作」表格分頁，您會發現「擁有者」欄現在顯示電子郵件地址。您可能需要重新整理瀏覽器，才會看到更新後的擁有者欄。

「工作」表格的「擁有者」欄顯示電子郵件地址，因為推薦擁有者表格的「電子郵件」欄已設為資料欄標籤。

4. 從 AppSheet 資料庫產生 AppSheet 應用程式

完成資料庫自訂作業後，您可以直接從資料庫產生 AppSheet 應用程式。如果需要自訂前端 UI，並需要新增自動化動作或安全性篩選器等項目，這項功能就能派上用場。請按照下列步驟操作：

  1. 按一下 ASDB 編輯器右側的「Apps」(應用程式)。

AppSheet 資料庫編輯器的螢幕截圖，當中顯示「應用程式」按鈕文字就會醒目顯示

這會叫用右側的內容選單，並產生新的應用程式。

與之前相同的螢幕截圖，但畫面上有顯示「New AppSheet app」的對話方塊按鈕。

  1. 按一下「新增 AppSheet 應用程式」，即可產生新的應用程式。

所產生 AppSheet 應用程式的螢幕截圖。

產生應用程式時，請注意應用程式會顯示警告：

Column "Owner" in Tasks_Schema has a reference to an unknown table or slice "Owners". Open the column definition to select a source table.

這是因為產生的應用程式只有「Tasks」資料表，而「擁有者」欄參照了未知的資料表「擁有者」。

如要解決這個問題，請在 AppSheet 應用程式中新增「擁有者」表格。

  1. 在 AppSheet 編輯器中的「Data」頁面中，按一下「+」。

含有「+」的資料頁面醒目顯示圖示。

  1. 在「Add data」內容選單中，選取「AppSheet Database」做為資料來源。

新增資料內容選單。

  1. 接著選取 ASDB: IO Codelab 資料庫 (或在先前步驟中為資料庫命名)。

選取資料庫選單選項。

  1. 在後續對話方塊中，勾選預設的「全選」核取方塊，然後按一下「新增至應用程式」。

用於選取要新增至 AppSheet 應用程式的「擁有者」表格對話方塊。

在應用程式中新增擁有者資料表後，就不會再顯示「Reference」錯誤。

AppSheet 應用程式螢幕截圖，沒有參考錯誤。

  1. 新的「擁有者」AppSheet 資料表已新增完成，您現在可以在 AppSheet 中按一下「Views」頁面，然後點選「主要導覽」旁的「+」，以建立新的檢視畫面。

「瀏覽次數」網頁，帶有「+」醒目顯示圖示。

  1. 在「新增資料檢視」對話方塊中，按一下「建立新資料檢視」

新增檢視畫面對話方塊。

  1. 建立新的檢視表時，請設定下列選項：

查看名稱：擁有者 (這項資料)：擁有者 資料檢視類型：簡報

查看「擁有者」檢視畫面的編輯頁面。

恭喜，應用程式現已完成！

  1. 如要測試工作和擁有者之間的參照，請在行動裝置預覽中點選「擁有者」檢視畫面或「工作」檢視畫面，然後選取記錄來查看相關 (參照) 的記錄。

AppSheet 應用程式的螢幕截圖，以方框特別標出行動裝置預覽畫面。

舉例來說，您可以點選「Owners」檢視畫面，然後按一下記錄，深入查看相關的 Task 記錄。

這張圖片顯示選取擁有者並細查即可查看相關工作。

5. 修改資料庫，並重新產生 Tasks 資料表

建立 AppSheet 資料庫並從其中產生新的應用程式後，請嘗試變更資料庫中的資料表。變更資料欄資料類型，並觀察已連結的 AppSheet 應用程式會發生什麼情況。

  1. 在資料庫的「Tasks」資料表中，將「Due Date」資料欄的類型變更為 Date and time >日期。

在 ASDB 編輯器中，將「工作」表格的「到期日」欄類型變更為「日期」。

請注意，返回 AppSheet 應用程式時，系統會偵測到資料庫已更新並顯示警告訊息：

App Schema for table 'Tasks' is out of sync with the schema in AppSheet database. Please regenerate the table structure

AppSheet 的編輯器偵測到資料庫中的結構定義變更並提供警告。

  1. 如要重新產生，請按一下右上角的「重新產生」圖示 d1a956498c05d75f.png。
  2. 這會觸發警告對話方塊：

重新產生警告對話方塊。

  1. 點按「再次生成」即可繼續操作。這樣會將應用程式中的「Due Date」資料欄類型更新為「Date」，並在工作記錄的「Edit」表單中啟用日期挑選器輸入元素。

顯示 DatePicker 輸入元素的 AppSheet 應用程式編輯表單。

6. 恭喜

您已完成 AppSheet 資料庫 (ASDB) 程式碼研究室！

其他資訊