Çevrimdışı çalışabilen tuval uygulamaları geliştirmeDevelop offline-capable canvas apps

Bir uygulama geliştirici olarak karşılaşabileceğiniz en yaygın senaryolardan biri, bağlantının sınırlı olduğu veya hiç olmadığı durumlarda kullanıcılarınızın üretkenliğine olanak sağlamaktır.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, çevrimdışı çalışabilen tuval uygulamaları geliştirmenize yardımcı olan çeşitli özellikler ve davranışlar içerir.PowerApps has a set of features and behaviors that help you to develop offline-capable canvas apps. Şunları yapabilirsiniz:You can:

  • PowerApps Mobile'ı çevrimdışıyken başlatabilirsiniz.Launch PowerApps Mobile when offline.
  • Geliştirdiğiniz uygulamaları çevrimdışıyken çalıştırabilirsiniz.Run apps that you develop when offline.
  • Connection sinyal nesnesini kullanarak bir uygulamanın ne zaman çevrimdışı ve ne zaman çevrimiçi olduğunu veya ne zaman ölçülen bağlantı kullandığını belirleyebilirsiniz.Determine when an app is offline, online, or in a metered connection by using the Connection signal object.
  • Çevrimdışıyken temel veri depolaması için koleksiyonları kullanabilir ve LoadData ve SaveData gibi işlevlerden yararlanabilirsiniz.Use collections and leverage functions such as LoadData and SaveData for basic data storage when offline.

SınırlamalarıLimitations

LoadData ve SaveData yerel cihazda küçük miktarlarda veri depolamak için basit bir mekanizma oluşturacak şekilde birleştirin.LoadData and SaveData combine to form a simple mechanism to store small amounts of data on a local device. Bu işlevleri kullanarak uygulamanıza çevrimdışı basit özellikleri ekleyebilirsiniz.By using these functions, you can add simple offline capabilities to your app.

Bunlar bir bellek içi koleksiyonunda çalışır çünkü bu işlevler kullanılabilir uygulama bellek miktarı ile sınırlıdır.These functions are limited by the amount of available app memory because they operate on an in-memory collection. Kullanılabilir bellek, cihaz, işletim sistemi, PowerApps Mobile'ı kullanan bellek ve ekranları ve denetimleri açısından uygulama karmaşıklığına bağlı olarak değişebilir.Available memory can vary depending on the device, the operating system, the memory that PowerApps Mobile uses, and the complexity of the app in terms of screens and controls. Verilerinizin birkaç taneden fazla megabayt depolayacak olursanız, uygulamanız üzerinde çalışmaya beklediğiniz cihazlarda beklenen senaryoları ile test edin.If you store more than a few megabytes of data, test your app with expected scenarios on the devices on which you expect it to run. Genel olarak kullanılabilir bellek 30 ve 70 megabayt arasında beklemelisiniz.You should generally expect to have between 30 and 70 megabytes of available memory.

İşlevler ayrıca otomatik olarak bir birleştirme çakışması çözümlemek olmayan bir cihaz bağlantısı çevrimdışı verir – yapılandırma verileri kaydedilir ve yeniden işlemek nasıl kadar ifadeleri yazarken yetkilisidir.The functions also don't automatically resolve merge conflicts when a device returns to connectivity from offline – configuration on what data is saved and how to handle reconnection is up to the maker when writing expressions.

Çevrimdışı senaryolar için olanaklarını genişletmek için çalışıyoruz.We're working to expand the capabilities for offline scenarios. Çıktıklarında güncelleştirmeler için burada ve PowerApps blogunda takipte kalın.Stay tuned here and on the PowerApps blog for updates when they become available.

Çevrimdışı çalışabilen uygulamalar oluşturmaHow to build offline capable apps

Çevrimdışı senaryolarda üzerine düşünülmesi gereken ilk şey, uygulamalarınızın verilerle nasıl çalıştığıdır.The first thing to think about in offline scenarios is how your apps work with data. PowerApps'teki uygulamalar genellikle verilere, SharePoint, Office 365 ve Common Data Service gibi platformların sağladığı bir bağlayıcı kümesi aracılığıyla erişir.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. Ayrıca, uygulamaların bir RESTful uç noktası sağlayan herhangi bir hizmete erişmesine olanak sağlayan özel bağlayıcılar da oluşturabilirsiniz.You can also build custom connectors that enable apps to access any service that provides a RESTful endpoint. Bu bir Web API'si veya Azure İşlevleri gibi bir hizmet olabilir.This could be a Web API or a service such as Azure Functions. Söz konusu bağlayıcıların tümü İnternet üzerinden HTTPS kullanır ve bu, kullanıcılarınızın verilere ve bir hizmetin sunduğu diğer özelliklere erişebilmek için çevrimiçi olması gerektiği anlamına gelir.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.

Bağlayıcı içeren PowerApps uygulaması

Çevrimdışı verileri işlemeHandling offline data

PowerApps'in en ilginç yönlerinden biri de, veri kaynağından bağımsız olarak verileri tutarlı bir şekilde filtrelemenize, aramanıza, sıralamanıza, toplamanıza ve değiştirmenize olanak sağlayan bir dizi özellik ve formüle sahip olmasıdır.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. Kaynaklar, uygulamadaki bellek içi koleksiyonlardan SharePoint listelerine, SQL veritabanlarına ve Common Data Service'e kadar uzanmaktadır.Sources range from in-memory collections in the app, to SharePoint lists, to SQL databases and the Common Data Service. Bu tutarlılık sayesinde bir uygulamayı, farklı bir arka uç kullanılacak şekilde kolayca yeniden hedefleyebilirsiniz.This consistency enables you to easily retarget an app to use a different backend. Burada daha da önemli olan, bir uygulamanın mantığında neredeyse hiçbir değişiklik yapmadan veri yönetimi için yerel koleksiyonlar kullanmanıza da olanak sağlanmasıdır.More importantly here, it also enables you to use local collections for data management with almost no changes to an app's logic. Aslında, yerel koleksiyonlar, çevrimdışı veriler işlemeye yönelik birincil mekanizmadır.In fact, local collections are the primary mechanism for handling offline data.

Çevrimdışı bir Twitter uygulaması oluşturmaBuilding an offline Twitter app

Uygulama geliştirmenin çevrimdışı yönlerine odaklanmak için size Twitter üzerinden basit bir senaryo göstereceğiz.To keep the focus on the offline aspects of app development, we'll show you a simple scenario focused around Twitter. Çevrimdışıyken Twitter gönderileri okumanıza ve tweet göndermenize olanak sağlayan bir uygulama oluşturacağız.We'll build an app that enables you to read Twitter posts and submit tweets while being offline. Söz konusu uygulama çevrimiçi olduğunda tweetleri gönderir ve yerel verileri yeniden yükler.When the app comes online, the app posts tweets and reloads the local data.

