Переключить поведение -ON -OFF с помощью изображения или метки -Связать изображение внутри списка в формах xamarin - PullRequest
Новая
       42

Переключить поведение -ON -OFF с помощью изображения или метки -Связать изображение внутри списка в формах xamarin

1 голос
/ 19 февраля 2020

Я хотел бы изменить источник изображения с white.png на blue.png, когда он будет нажат, мне нужно получить доступ к каждому параметру, когда изображение изменится на white.png и когда это blue.png, также .it будет полезно установить значение true или false, в зависимости от результата изображения.

все это придет в список. и мне нужно получить доступ к каждому человеку, который нажал.

Я пытался:

IValueConveter 

public class ConverterAddRemoveImage : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            bool isAddedToCart = (bool)value;
            if (isAddedToCart)
            {
                return "FilledIcon"; //This will be a string
            }
            else
            {
                return "EmptyIcon";  //This will be a string
            }
        }
    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }

Xaml 

<Image Source="{Binding IsAddedToCart, Converter={StaticResource AddRemoveImage}}"/>

Это только показывает мне другое, никогда не становится правдой. В идеале я хотел бы получить доступ к каждому из них и добавить к нему логи c и, очевидно, изменить изображение при каждом постукивании.

Второй подход - проблема здесь заключается в том, что касание происходит только один раз, и я не могу вернуться к предыдущему изображению со вторым касанием, а также я не знаю, как получить доступ к каждой команде. (Я хочу имитировать включение и выключение и на каждом из них что-то делать) 

public ImageSource ColorImage { get; set; }

Просмотр модели 

public ICommand SwitchIMGCommand
            {
                get;
                set;
            }



private void AddImg(object obj)
  {
     var selection = obj as ExistingModel;
     selection.ColorImage = "FilledIcon.png";**
     ColorImage= "FilledIcon.png";**I tried this and it doesnt change 
     to this img
  }



private ImageSource imagePath = "white.png";
        public ImageSource ColorImage
        {
            get { return imagePath; }
            set
            {
                imagePath = value;
                PropertyChanged(this, new PropertyChangedEventArgs("ColorImage"));
            }
        }

Конструктор 

SwitchIMGCommand = new Command(AddImg);

XAML 

<Image
    Source="{Binding ColorImage}">  
    <Image.GestureRecognizers>
    <TapGestureRecognizer
    Command="{Binding Source={x:Reference listView}, Path=BindingContext.SwitchIMGCommand}" CommandParameter="{Binding .} "
     NumberOfTapsRequired="1" />
     </Image.GestureRecognizers>
  </Image>

Ответы [ 4 ]

2 голосов
/ 20 февраля 2020

Кажется, что изображение находится в ViewCell списка:

Вы должны определить ColorImage в вашей модели. 

public class MyModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;


    private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    private string imagePath;
    public string ColorImage
    {
        get { return imagePath; }
        set
        {
            imagePath = value;
            NotifyPropertyChanged("ColorImage");
        }
    }


    //...other properties     

    public MyModel()
    {
       ColorImage = "white.png";
    }
}

в вашем представлении модель 

private void AddImg(object obj)
{
   var model = obj as MyModel;

   model.ColorImage = "imgcolorblue.png";

}
1 голос
/ 09 марта 2020

XAML с использованием DataTrigger - ChangeIsCheckedCommand изменяет свойство IsChecked: 

<Image>
  <Image.GestureRecognizers>
    <TapGestureRecognizer Command="{Binding ChangeIsCheckedCommand}" NumberOfTapsRequired="1" />
  </Image.GestureRecognizers>
  <Image.Triggers>
    <DataTrigger TargetType="Image" Binding="{Binding IsChecked}" Value="True">
      <Setter Property="Source" Value="{StaticResource OnImage}" />
    </DataTrigger>
    <DataTrigger TargetType="Image" Binding="{Binding IsChecked}" Value="False">
      <Setter Property="Source" Value="{StaticResource OffImage}" />
    </DataTrigger>
  </Image.Triggers>
</Image>

Resources для OnImage и OffImage: 

<OnPlatform x:Key="OnImage" x:TypeArguments="FileImageSource">
  <On Platform="Android">on.png</On>
  <On Platform="iOS">on.png</On>
  <On Platform="UWP">Assets/on.png</On>
</OnPlatform>

<OnPlatform x:Key="OffImage" x:TypeArguments="FileImageSource">
  <On Platform="Android">off.png</On>
  <On Platform="iOS">off.png</On>
  <On Platform="UWP">Assets/off.png</On>
</OnPlatform>
0 голосов
/ 04 марта 2020

Это дополнение к Lucas Zhang Anwser , которое является правильным способом сделать это, но в нем отсутствует переключатель Функциональность для преобразования обратно в исходную форму.

Вот чего не хватает:

1º - Добавить свойство bool для модели 

private bool _isCheckedState;
public bool IsCheckedState
{
    get { return _isCheckedState; }
    set
    {
        _isCheckedState= value;
        NotifyPropertyChanged("IsCheckedState");
    }
}

2º - Добавить проверку перед установкой ColorImage 

private void AddImg(object obj)
{
    var model = obj as MyModel;

    if(model.IsCheckedState)
        model.ColorImage = "white.png";
    else
        model.ColorImage = "imgcolorblue.png";

    model.IsCheckedState = !model.IsCheckedState;
}
0 голосов
/ 19 февраля 2020

Вы используете неправильный тип для вашего параметра "ColorImage". Источником изображения является тип ImageSource.

Если вы правильно установили изображения в своем проекте, следующий код должен решить вашу проблему 

private void AddImg(object obj)
{
    ColorImage = ImageSource.FromFile("imgcolorblue.png");
}

Измените также тип "ColorImage" с помощью ImageSource.

...