身為行動裝置應用程式開發人員,您最常面臨的案例之一,是要讓使用者在連線能力有限或完全無法連線時仍有生產力。 PowerApps 有一組功能和行為,幫助您開發可離線執行的應用程式。 您可以:

  • 在離線時啟動 PowerApps 行動應用程式。
  • 在離線時執行您開發的應用程式。
  • 使用 Connection 訊號物件判斷應用程式為離線、連線或付費連線。
  • 在離線時使用 collections並運用函式 (如LoadData 和 SaveData) 執行基本的資料儲存。

如何建置可離線執行的應用程式

在離線案例中,首先要考慮是您的應用程式如何處理資料。 PowerApps 中的應用程式主要是透過平台提供的一組連接器來存取資料,例如 SharePoint、Office 365、Common Data Service。 您也可以建置自訂連接器,讓應用程式能夠存取任何有提供 RESTful 端點的服務。 這可以是 Web API 或服務,例如 Azure Functions。 這些連接器皆在網際網路上使用 HTTPS,這表示您的使用者必須在線上才能存取資料和服務提供的任何其他功能。

PowerApps 應用程式與連接器

處理離線資料

PowerApps 最有趣的層面之一,是它的功能和公式可讓您以一致的方式篩選、搜尋、排序、彙總、操作資料,不論資料來源是什麼。 從應用程式中的記憶體內集合,到 SharePoint 清單、SQL 資料庫、Common Data Service,來源範圍極廣。 這種一致性可讓您輕鬆地將應用程式重定目標為使用不同的後端。 在這裡更重要的是,它也可以讓您進行本機集合的資料管理,幾乎不必變更應用程式的邏輯。 事實上,本機集合是處理離線資料的主要機制。

建置離線的 Twitter 應用程式

為了將重點放在應用程式開發的離線上面,我們將示範一個以 Twitter 為焦點的簡單案例。 我們將建置一個應用程式,可讓您在離線狀態讀取 Twitter 文章及提交推文。 當應用程式上線時,應用程式就會張貼推文,並重新載入本機上的資料。

概括而言,應用程式會執行下列動作︰

  1. 在應用程式啟動時 (根據第一個畫面的 OnVisible 屬性):

    • 如果裝置在線上,我們會存取 Twitter 連接器直接擷取資料,並將這些資料填入集合。
    • 如果裝置為離線,我們使用 LoadData 從本機快取檔案載入資料。
    • 我們讓使用者能夠提交推文 - 如果在線上,我們會直接張貼至 Twitter,並重新整理本機快取。
  2. 如果上線,每隔 5 分鐘會︰

    • 張貼我們在本機快取中的任何推文。
    • 重新整理本機快取,並使用 SaveData 加以儲存。

步驟 1︰建立新的手機應用程式

  1. 開啟 PowerApps Studio。
  2. 按一下或點選 [新增] > [空白應用程式] > [手機配置]。

    空白應用程式,手機配置

步驟 2︰新增 Twitter 連線

  1. 按一下或點選 [內容] > [資料來源],然後選擇 [資料來源] 面板上的 [新增資料來源]。
  2. 按一下或點選 [新增連線],選取 [Twitter],然後按一下或點選 [建立]。
  3. 輸入您的認證,並建立連線。

    新增 Twitter 連線

步驟 3︰在應用程式啟動時載入 LocalTweets 集合中的推文

選取應用程式中 Screen1OnVisible 屬性,並複製下列公式︰

If(Connection.Connected,

    ClearCollect(LocalTweets, Twitter.SearchTweet("PowerApps", {maxResults: 100}));

    UpdateContext({statusText: "Online data"})

    ,

    LoadData(LocalTweets, "Tweets", true);

    UpdateContext({statusText: "Local data"})

);

LoadData(LocalTweetsToPost, "LocalTweets", true);

SaveData(LocalTweets, "Tweets")

用於載入推文的公式

此公式會檢查裝置是否連線︰

  • 如果裝置在線上,它會將最多 100 則具有搜尋詞彙 "PowerApps" 的推文載入 LocalTweets 集合。
  • 如果裝置離線,它會從 "Tweets" 檔案載入本機快取 (如果可使用此檔案)。

