web-dev-qa-db-fra.com

Icône centrale et texte dans un bouton Xamarin XAML

Je ne sais pas comment centrer l'icône à l'intérieur du bouton et la placer au-dessus du texte, je n'ai pas trouvé d'informations à ce sujet également, on me demande de faire une sorte de menu d'options "tabb", mais en dessous de l'écran, et J'ai trouvé que c'était un peu "dur" en raison des "implications de conception", etc., alors j'ai décidé qu'avec des boutons ce serait plus facile, mais le problème est maintenant de savoir comment centrer l'image et obtenir le bon texte, si quelqu'un pouvait aider ce serait génial. Voici mon code jusqu'à présent:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.Microsoft.com/winfx/2009/xaml"
         BackgroundColor="Silver"
         x:Class="XamForm.View.MainPage">
<Label Text="{Binding MainText}" VerticalOptions="Center"  HorizontalOptions="Center" />


 <StackLayout Padding="30">
<Label x:Name="lblCuantos" Text="No #" TextColor="Gray" FontSize="20"/>
<Label x:Name="lblNombre" Text="" FontSize="20"/>
<Button  x:Name="btn1" Text="Oprimir" Clicked="Accion"/>
<Button  x:Name="btn2"  BackgroundColor="White" Image="iconRes.png"  HorizontalOptions="CenterAndExpand" Text="Gridd" TextColor="Gray" Clicked="Accion2"/>
<Button  x:Name="btn3"  BackgroundColor="White" Image="iconRes.png"  HorizontalOptions="CenterAndExpand"  TextColor="Gray" Clicked="Accion2"/>


</StackLayout>
</ContentPage>

C'est le résultat réel du bouton lui-même:

http://oi59.tinypic.com/11so9le.jpg

Voici à quoi devrait ressembler le résultat final du menu

http://oi62.tinypic.com/10pzw2f.jpg

Je vous remercie!

imagexamlbuttonxamarin
9
elunap

Vous pouvez utiliser ContentLayout="Top,0" dans le bouton. Par exemple dans votre cas, utilisez le code ci-dessous

<Button  x:Name="btn2" ContentLayout="Top,0" BackgroundColor="White" Image="iconRes.png"  HorizontalOptions="CenterAndExpand" Text="Gridd" TextColor="Gray" Clicked="Accion2" />
<Button  x:Name="btn3" ContentLayout="Top,0" BackgroundColor="White" Image="iconRes.png"  HorizontalOptions="CenterAndExpand"  TextColor="Gray" Clicked="Accion2"/>
29
Tushar patel

Vous pouvez utiliser un StackLayout avec une orientation définie sur Vertical et y ajouter Button et Label.

2
Artur Malendowicz

La propriété Button.Image est de type FileImageSource, de sorte que toute image "locale" peut être utilisée dans un bouton. Cela signifie que le code suivant fonctionnera:

someButton.Image = "imageName.png";

ou vous pouvez écrire

someButton.Image = ImageSource.FromFile("imageName.png");

si imageName.png se trouve dans chacun des projets d'application (dossier Resources dans iOS, dossier Resources/Drawable dans Android et racine d'application dans WinPhone; chacun avec l'ensemble d'actions de génération approprié).

L'équivalent Xaml est:

<Button Text="Has Image" Image="someImage.png" />

Voir le document Travailler avec des images pour plus de détails sur l'action de génération pour chaque plate-forme.

0
Hemant Ramphul