Question

这是组标题模板。视图模型中图像触发器的绑定不起作用。我想根据分组标题的轻按事件更改图像。展开组标题时，图像应为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);
        }

未编写逻辑。但图片应显示在标题模板中。但未显示。是什么原因呢？

Answer 1

假定下面BindingContext的{{1}}与LayoutRoot的{{1}}相同，则可以按照问题中的建议使用触发器：

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); } }的{{1}}的{{1}}中定义，如下所示，ItemsGroups的定义未显示：

ViewModel

可能将一组项目添加到BindingContext：

LayoutRoot

ItemViewModel的示例实现：

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

Xamarin Forms的GroupHeaderTemplate中的图像触发器绑定不起作用

1 个答案: