Change isVisible property of Xamarin Forms XAML buttons

I am trying to dynamically show / hide a button inside Xamarin Forms ContentPage. I have two buttons in the XAML code:

<StackLayout Orientation="Vertical"> <Button x:Name="start_btn" Clicked="startPanic"> <Button.Text>START</Button.Text> </Button> <Button x:Name="stop_btn" IsVisible="false"> <Button.Text>STOP</Button.Text> </Button> </StackLayout> 

Corresponding C # code:

 public partial class PanicPage : ContentPage { private Button startBtn; private Button stopBtn; public PanicPage () { InitializeComponent (); startBtn = this.FindByName<Button> ("start_btn"); stopBtn = this.FindByName<Button> ("stop_btn"); } private void startPanic(object sender, EventArgs args){ Device.BeginInvokeOnMainThread (() => { startBtn.IsVisible = false; stopBtn.IsVisible = true; // DOESN'T WORK, button still will be hidden }); } } 

When I set the isVisible property in XAML, it does not respond to changing properties in the event method (startPanic). How can i fix this?

+5
source share
4 answers

Change your code in the xmal file and write the properties of the start and stop buttons

 <Button x:Name="start_btn" Clicked="startPanic" IsVisible="{Binding IsStartVisible}"> <Button.Text>START</Button.Text> </Button> <Button x:Name="stop_btn" IsVisible="{Binding IsStopVisible}"> <Button.Text>STOP</Button.Text> </Button> 

In the ViewModel write the following property and the like for the start button and set IsStopVisible = true / false based on your logic

private bool _isStopVisible;

  public bool IsStopVisible{ get { return _isStopVisible; } set { _isStopVisible= value; RaisePropertyChanged ("IsStopVisible"); } } 
+9
source

It should work fine. I copied your code and cleared it a bit, it shows the STOP button, then I

A few notes:

  • use a short property where <Button Text="X"/> possible, it's easier to read
  • when you add a XAML page, the IDE adds a .xaml.cs file to it and generates another .g.cs that you don’t see. The .g.cs file contains the generated code that finds all the x: Name'd elements and determines the placeholders for them, no need to search for them by name yourself
  • all events triggered by the user interface are executed in the user interface thread, you do not need to do this explicitly

Here XAML, the same as yours, is even stronger and added margin so that the button is visible

 <StackLayout Orientation="Vertical" Margin="20"> <Button x:Name="start_btn" Clicked="startPanic" Text="START" /> <Button x:Name="stop_btn" Text="STOP" IsVisible="false" /> </StackLayout> 

And the code behind:

 public partial class TestPage : ContentPage { public TestPage () { InitializeComponent (); } private void startPanic(object sender, EventArgs args){ Device.BeginInvokeOnMainThread (() => { start_btn.IsVisible = false; stop_btn.IsVisible = true; }); } } 
+1
source

Use the view visibility property.

for example, if u wants to make your button invisible, you can make

 if(condition) { button.Visibility=ViewStates.Invisible; } else { button.Visibility=ViewStates.Visible; } 
0
source

I may be late, but I also looked for it without success. This may be helpful for someone.

 objectView.SetValue(IsVisibleProperty, false); // the view is GONE, not invisible objectView.SetValue(IsVisibleProperty, true); 
0
source

All Articles