Xamarin: Wartedialog Daten laden - Versionsgeschichte

Deko: /* Links und Quellen */

2020-12-18T09:42:16Z

‎Links und Quellen

Deko am 14. Mai 2020 um 13:55 Uhr

2020-05-14T13:55:20Z

Deko am 22. Januar 2020 um 11:47 Uhr

2020-01-22T11:47:00Z

Anki am 12. Februar 2018 um 11:51 Uhr

2018-02-12T11:51:32Z

Anki am 5. Februar 2018 um 14:04 Uhr

2018-02-05T14:04:31Z

Ansp am 3. März 2017 um 12:06 Uhr

2017-03-03T12:06:59Z

Alar: /* Weitere Informationen */

2016-02-10T10:51:49Z

‎Weitere Informationen

Ansp: Die Seite wurde neu angelegt: „==='''Wartedialog für Xamarin App '''=== Sie haben eine mobile App entwickelt, die ihre Daten aus dem Internet, z.B. von einem Webservice, abruft. Es dauert e…“

2015-11-04T10:30:27Z

Die Seite wurde neu angelegt: „==='''Wartedialog für Xamarin App '''=== Sie haben eine mobile App entwickelt, die ihre Daten aus dem Internet, z.B. von einem Webservice, abruft. Es dauert e…“

Neue Seite

==='''Wartedialog für Xamarin App '''===
Sie haben eine mobile App entwickelt, die ihre Daten aus dem Internet, z.B. von einem Webservice, abruft. Es dauert ein bisschen, bis die Daten komplett geladen werden und der Benutzer Ihrer App muss diese ein paar Sekunden vor dem leeren Bildschirm sitzen bleiben. Das möchten Sie ändern und den Ladeprozess mit einem Wartedialog klar andeuten.
==='''Viewmodel vorbereiten'''===
Angenommen, Sie haben im ViewModel Ihr Datenobjekt:
<pre>
private ObservableCollection<Customer> _customers;
public ObservableCollection<Customer> MyCustomerList
{
get
{
return _customers;
}
set
{
if (_customers!= value)
{
_customers = value;
RaisePropertyChanged("MyCustomerList");
}
}
}
</pre>
Nun bereiten Sie bitte in Ihrem Viewmodel ein Flag IsLoaded vor:
<pre>
private bool isLoaded;
public bool IsLoaded
{
get
{
return isLoaded;
}
private set
{
if (isLoaded != value)
{
isLoaded = value;
RaisePropertyChanged("IsLoaded");
}
}
}
</pre>
Setzen Sie dieses Flag vor und nach dem Laden der eigentlichen Daten:
<pre>
public async void LoadData(int countryId)
{
IsLoaded = false;

MyCustomerList = await DataManager.GetCostumersByLand (countryId);

IsLoaded = true;
}
</pre>
==='''Wartedialog für Xamarin.Android'''===
Zuerst nehmen Sie bitte in das Layout Ihrer Xamarin.Android-App ein ProgressBar mit auf. Dieses sollte mittels eines FrameLayouts mit dem eigentlichen Content zusammengefasst werden.
<pre>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
<LinearLayout
android:id="@+id/LoadLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:visibility="invisible"
android:gravity="center_horizontal|center_vertical">
<ProgressBar
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="@+id/ProgressBar1"
android:indeterminateOnly="true"
android:keepScreenOn="true"
android:layout_marginTop="10dp"
android:gravity="center_horizontal|center_vertical" />
</LinearLayout>
<ListView
android:id="@+id/CustomersListView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
</pre>
In der C#-Activity-Klasse Initialisieren Sie nun das Binding:
<pre>
private Binding<ObservableCollection<Customer>, ObservableCollection<Customer>> bindingCustomerList;
private Binding<bool, bool> bindingIsLoaded;

protected override void OnStart()
{
base.OnStart();

InitializeBindings();

ViewModel.LoadData();
}

protected override void OnStop()
{
base.OnStop();

// Bindings detachen, sonst bleiben diese am Viewmodel hängen und
// Binding funktioniert fehlerhaft
if (bindingCustomerList != null)
{
bindingCustomerList.Detach();
bindingCustomerList = null;
}

if (bindingIsLoaded != null)
{
bindingIsLoaded.Detach();
bindingIsLoaded = null;
}
}

private void InitializeBindings()
{
// Bei Änderung der Daten im ViewModel UI aktualisieren
bindingCustomerList = this.SetBinding(
() => ViewModel.MyCustomerList).WhenSourceChanges(()
=>
{
myAdapter.DataSource = ViewModel.MyCustomerList;
CustomersListView.Adapter = myAdapter;
myAdapter.NotifyDataSetChanged();
});

// Sobald die Daten geladen werden, werden entsprechende Controls angezeigt
bindingIsLoaded = this.SetBinding(() => ViewModel.IsLoaded).WhenSourceChanges(
() => {
SetAktivContent();
});
}
</pre>
Die Steuerung über sichtbare Objekte findet in der Methode SetActivContent statt:
<pre>
private void SetActivContent(bool isloaded)
{
if (isloaded)
{
// Daten anzeigen
this.CustomersListView.Visibility = ViewStates.Visible;
this.LoadLayout.Visibility = ViewStates.Gone;
}
else
{
// Wartedialog anzeigen
this.CustomersListView.Visibility = ViewStates.Gone;
this.LoadLayout.Visibility = ViewStates.Visible;
}
}
</pre>
Und sieht dann die Wartemaske in Xamarin.Android-App aus:
[[Datei:Wartemaske_Android.jpg|left|thumb|200px]]
 
==='''Wartedialog für Xamarin.iOS'''===
Bei Xamarin.iOS können Sie die gleiche Vorgehensweise benutzen, nur noch heißt da das entspre-chende Control für Wartedialog „UIActivityIndicatorView“ und sieht so aus:
[[Datei:Wartemaske_iOS.png|left|thumb|100px]]
 
Und die entsprechende Methode SetActivContent sieht dann wie folgt aus:
<pre>
private void SetActivContent ()
{
if (ViewModel.IsLoaded == false)
{
// Wartedialog anzeigen
this.ActivityIndicator1.Hidden = false;
this.ActivityIndicator1.StartAnimating();
this.CustomerTableView.Hidden = true;
}
else
{
// Daten sind da
this.ActivityIndicator1.Hidden = true;
this.CustomerTableView.Hidden = false;
}
}
</pre>
=== '''Weitere Informationen''' ===
https://mittelstand.max-it.de/Server-Infrastruktur/Server-Virtualisierung 
=== '''Links und Quellen''' ===
http://cdn1.xamarin.com/webimages/images/infographics/xamarin-mobile-controls-infographic-062014.pdf
=== '''Kontakt''' ===
Wenn Sie Fragen oder Anmerkungen zu diesem Artikel haben, melden Sie sich bitte bei uns: mailto:techcorner@max-it.de. 

Über m.a.x. Informationstechnologie AG: 
Als etabliertes Münchner Systemhaus zeichnen wir uns seit 1989 als verlässlicher IT-Partner mittelständischer und großer Unternehmen aus. Unser Portfolio reicht von IT- Services über individuelle Softwareentwicklung bis hin zur ERP-Beratung. 
=== '''Tags''' ===
Xamarin, Android, iOS, Daten laden, ProgressBar, ActivityIndivator, Wartedialog, Wartemaske
[[Kategorie: Softwareentwicklung]]

@@ Zeile 185: / Zeile 185: @@
 === '''Links und Quellen''' ===
-[http://cdn1.xamarin.com/webimages/images/infographics/xamarin-mobile-controls-infographic-062014.pdf www.cdn1.xamarin.com/webimages/images/infographics/xamarin-mobile-controls-infographic-062014.pdf]
+https://dotnet.microsoft.com/apps/xamarin
 === '''Kontakt''' ===

@@ Zeile 1: / Zeile 1: @@
 ==='''Wartedialog für Xamarin App '''===
-Sie haben eine mobile App entwickelt, die ihre Daten aus dem Internet, z.B. von einem Webservice, abruft. Es dauert ein bisschen,<br />
+Sie haben eine mobile App entwickelt, die ihre Daten aus dem Internet, z.B. von einem Webservice, abruft. Es dauert ein bisschen, bis die Daten komplett geladen werden und der Benutzer Ihrer App muss diese ein paar Sekunden vor dem leeren Bildschirm sitzen bleiben. Das möchten Sie ändern und den Ladeprozess mit einem Wartedialog klar andeuten.
 ==='''Viewmodel vorbereiten'''===
@@ Zeile 54: / Zeile 52: @@
+         }
 </pre>
 ==='''Wartedialog für Xamarin.Android'''===