Ayrıntılı olarak incelendiğinde, uygulama şunları yapar:At a high level, the app does the following:

  1. Uygulama başlatıldığında (ilk ekranın OnVisible özelliğine bağlı olarak):On app startup (based on the first screen's OnVisible property):

    • Cihaz çevrimiçiyse verileri getirmek için Twitter bağlayıcısına doğrudan erişir ve bir koleksiyonu bu verilerle doldururuz.If the device is online, we access the Twitter connector directly to fetch data, and populate a collection with that data.
    • Cihaz çevrimdışıysa LoadData işlevini kullanarak bir yerel önbellek dosyasındaki verileri yükleriz.If the device is offline, we load the data from a local cache file using LoadData.
    • Kullanıcının tweet göndermesine olanak sağlarız; cihaz çevrimiçiyse tweetleri doğrudan Twitter'a gönderir ve yerel önbelleği yenileriz.We enable the user to submit tweets - if online we post directly to Twitter and refresh the local cache.
  2. Cihaz çevrimiçiyse her 5 dakikada bir:Every 5 minutes, if online:

    • Yerel önbellekteki tweetleri göndeririz.We post any tweets that we have in the local cache.
    • Yerel önbelleği yeniler ve SaveData işlevini kullanarak kaydederiz.We refresh the local cache and save it using SaveData.

1. adım: Yeni bir telefon uygulaması oluşturmaStep 1: Create a new phone app

  1. PowerApps Studio'yu açın.Open PowerApps Studio.

  2. Yeni > Boş uygulama > Telefon düzeni seçeneklerine tıklayın veya dokunun.Click or tap New > Blank app > Phone layout.

    Boş uygulama, telefon düzeni

2. adım: Twitter bağlantısı eklemeStep 2: Add a Twitter connection

  1. İçerik > Veri kaynakları seçeneklerine tıklayın veya dokunun ve ardından Veri kaynakları bölmesindeki Veri kaynağı ekle seçeneğini belirleyin.Click or tap Content > Data sources, then choose Add data source on the Data sources panel.

  2. Yeni Bağlantı'ya tıklayın veya dokunun , Twitter'ı seçin ve Oluştur seçeneğine tıklayın veya dokunun.Click or tap New Connection , select Twitter , and click or tap Create.

  3. Kimlik bilgilerinizi girin ve bağlantıyı oluşturun.Enter your credentials, and create the connection.

    Twitter bağlantısı ekleme

3. adım: Tweetleri bir LocalTweets koleksiyonuna uygulama yüklemeStep 3: Load tweets into a LocalTweets collection on app startup

Uygulamada Screen1 için OnVisible özelliğini seçin ve şu formülü söz konusu özelliğe kopyalayın: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" )

Tweetleri yüklemeye yönelik formül

Bu formül, cihazın çevrimiçi olup olmadığını denetler:This formula checks if the device is online:

  • Cihaz çevrimiçiyse LocalTweets koleksiyonuna, "PowerApps" arama terimini içeren 100 adede kadar tweet yükler.If the device is online, it loads into a LocalTweets collection up to 100 tweets with the search term "PowerApps".
  • Cihaz çevrimdışı durumdaysa "Tweets" adlı bir dosyadan (varsa) yerel önbelleğe yükleme yapar.If the device is offline, it loads the local cache from a file called "Tweets," if it's available.
  1. Yeni bir esnek yükseklik Galerisi ekleyin: INSERT > galeri > boş esnek yükseklik.Insert a new flexible height gallery: Insert > Gallery > Blank flexible height.

  2. Items özelliğini LocalTweets olarak ayarlayın.Set the Items property to LocalTweets.

  3. Her bir tweetteki verileri görüntülemek için dört Etiket denetimi ekleyin ve denetimlerin Text özelliklerini şu şekilde ayarlayın: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. Bir Görüntü denetimi ekleyin ve Image özelliğini ThisItem.UserDetails.ProfileImageUrl olarak ayarlayın.Add an Image control, and set the Image property to ThisItem.UserDetails.ProfileImageUrl.

5. Adım: Bağlantı durumu etiketi eklemeStep 5: Add a connection status label

Yeni bir Etiket denetimi ekleyin ve Text özelliğini şu formül olarak ayarlayın:Insert a new Label control, and set its Text property to the following formula:

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

Bu formül, cihazın çevrimiçi olup olmadığını denetler.This formula checks if the device is online. Cihaz çevrimiçiyse etiketin metni "Connected", değilse "Offline" olarak görünür.If it is, the text of the label is "Connected", otherwise it's "Offline".

6. adım: Yeni tweetler oluşturmak için metin girişi EkleStep 6: Add a text input to compose new tweets

  1. "NewTweetTextInput" adlı yeni bir Metin girişi denetimi ekleyin.Insert a new Text input control named "NewTweetTextInput".

  2. Metin girişinin Reset özelliğini resetNewTweet olarak ayarlayın.Set the Reset property of the text input to resetNewTweet.

7. adım: Tweet göndermek için bir düğme ekleyinStep 7: Add a button to post the tweet

  1. Bir Düğme denetimi ekleyin ve Text özelliğini "Tweet" olarak ayarlayın.Add a Button control, and set the Text property to "Tweet".

  2. OnSelect özelliğini şu formül olarak ayarlayın: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} )
    

Bu formül, cihazın çevrimiçi olup olmadığını denetler:This formula checks if the device is online:

  • Cihaz çevrimiçiyse metni hemen tweetler.If the device is online, it tweets the text immediately.
  • Cihaz çevrimdışıysa tweeti LocalTweetsToPost koleksiyonunda tutar ve koleksiyonu uygulamaya kaydeder.If the device is offline, it captures the tweet in a LocalTweetsToPost collection, and saves it to the app.

