Kapcsolat nélküli üzemmódra képes alkalmazások fejlesztése PowerAppsszelDevelop offline-capable apps with PowerApps

Mobilalkalmazás-fejlesztőként az egyik leggyakoribb kihívás, gondoskodni arról, hogy a felhasználók akkor is folytatni tudják a munkát, amikor a csatlakozási lehetőségek korlátozottak, vagy esetleg egyáltalán nincs lehetőség csatlakozásra.One of the most common scenarios you face as a mobile app developer is enabling your users to be productive when there is limited connectivity or no connectivity at all. PowerApps rendelkezik olyan szolgáltatásokkal és működési módokkal, amelyek segítségével kapcsolat nélküli üzemmódra képes alkalmazások fejleszthetők.PowerApps has a set of features and behaviors that help you to develop offline-capable apps. Előnyök:You can:

  • Kapcsolat nélküli módban is el tudja indítani a PowerApps mobilalkalmazást.Launch the PowerApps mobile app when offline.
  • A fejlesztett alkalmazások kapcsolat nélküli futtatása.Run apps you develop when offline.
  • A Kapcsolat jel objektumot használva meghatározhatja, mikor működik az alkalmazás kapcsolat nélkül, kapcsolódva vagy mért kapcsolatban.Determine when an app is offline, online, or in a metered connection by using the Connection signal object.
  • Használjon gyűjteményeket és használja ki a LoadData és SaveData függvények által nyújtotta lehetőségeket az adatok alapszintű, offline munkához történő tárolásához.Use collections and leverage functions such as LoadData and SaveData for basic data storage when offline.

Offline üzemmódra képes alkalmazások készítéseHow to build offline capable apps

A kapcsolat nélküli működés esetében az egyik legfontosabb kérdés azt végiggondolni, hogyan kezeli az alkalmazás az adatokat.The first thing to think about in offline scenarios is how your apps work with data. A PowerApps alkalmazások elsősorban a platform által biztosított olyan összekötőkön keresztül érik el az adatokat, mint a SharePoint, az Office 365 és a Common Data Service.Apps in PowerApps primarily access data through a set of connectors that the platform provides, such as SharePoint, Office 365, and the Common Data Service. Egyéni összekötőket is készíthet, melyekkel az alkalmazások bármilyen RESTful végpontot biztosító szolgáltatást el tudnak érni.You can also build custom connectors that enable apps to access any service that provides a RESTful endpoint. Ez lehet egy webes API vagy egy olyan szolgáltatás, mint például az Azure Functions.This could be a Web API or a service such as Azure Functions. Ezen összekötők mindegyike internet fölötti HTTPS-t használ, ami azt jelenti, hogy a felhasználóknak kapcsolódnia kell a hálózatra ahhoz, hogy elérjék az adatokat vagy bármilyen más lehetőséget, amit a szolgáltatás kínál.All these connectors use HTTPS over the Internet, which means your users must be online for them to access data and any other capabilities that a service offers.

A PowerApps és az összekötők

Offline adatok kezeléseHandling offline data

A PowerApps egyik legérdekesebb aspektusa, hogy olyan lehetőségeket és megoldásokat biztosít, melyek lehetővé teszik, hogy a felhasználók konzisztens módon tudják szűrni, keresni, rendezni, aggregálni és manipulálni az adatokat, függetlenül attól, hogy milyen adatforrást használnak.One of the most interesting aspects of PowerApps is its set of capabilities and formulas that enable you to filter, search, sort, aggregate, and manipulate data in a consistent way regardless of the data source. A forrásként használható objektumok köre az alkalmazásbeli, memóriában található gyűjteményektől kezdve a SharePoint listákig, SQL adatbázisokig és a Common Data Service-ig terjed.Sources range from in-memory collections in the app, to SharePoint lists, to SQL databases and the Common Data Service. A konzisztenciának köszönhetően a felhasználók könnyen átállíthatják az alkalmazást egy másik háttérszolgáltatás használatára.This consistency enables you to easily retarget an app to use a different backend. Ami pedig még fontosabb: lehetővé teszi, hogy a felhasználó helyi gyűjteményeket használjon az adatok kezeléséhez, alig módosítva az alkalmazás logikáját.More importantly here, it also enables you to use local collections for data management with almost no changes to an app's logic. Valójában a helyi gyűjtemények jelentik az offline adatok elsődleges kezelési eljárását.In fact, local collections are the primary mechanism for handling offline data.

