I have this XAML code:
<StackLayout Grid.Row="0" Grid.Column="0" Padding="15,10,20,10" HorizontalOptions="StartAndExpand" VerticalOptions="CenterAndExpand"> <StackLayout.GestureRecognizers> <TapGestureRecognizer Tapped="tapFavorites" NumberOfTapsRequired="1" /> </StackLayout.GestureRecognizers> <Label x:Name="faveLabel" FontFamily="FontAwesome" XAlign="Center" FontSize="23"> <Label.Triggers> <DataTrigger TargetType="Label" Binding="{Binding Favorite}" Value="true"> <Setter Property="TextColor" Value="Red" /> </DataTrigger> <DataTrigger TargetType="Label" Binding="{Binding Favorite}" Value="false"> <Setter Property="TextColor" Value="Gray" /> </DataTrigger> </Label.Triggers> </Label> </StackLayout> In my C# code I am familar with setting the Text property of the label by simply specifying like this:
sampleLabel.Text = "ABC" But this situation is different. Can someone tell me how I can change the color of a label from C# when the label is clicked on.
3 Answers
Answers 1
What about this:
MainPage:
public partial class MainPage : ContentPage { MyViewModel vm; public MainPage() { InitializeComponent(); vm = new MyViewModel(); BindingContext = vm; var faveLabel = new Label { FontSize = 24, FontFamily = "FontAwesome", Text = "Tap Here !" }; var trigger1 = new DataTrigger(typeof(Label)); trigger1.Binding = new Binding("Favorite", BindingMode.TwoWay); trigger1.Value = true; trigger1.Setters.Add(new Setter { Property = Label.TextColorProperty, Value = Color.Red }); var trigger2 = new DataTrigger(typeof(Label)); trigger2.Binding = new Binding("Favorite", BindingMode.TwoWay); trigger2.Value = false; trigger2.Setters.Add(new Setter { Property = Label.TextColorProperty, Value = Color.Gray }); faveLabel.Triggers.Add(trigger1); faveLabel.Triggers.Add(trigger2); var sl = new StackLayout { HorizontalOptions = LayoutOptions.StartAndExpand, VerticalOptions = LayoutOptions.CenterAndExpand }; var tgr = new TapGestureRecognizer(); tgr.NumberOfTapsRequired = 1; tgr.Tapped += tapFavorites; sl.GestureRecognizers.Add(tgr); sl.Children.Add(faveLabel); Content = sl; } public void tapFavorites(object sender, EventArgs e) { vm.Favorite = !vm.Favorite; } } ViewModel:
public class MyViewModel : INotifyPropertyChanged { public event PropertyChangedEventHandler PropertyChanged; private bool favorite; public bool Favorite { get { return favorite; } set { if (value != favorite) { favorite = value; NotifyPropertyChanged(); } } } private void NotifyPropertyChanged([CallerMemberName] String propertyName = "") { PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName)); } } Answers 2
You can access your faveLabel trough it's name and a GestureRecognizer to it. There you set the TextColor of your label to a different one. Instead of typing the code out after the arrow function you can also provide a function.
faveLabel.GestureRecognizers.Add( new TapGestureRecognizer { Command = new Command( () => faveLabel.TextColor = Color.Red ) }); Instead of typing the full code out after the arrow function you can also provide a function.
... { Command = new Command(() => OnLabelClicked() ) } Here is the link to the official Xamarin documentation for the (Tap)GestureRecognizers.
Answers 3
If you do things in xaml then triggers is the way to go but if you do it in code you can do it either way - with or without triggers
You can keep Favorite and/or Label text color in model and do binding or not. If you have model then you can also bind tapFavorites as Marimba showed
public partial class MainPage : ContentPage { Label faveLabel; bool favorite = false; public MainPage() { InitializeComponent(); faveLabel = new Label { FontSize = 24, FontFamily = "FontAwesome", Text = "Tap Here !" }; var sl = new StackLayout { HorizontalOptions = LayoutOptions.StartAndExpand, VerticalOptions = LayoutOptions.CenterAndExpand }; var tgr = new TapGestureRecognizer(); tgr.NumberOfTapsRequired = 1; tgr.Tapped += tapFavorites; sl.GestureRecognizers.Add(tgr); sl.Children.Add(faveLabel); Content = sl; } public void tapFavorites(object sender, EventArgs e) { favorite = ! favorite; faveLabel.TextColor = favorite ? Color.Red : Color.Gray; } } 
0 comments:
Post a Comment