Image flip flop

Hello everyone,

I have a label and an image within a listview.
I want to hide the image or show it with every click on the listView row.

Can someone help me ?

Tagged:

Best Answer

Answers

  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭
    Set the IsVisible property to true or false on SelectedItem and use Bindings
  • Have an example ?

  • LeonLuLeonLu Member, Xamarin Team Xamurai
    edited August 16

    @nilmarpubliogmailcom Do you want to achieve this result?

    Here is code of listview

       <ListView x:Name="mylistview" ItemsSource="{Binding persons}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout>
    
                            <Label Text="{Binding Name ,Mode=TwoWay}"   />
    
                            <Image Source="Clover.png" IsVisible="{Binding Changed,Mode=TwoWay}"/>
                        </StackLayout>
    
                    </ViewCell>
                </DataTemplate>
    
            </ListView.ItemTemplate>
        </ListView>
    

    Add the properties in your model. I add Changed property in the model.

         public class Person: INotifyPropertyChanged
    {
        bool _changed=false;
        public bool Changed {
            get {
                return _changed;
            }
    
            set
            {
                if (_changed != value)
                {
                    _changed = value;
                    OnPropertyChanged("Changed");
    
                }
            }
    
        }
    
        string name;
        public string Name
        {
            set
            {
                if (name != value)
                {
                    name = value;
                    OnPropertyChanged("Name");
    
                }
            }
            get
            {
                return name;
            }
        }
    
        public event PropertyChangedEventHandler PropertyChanged;
    
        protected virtual void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    
    }
    

    Here is background code of the listview.

        public partial class MainPage : ContentPage
    {
    
        public MainPage()
        {
           InitializeComponent();
    
    
            mysl.BindingContext= new PersonsViewModel(); ;
    
            mylistview.ItemTapped += Mylistview_ItemTapped;
        }
    
        private void Mylistview_ItemTapped(object sender, ItemTappedEventArgs e)
        {
            var person=(Person)e.Item;
            person.Changed = !person.Changed;
    
        }
    }
    

    Here is viewModel

      public class PersonsViewModel
    {
     public ObservableCollection<Person> persons { get; set; }
        public ICommand ChangeValueCommand { protected set; get; }
        public ICommand AddValueCommand { protected set; get; }
        public PersonsViewModel()
        {
            persons = new ObservableCollection<Person>();
            persons.Add(new Person() { Name=  "Leon1"   });
            persons.Add(new Person() { Name = "Leon2" });
            persons.Add(new Person() { Name = "Leon3" });
            persons.Add(new Person() { Name = "Leon4" });
            persons.Add(new Person() { Name = "Leon5" });
            ChangeValueCommand = new Command<Person>((key) =>
            {
                persons[0].Name = "ssssssssssss";
                persons[0].Changed = true;
    
            });
            AddValueCommand=new Command<Person>((key) =>
            {
                persons.Add(new Person() { Name = "add" });
    
            });
    
        }
    }
    

    I upload my demo to you. you can refer to it

  • Thanks Leon

  • Thanks Leon

Sign In or Register to comment.