Kapcsolat nélküli Twitter-alkalmazások létrehozásaBuilding an offline Twitter app

A kapcsolat nélküli alkalmazásfejlesztés sajátosságainak illusztrálásához bemutatunk egy Twitter köré épülő egyszerű esetet.To keep the focus on the offline aspects of app development, we'll show you a simple scenario focused around Twitter. Készítünk egy alkalmazást, amely lehetővé teszi Twitter bejegyzések kapcsolat nélküli üzemmódban történő olvasását és tweetek kapcsolat nélküli üzemmódú feladását.We'll build an app that enables you to read Twitter posts and submit tweets while being offline. Amikor az alkalmazás kapcsolódik a hálózathoz, feladja a tweeteket és újratölti a helyi adatokat.When the app comes online, the app posts tweets and reloads the local data.

Magas szinten az alkalmazás a következő lépéseket hajtja végre:At a high level, the app does the following:

  1. Az alkalmazás indításakor (az első képernyő OnVisible (Megjelenítéskor) tulajdonsága alapján):On app startup (based on the first screen's OnVisible property):

    • Ha az eszköz hálózathoz csatlakozik, közvetlenül a Twitter-összekötőt elérve beolvassa az adatokat, és betölti azokat egy gyűjteménybe.If the device is online, we access the Twitter connector directly to fetch data, and populate a collection with that data.
    • Ha az eszköz offline állapotban van, az adatokat a helyi gyorsítótárból tölti be a LoadData függvényt használva.If the device is offline, we load the data from a local cache file using LoadData.
    • Lehetőség van arra, hogy a felhasználó tweeteket terjesszen fel. Ha hálózathoz kapcsolódik, az alkalmazás közvetlenül a Twitterbe adja fel a tweeteket, és frissíti a helyi gyorsítótárat.We enable the user to submit tweets - if online we post directly to Twitter and refresh the local cache.
  2. Kapcsolat nélküli üzemmódban, 5 percenként:Every 5 minutes, if online:

    • Feladja a gyorsítótárban található tweeteket.We post any tweets that we have in the local cache.
    • Frissíti és menti a helyi gyorsítótárat a SaveData függvényt használva.We refresh the local cache and save it using SaveData.

1. lépés: Új telefonos alkalmazás létrehozásaStep 1: Create a new phone app

  1. Nyissa meg a PowerApps Studiót.Open PowerApps Studio.
  2. Kattintson vagy koppintással válassza ki az Új > Üres alkalmazás > Telefonos elrendezés lehetőséget.Click or tap New > Blank app > Phone layout.

    Üres alkalmazás, telefonos elrendezés

2. lépés: Twitter-kapcsolat hozzáadásaStep 2: Add a Twitter connection

  1. Kattintson vagy koppintson a Nézet > Adatforrások lehetőségre, majd az Adatok panelen válassza az Adatforrás felvétele lehetőséget.Click or tap Content > Data sources, then choose Add data source on the Data sources panel.
  2. Kattintson vagy koppintson az Új kapcsolat elemre, válassza ki a Twitter lehetőséget majd kattintson a Létrehozás elemre.Click or tap New Connection , select Twitter , and click or tap Create.
  3. Adja meg a hitelesítési adatokat, és hozza létre a kapcsolatot.Enter your credentials, and create the connection.

    Twitter-kapcsolat hozzáadása

3. lépés: Tweetek betöltése egy LocalTweets gyűjteménybe az alkalmazás indításakorStep 3: Load tweets into a LocalTweets collection on app startup

Az alkalmazás Screen1 képernyőjének OnVisible (Megjelenítésekor) tulajdonságához másolja be a következő képletet:Select the OnVisible property for Screen1 in the app, and copy in the following formula:

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")

Tweetek betöltésére szolgáló képlet

A képlet végrehajtásakor a rendszer ellenőrzi, hogy az eszköz kapcsolódik-e hálózathoz:This formula checks if the device is online:

  • Ha az eszköz hálózathoz kapcsolódik, akkor egy helyi LocalTweets gyűjteménybe betölt akár 100 Tweetet is, a „PowerApps” keresőkifejezést használva.If the device is online, it loads into a LocalTweets collection up to 100 tweets with the search term "PowerApps".
  • Ha az eszköz nem kapcsolódik hálózathoz, betölti a helyi gyorsítótárat egy „Tweets” nevű fájlból, ha rendelkezésre áll ilyen.If the device is offline, it loads the local cache from a file called "Tweets," if it's available.
  1. Szúrjon be egy rugalmas magasságú katalógust a Beszúrás > Katalógus > Rugalmas magasság lehetőséget használva.Insert a new flexible height gallery: Insert > Gallery > Blank flexible height.
  2. Az Items tulajdonságnál adja meg a LocalTweets értéket.Set the Items property to LocalTweets.
  3. Vegyen fel négy Felirat vezérlőt az egyes tweetek adatainak a megjelenítéséhez, és Text tulajdonságaiknál adja meg a következő értéket:Add four Label controls to display data from each tweet, and set the Text properties to:
    • ThisItem.TweetTextThisItem.TweetText
    • ThisItem.UserDetails.FullName & "@" & ThisItem.UserDetails.UserNameThisItem.UserDetails.FullName & " @" & ThisItem.UserDetails.UserName
    • "RT:" & ThisItem.RetweetCount"RT: " & ThisItem.RetweetCount
    • Text(DateTimeValue(ThisItem.CreatedAtIso), DateTimeFormat.ShortDateTime)Text(DateTimeValue(ThisItem.CreatedAtIso), DateTimeFormat.ShortDateTime)
  4. Vegyen fel egy Kép vezérlőelemet, és Image tulajdonságánál adja meg a ThisItem.UserDetails.ProfileImageUrl értéket.Add an Image control, and set the Image property to ThisItem.UserDetails.ProfileImageUrl.

5. lépés: Kapcsolat állapotát mutató felirat hozzáadásaStep 5: Add a connection status label

Vegyen fel egy Felirat vezérlőelemet, és a Text tulajdonság értékeként adja meg a következő képletet:Insert a new Label control, and set its Text property to the following formula:

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

A képlet végrehajtásakor a rendszer ellenőrzi, hogy az eszköz kapcsolódik-e hálózathoz.This formula checks if the device is online. Ha igen, a felirat szövege "Connected" (Csatlakozva), ellenkező esetben "Offline" (Nincs kapcsolat) lesz.If it is, the text of the label is "Connected", otherwise it's "Offline".

6. lépés: Szövegbevitel vezérlő hozzáadása új tweetek létrehozásáhozStep 6: Add a text input to compose new tweets

  1. Szúrjon be egy új Szövegbevitel vezérlőelemet "NewTweetTextInput" névvel.Insert a new Text input control named "NewTweetTextInput".
  2. A vezérlő Reset tulajdonságánál adja meg a resetNewTweet értéket.Set the Reset property of the text input to resetNewTweet.

7. lépés: Gomb hozzáadása a tweetek feladásáhozStep 7: Add a button to post the tweet

  1. Vegyen fel egy Gomb vezérlőelemet, majd a Text tulajdonságánál adja meg a „Tweet” értéket.Add a Button control, and set the Text property to "Tweet".
  2. Az OnSelect (Kiválasztáskor) tulajdonság értékeként adja meg a következő képletet:Set the OnSelect property to the following formula:

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

A képlet végrehajtásakor a rendszer ellenőrzi, hogy az eszköz kapcsolódik-e hálózathoz:This formula checks if the device is online:

  • Ha az eszköz hálózathoz kapcsolódik, azonnal feladja a szöveget.If the device is online, it tweets the text immediately.
  • Ha az eszköz nem kapcsolódik hálózathoz, a rendszer egy LocalTweetsToPost gyűjteménybe menti a tweetet, és menti az alkalmazásba.If the device is offline, it captures the tweet in a LocalTweetsToPost collection, and saves it to the app.

Ezt követően a szövegbeviteli mezőt alaphelyzetbe állítja.Then the formula resets the text in the text box.

8. lépés: Számláló hozzáadása a tweetek öt percenkénti ellenőrzéséhezStep 8: Add a timer to check for tweets every five minutes

Vegyen fel egy új Időzítő vezérlőt:Add a new Timer control:

  • A Duration (Időtartam) tulajdonságnál adja meg a 300000 értéket.Set the Duration property to 300000.
  • Az AutoStart tulajdonságnál adja meg a „true” (igaz) értéket.Set the AutoStart property to true.
  • Az OnTimerEnd tulajdonság értékeként adja meg a következő képletet:Set the OnTimerEnd to the following formula:

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

A képlet végrehajtásakor a rendszer ellenőrzi, hogy az eszköz kapcsolódik-e hálózathoz.This formula checks if the device is online. Ha igen, az alkalmazás feladja a LocalTweetsToPost gyűjteményben szereplő összes elemet.If it is, the app tweets all the items in the LocalTweetsToPost collection. Ezután törli a gyűjtemény tartalmát.Then it clears the collection.

Most, hogy az alkalmazás elkészült, mielőtt tesztelnénk nézzük meg, hogy néz ki.Now that the app is finished, let's check out how it looks before we move on to testing. A bal oldali képen az alkalmazás hálózathoz kapcsolódik. A jobb oldali képen nem kapcsolódik hálózathoz, és egy olyan tweetel rendelkezik, amelyet fel fog adni, amikor újra csatlakozik a hálózathoz.On the left, the app is connected; and on the right, it's offline, with one tweet ready to post when it's online again.

Az elkészült alkalmazás hálózathoz kapcsolódó és kapcsolat nélküli módban

Az alkalmazás teszteléseTesting the app

Az alkalmazás teszteléséhez hajtsa végre a következő lépéseket:Use the following steps to test the app:

  1. Futtassa a PowerApps rendszert mobileszközén úgy, hogy közben hálózathoz kapcsolódik.Run PowerApps on a mobile device while online.

    Legalább egyszer hálózati csatlakozás mellett kell lefuttatnia az alkalmazásokat ahhoz, hogy azokat a rendszer le tudja tölteni az eszközére.You must run an app at least once while being online, so you can download the app to the device.

  2. Indítsa el a Twitter alkalmazást.Launch the Twitter app.
  3. Vegye észre, hogy a tweeteket betölti a rendszer, az állapotjelző pedig Connected (Csatlakozva) állapotot jelez.Notice that the tweets are loaded, and that the status shows Connected.
  4. Zárja be és lépjen ki a PowerApps alkalmazásból.Close PowerApps completely.
  5. Állítsa eszközét repülőgépes módra, így biztosítva, hogy nem kapcsolódik hálózathoz.Set the device to airplane mode to ensure that it's offline.
  6. Futtassa a PowerApps alkalmazást.Run PowerApps.

    Most futtathatja a Twitter-alkalmazást kapcsolat nélküli módban, és bármely más alkalmazáshoz is hozzáférhet, amit hálózathoz kapcsolódva már futtatott (azokat az alkalmazásokat, amelyeket még nem töltött le az eszközére, a PowerApps elrejti).You can now run the Twitter app offline, and you have access to any other apps that you have previously run on this device while online (i.e. PowerApps hides any apps that haven't yet been downloaded to your device).

  7. Futtassa ismét az alkalmazást.Run the app again.
  8. Figyelje meg, hogy az állapotjelző helyesen azt tükrözi, hogy a kapcsolat Offline (Nincs kapcsolat) állapotú.Notice how it correctly reflects the connection state, with a status of Offline.
  9. Írjon egy új tweetet.Write a new tweet. Ezt a rendszer helyben fogja tárolni, a LocalTweetsToPost gyűjteményben.It will be stored locally in the LocalTweetsToPost collection.
  10. Lépjen ki a repülőgépes üzemmódból.Exit airplane mode. Amikor az időzítő elindítja, az alkalmazás feladja a tweeteket.After the timer triggers, the app posts the tweet.

Reméljük, hogy ez a cikk segít megérteni, milyen lehetőségeket biztosít a PowerApps kapcsolat nélküli módban is működő alkalmazások készítéséhez.We hope this article gives you an idea of the capabilities that PowerApps has for building offline apps. Mint mindig, most is arra kérjük, jelezzen vissza fórumunkon keresztül, és ossza meg kapcsolat nélküli alkalmazásokkal kapcsolatos tapasztalatait, példáit a PowerApps közösségi blogon.As always, please provide feedback in our forum and share your examples of offline apps in the PowerApps community blog.