2017-01-14 3 views
0

Ich bin in Xamarin seit etwa Woche und habe eine Frage über die Möglichkeit, Laden-Symbol in eine Schaltfläche zu machen.Xamarin Forms Taste mit Ladeanzeige

Ich möchte etwas ähnlich zu, dies zu erreichen: https://jsfiddle.net/mr8fwtcv/

ich diesen Effekt mit FontAwesome zu erreichen versuchte, hatte aber ein Problem, das es zu animieren, so dass es nicht schlecht wäre Aktivitätsanzeige in der Lösung zu verwenden.

Mein Knopf im Stapel Layout platziert wird, und hier ist der Code:

var loginButton = new Button 
{ 
    BackgroundColor = Color.FromHex("689F38"), 
    TextColor = Color.White, 
    HeightRequest = 46, 
    Text = "Log in", 
    FontAttributes = FontAttributes.Bold, 
    FontSize = 18, 
    Margin = margin 
}; 

ich bereits für einige Plugins/Lösungen zu suchen, konnte aber keine finden. Vielen Dank im Voraus.

+1

Haben Sie versucht, einfach einen ['ActivityIndicator'] (https://developer.xamarin.com/api/type/Xamarin.Forms.ActivityIndicator/) über die Schaltfläche hinzuzufügen und die' Text'-Eigenschaft des 'Button' zu einer leeren Zeichenkette, wenn' IsBusy' (oder was auch immer Sie binden) '' true'' ist? – Demitrian

+1

Ich würde tun, was Demitrian empfohlen hat oder einen ButtonRemderer erstellen und ihn zum nativen hinzufügen. In der OpropretyChanging-Überschreibung können Sie die Funktionalität behandeln. – BrewMate

Antwort

5

Sie müssen ein Layout verwenden, um mehr als ein Steuerelement darin zu haben. Wenn Sie nicht nach CustomRenderers suchen, können Sie ein RelativeLayout verwenden und innerhalb dessen sowohl den Button als auch den Aktivitätsindikator. Sie müssen auch einen Konverter für den Schaltflächentext schreiben, der den Text auf string.Empty setzt, wenn der IsBusy wahr ist.

ZB:

<StackLayout> 
    <ActivityIndicator IsVisible="{Binding IsBusy}" IsRunning="{Binding IsBusy}"> 
    <Button Text="{Binding ButtonText, Converter={StaticResource ButtonTextConverter}, ConverterParameter={Binding IsBusy}> 
<StackLayout> 

Auch wenn Sie dies planen, an mehreren Stellen verwenden Sie diese als benutzerdefinierte Steuerung erstellen können.

Sie können den benutzerdefinierten Steuercode here auschecken.

Das vollständige Projekt ist verfügbar here.