Bu işlemin ardından formül, metin kutusundaki metni sıfırlar.Then the formula resets the text in the text box.

8. adım: Beş dakikada bir tweet denetlemek için bir zamanlayıcı eklemeStep 8: Add a timer to check for tweets every five minutes

Yeni bir Zamanlayıcı denetimi ekleyin:Add a new Timer control:

  • Duration özelliğini 300000 olarak ayarlayın.Set the Duration property to 300000.

  • AutoStart özelliğini true olarak ayarlayın.Set the AutoStart property to true.

  • OnTimerEnd özelliğini şu formül olarak ayarlayın: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"} )
    )
    

Bu formül, cihazın çevrimiçi olup olmadığını denetler.This formula checks if the device is online. Cihaz çevrimiçiyse uygulama, LocalTweetsToPost koleksiyonundaki tüm öğeleri tweet olarak gönderir.If it is, the app tweets all the items in the LocalTweetsToPost collection. Bu işlemin ardından koleksiyon temizlenir.Then it clears the collection.

Uygulama tamamlandığına göre test işlemine geçmeden önce uygulamanın nasıl göründüğünü kontrol edelim.Now that the app is finished, let's check out how it looks before we move on to testing. Soldaki resimde uygulama bağlıyken sağdaki resimde çevrimdışıdır ve tekrar çevrimiçi olduğunda gönderilmeye hazır bir tweet içermektedir.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.

Çevrimiçi ve çevrimdışı modlar ile gösterilen, tamamlanmış uygulama

Uygulamayı test etmeTesting the app

Uygulamayı test etmek için aşağıdaki adımları uygulayın:Use the following steps to test the app:

  1. PowerApps'i çevrimiçi bir mobil cihazda çalıştırın.Run PowerApps on a mobile device while online. Uygulamayı çevrimiçiyken en az bir kez çalıştırmanız gerekir; böylece, uygulamayı cihaza indirebilirsiniz.You must run an app at least once while being online, so you can download the app to the device.
  2. Twitter uygulamasını başlatın.Launch the Twitter app.
  3. Tweetlerin yüklendiğine ve durumun Connected olarak göründüğüne dikkat edin.Notice that the tweets are loaded, and that the status shows Connected.
  4. PowerApps'i tamamen kapatın.Close PowerApps completely.
  5. Çevrimdışı olduğundan emin olmak için cihazı uçak moduna ayarlayın.Set the device to airplane mode to ensure that it's offline.
  6. PowerApps'i çalıştırın.Run PowerApps. Artık Twitter uygulamasını çevrimdışı olarak çalıştırabilir ve bu cihazda daha önce çevrimiçiyken çalıştırdığınız diğer tüm uygulamalara erişebilirsiniz. (PowerApps cihazınıza henüz indirilmemiş olan uygulamaları gizler.)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. Uygulamayı tekrar çalıştırın.Run the app again.
  8. Bağlantı durumunun doğru bir şekilde Offline olarak gösterildiğine dikkat edin.Notice how it correctly reflects the connection state, with a status of Offline.
  9. Yeni bir tweet yazın.Write a new tweet. Tweet, LocalTweetsToPost koleksiyonunda yerel olarak depolanır.It will be stored locally in the LocalTweetsToPost collection.
  10. Uçak modundan çıkın.Exit airplane mode. Uygulama, zamanlayıcı tetiklendikten sonra tweeti gönderir.After the timer triggers, the app posts the tweet.

Bu makalenin size PowerApps'in çevrimdışı uygulama oluşturma özelliklerine ilişkin bir fikir verdiğini umuyoruz.We hope this article gives you an idea of the capabilities that PowerApps has for building offline apps. Her zaman olduğu gibi, forumumuzda geri bildirim sağlamanızı ve çevrimdışı uygulama örneklerinizi PowerApps topluluk blogunda paylaşmanızı rica ederiz.As always, please provide feedback in our forum and share your examples of offline apps in the PowerApps community blog.