步驟 4︰新增資源庫,並將它繫結至 LocalTweets 集合

  1. 插入新的彈性高度資源庫︰[插入] > [資源庫] > [空白彈性高度]。
  2. Items 屬性設為 LocalTweets
  3. 新增四個標籤控制項,來顯示每則推文的資料,並將 Text 屬性設為︰
    • ThisItem.TweetText
    • ThisItem.UserDetails.FullName &"@"& ThisItem.UserDetails.UserName
    • "RT: " & ThisItem.RetweetCount
    • Text(DateTimeValue(ThisItem.CreatedAtIso), DateTimeFormat.ShortDateTime)
  4. 新增影像控制項,並將 Image 屬性設為 ThisItem.UserDetails.ProfileImageUrl

步驟 5︰新增連線狀態標籤

插入新的標籤控制項,並將其 Text 屬性設定為下列公式:

If (Connection.Connected, "Connected", "Offline")

此公式會檢查裝置是否連線。 如果是,標籤的文字就是「連線」,否則就是「離線」。

步驟 6︰新增撰寫新推文的文字輸入

  1. 插入新的文字輸入控制項,命名為 "NewTweetTextInput"。
  2. 將文字輸入的 Reset 屬性設為 resetNewTweet

步驟 7︰新增張貼推文的按鈕

  1. 新增按鈕控制項,將其 Tex 屬性設為 "Tweet"。
  2. OnSelect 屬性設定為下列公式:

    If (Connection.Connected,
    
        Twitter.Tweet("", {tweetText: NewTweetTextInput.Text}),
    
        Collect(LocalTweetsToPost, {tweetText: NewTweetTextInput.Text});
    
        SaveData(LocalTweetsToPost, "LocalTweetsToPost")
    
    );
    
    UpdateContext({resetNewTweet: true});
    
    UpdateContext({resetNewTweet: false})
    

此公式會檢查裝置是否連線︰

  • 如果裝置在線上,會立即將文字推文。
  • 如果裝置為離線,會擷取 LocalTweetsToPost 集合中的推文,並將它儲存至應用程式。

然後此公式會重設文字方塊中的文字。

步驟 8︰新增計時器每隔五分鐘檢查推文

新增計時器控制項︰

  • Duration 屬性設為 300000。
  • AutoStart 屬性設為 true。
  • OnTimerEnd 屬性設定為下列公式:

    If(Connection.Connected,
    
        ForAll(LocalTweetsToPost, Twitter.Tweet("", {tweetText: tweetText}));
    
        Clear(LocalTweetsToPost);
    
        Collect(LocalTweetsToPost, {tweetText: NewTweetTextInput.Text});
    
        SaveData(LocalTweetsToPost, "LocalTweetsToPost");
    
        UpdateContext({statusText: "Online data"})
    )
    

此公式會檢查裝置是否連線。 如果是,應用程式會推文 LocalTweetsToPost 集合中的所有項目, 然後清除集合。

現在,應用程式已完成,在我們繼續進行測試之前,先看看出它的外觀。 左邊的應用程式已連線;右邊的為離線,且有一個推文,等再次上線時要張貼。

完成的應用程式線上或離線模式

測試應用程式

使用下列步驟測試應用程式︰

  1. 連線後在行動裝置上執行 PowerApps。

    您必須至少在連線狀態下執行應用程式一次,才可以將應用程式下載到裝置。

  2. 啟動 Twitter 應用程式。

  3. 請注意,推文已載入,且顯示狀態為連線

  4. 完全關閉 PowerApps。

  5. 將裝置設為飛航模式以確保它已離線。

  6. 執行 PowerApps。

    您現在可以離線執行此 Twitter 應用程式,並可存取任何之前上線時在此裝置執行過的應用程式 (也就是說 PowerApps 會隱藏任何尚未下載到裝置的應用程式)。

  7. 再次執行應用程式。

  8. 請注意如果它正確反映連線狀態,其狀態變為離線

  9. 撰寫新的推文。 它會本機儲存在 LocalTweetsToPost 集合。

  10. 結束飛航模式。 在計時器觸發之後,應用程式會張貼推文。

我們希望這篇文章可幫助您了解 PowerApps 建置離線應用程式的功能。 一如往常,請在我們的論壇提供意見反應,並在 PowerApps 社群部落格中分享您的離線應用程式範例。