-Zuerst nehmen Sie bitte in das Layout Ihrer Xamarin.Android-App ein ProgressBar mit auf. Dieses sollte mittels<br />
+Zuerst nehmen Sie bitte in das Layout Ihrer Xamarin.Android-App ein ProgressBar mit auf. Dieses sollte mittels eines FrameLayouts mit dem eigentlichen Content zusammengefasst werden.
 <pre>
 <FrameLayout
@@ Zeile 157: / Zeile 155: @@
 [[Datei:Wartemaske_Android.jpg|left|thumb|200px]]
 <br /><br /><br /><br /><br /><br />
 ==='''Wartedialog für Xamarin.iOS'''===
-Bei Xamarin.iOS können Sie die gleiche Vorgehensweise benutzen, nur noch heißt da das entspre-chende Control für<br />
+Bei Xamarin.iOS können Sie die gleiche Vorgehensweise benutzen, nur noch heißt da das entspre-chende Control für Wartedialog „UIActivityIndicatorView“ und sieht so aus:
 [[Datei:Wartemaske_iOS.png|left|thumb|100px]]
-<br /><br /><br /><br /><br /><br /><br />
+<br /><br /><br /><br /><br /><br /><br /><br /><br />
 Und die entsprechende Methode SetActivContent sieht dann wie folgt aus:
 <pre>
@@ Zeile 181: / Zeile 179: @@
+          }
 </pre>
 === '''Weitere Informationen''' ===
 Mehr Informationen zu unseren Softwarelösungen und Services finden Sie auf<br />
@@ Zeile 192: / Zeile 191: @@
 [http://mailto:techcorner@max-it.de techcorner@max-it.de].<br />
-Über m.a.x. Informationstechnologie AG: <br />
+'''Über m.a.x. Informationstechnologie AG:''' <br />
-Als etabliertes Münchner Systemhaus zeichnen wir uns seit 1989 als verlässlicher IT-Partner mittelständischer und<br />
+Als etabliertes Münchner Systemhaus zeichnen wir uns seit 1989 als verlässlicher IT-Partner mittelständischer und großer Unternehmen aus. Unser Portfolio reicht von IT- Services über individuelle Softwareentwicklung bis hin zur ERP-Beratung.
-großer Unternehmen aus. Unser Portfolio reicht von IT- Services über individuelle Softwareentwicklung bis hin zur ERP-Beratung.<br />
 === '''Tags''' ===
 Xamarin, Android, iOS, Daten laden, ProgressBar, ActivityIndivator, Wartedialog, Wartemaske
 [[Kategorie: Softwareentwicklung]]

@@ Zeile 177: / Zeile 177: @@
 </pre>
 === '''Weitere Informationen''' ===
-https://www.max-it.de/techcorner/Xamarin:_Wartedialog<br />
+Mehr Informationen zu unseren Softwarelösungen und Services finden Sie auf [https://www.max-it.de/techcorner/Xamarin:_Wartedialog https://www.max-it.de/Softwarelösungen]
 === '''Links und Quellen''' ===

@@ Zeile 177: / Zeile 177: @@
 </pre>
 === '''Weitere Informationen''' ===
-https://www.max-it.de/softwareloesungen/<br />
+https://www.max-it.de/techcorner/Xamarin:_Wartedialog<br />
 === '''Links und Quellen''' ===

@@ Zeile 177: / Zeile 177: @@
 </pre>
 === '''Weitere Informationen''' ===
-https://mittelstand.max-it.de/Software-Loesungen/App-Entwicklung/Xamarin<br />
+https://www.max-it.de/softwareloesungen/<br />
 === '''Links und Quellen''' ===