Привязка триггера изображения в GroupHeaderTemplate форм Xamarin не работает - PullRequest
Новая
       55

Привязка триггера изображения в GroupHeaderTemplate форм Xamarin не работает

1 голос
/ 07 мая 2019

Это шаблон заголовка группы.Привязка для триггера изображения в модели представления не работает.Я хочу изменить изображение в соответствии с постукивающим событием сгруппированного заголовка.Когда заголовок группы развернут, изображение должно быть ArrowDown, а когда заголовок группы свернут, изображение должно быть вверх ArrowUp 


                        <ListView.GroupHeaderTemplate>
                            <DataTemplate>
                                <ViewCell >
                                    <ContentView >
                                        <ContentView.GestureRecognizers>
                                            <TapGestureRecognizer Command="{Binding Source={x:Reference TheMainPage}, Path=BindingContext.HeaderSelectedCommand}" CommandParameter="{Binding .}" Tapped="TapGestureRecognizer_OnTapped"/>
                                        </ContentView.GestureRecognizers>
                                        <StackLayout Padding="15,12,15,12" Orientation="Horizontal"  BackgroundColor="{StaticResource DefaultBackgroundColor}">
                                            <StackLayout Orientation="Vertical" HorizontalOptions="Start">
                                                <Label Text="{Binding Key.EpisodeModel.EpisodeTitle}"  FontSize="16" TextColor="Black"/>
                                                <Label Text="{Binding Key.EpisodeModel.Department}" />
                                                <Label Text="{Binding Key.EpisodeModel.PeriodOfEpisode}"/>
                                            </StackLayout>
                                            <Label  BackgroundColor="{StaticResource LightAirColor}"  Text="{Binding Key.EpisodeModel.DocumentCount}" VerticalOptions="Center" HorizontalOptions="EndAndExpand" FontSize="Medium" TextColor="Black"/>

                                            <Image HeightRequest="15">
                                                <Image.Triggers>
                                                    <DataTrigger TargetType="Image" Binding="{Binding headerTappedImage}" Value="true">
                                                        <Setter Property="Source" Value="ArrowDown.png"></Setter>
                                                    </DataTrigger>
                                                    <DataTrigger TargetType="Image" Binding="{Binding headerTappedImage}" Value="false">
                                                        <Setter Property="Source" Value="ArrowDown.png"></Setter>
                                                    </DataTrigger>
                                                </Image.Triggers>
                                            </Image>

                                        </StackLayout>
                                    </ContentView>
                                </ViewCell>
                            </DataTemplate>
                        </ListView.GroupHeaderTemplate>

Это мой код 

 private bool _headerTappedImage;

        public bool headerTappedImage
        {
            get { return _headerTappedImage; }
            set { _headerTappedImage = value; OnPropertyChanged("headerTappedImage");}
        }




        public JournalHistoryViewPage(JournalHistoryPageViewModel journalHistoryPageViewModel) : base(
            journalHistoryPageViewModel)
        {
            headerTappedImage= false;
            InitializeComponent();
            _journalHistoryPageViewModel = journalHistoryPageViewModel;

            DocumentList.RefreshCommand = new Command(RefreshJournalHistoryPage);
        }

Логика ненаписано.но изображение должно быть показано в шаблоне заголовка.но это не показано.в чем причина?

1 Ответ

1 голос
/ 07 мая 2019

Если предположить, что BindingContext из LayoutRoot ниже совпадает с BindingContext из Page, триггеры могут использоваться, как предложено в вопросе: 

<StackLayout x:Name="LayoutRoot">
  <ListView x:Name="listView"
            ItemsSource="{Binding ItemsGroups}"
    ...
    <ListView.GroupHeaderTemplate>
      <DataTemplate>
        <ViewCell>
          <StackLayout>
            <StackLayout.GestureRecognizers>
              <TapGestureRecognizer Command="{Binding Source={x:Reference LayoutRoot}, 
                                                      Path=BindingContext.HeaderSelectedCommand}" 
                                    CommandParameter="{Binding .}" />
            </StackLayout.GestureRecognizers>
            ...
            <Image BackgroundColor="White">
              <Image.Triggers>
                <DataTrigger TargetType="Image" 
                             Binding="{Binding IsVisible}" Value="False">
                  <Setter Property="Source" 
                          Value="{OnPlatform Android=add_black.png, UWP=Assets/add_black.png}" />
                </DataTrigger>
                <DataTrigger TargetType="Image" 
                             Binding="{Binding IsVisible}" Value="True">
                  <Setter Property="Source" 
                          Value="{OnPlatform Android=remove_black.png, UWP=Assets/remove_black.png}" />
                </DataTrigger>
              </Image.Triggers>
            </Image>
            ...

Свойство IsVisible является частью Grouping, пример реализации: 

public class Grouping<K, T> : ObservableCollection<T>
{
    public K Key { get; private set; }

    private bool isVisible;

    public bool IsVisible
    {
        get { return isVisible; }
        set
        {
            isVisible = value;
            OnPropertyChanged(new PropertyChangedEventArgs(nameof(IsVisible)));
        }
    }

    public Grouping(K key, IEnumerable<T> items)
    {
        Key = key;
        foreach (var item in items)
            this.Items.Add(item);
    }
}

ItemsGroups может быть определено в ViewModel для BindingContext из LayoutRoot следующим образом, определение ItemViewModel не показано: 

public ObservableCollection<Grouping<string, ItemViewModel>> ItemsGroups { get; set; }

Группа предметов может быть добавлена ​​к ItemsGroups: 

var keyForGroupA = "A";
var itemsForGroupA = new ObservableCollection<ItemViewModel>();
var item1 = new ItemViewModel();
itemsForGroupA.Add(item1);
var item2 = new ItemViewModel();
itemsForGroupA.Add(item2);
...
ItemsGroups.Add(new Grouping<string, ItemViewModel>(keyForGroupA, itemsForGroupA);

Пример реализации HeaderSelectedCommand: 

// in constructor:
HeaderSelectedCommand = new Command(p => HeaderSelectedCommandExecute(p));

// property
public ICommand HeaderSelectedCommand { get; private set; }

// action
void HeaderSelectedCommandExecute(object p)
{
    var grp = (Grouping<string, ItemViewModel>)p;
    grp.IsVisible = !grp.IsVisible;
}
...