Xaml 如何在显示菜单输出之前测试ListView.ItemTemplate的值
我使用MVVM Light开发了一个通用应用程序,我需要管理页面上的评论。 在这个页面上,我显示了一个评论列表,我想显示一个允许用户编辑或删除评论的菜单: 通过这个链接,当点击列表视图的一个项目时,我成功地显示了菜单 =>但我想仅当用户是所选评论的作者时才显示该菜单。。。 有办法做到这一点吗? 这是我的XAML:Xaml 如何在显示菜单输出之前测试ListView.ItemTemplate的值,xaml,listview,mvvm-light,win-universal-app,flyout,Xaml,Listview,Mvvm Light,Win Universal App,Flyout,我使用MVVM Light开发了一个通用应用程序,我需要管理页面上的评论。 在这个页面上,我显示了一个评论列表,我想显示一个允许用户编辑或删除评论的菜单: 通过这个链接,当点击列表视图的一个项目时,我成功地显示了菜单 =>但我想仅当用户是所选评论的作者时才显示该菜单。。。 有办法做到这一点吗? 这是我的XAML: <ListView x:Name="myComments" ItemsSource="{Binding Comments}"
<ListView x:Name="myComments"
ItemsSource="{Binding Comments}"
IsItemClickEnabled="True"
SelectionMode="Single"
SelectedItem="{Binding SelectedComment}"
ContinuumNavigationTransitionInfo.ExitElementContainer="True">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
HorizontalAlignment="Stretch" VerticalAlignment="Center"
TextAlignment="Left"
Margin="0"
Foreground="{StaticResource ThemeBrush}"
Style="{StaticResource ListViewItemSubheaderTextBlockStyle}" />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
HorizontalAlignment="Stretch" VerticalAlignment="Center"
TextAlignment="Right"
Margin="0"
Foreground="{StaticResource ThemeBrush}"
Style="{StaticResource ListViewItemSubheaderTextBlockStyle}" />
</Grid>
<!-- 3. Content -->
<TextBlock Text="{Binding content}"
TextAlignment="Left"
TextWrapping="Wrap"
Margin="0"
Foreground="Black"
FontSize="20"
Style="{StaticResource GroupHeaderTextBlockStyle}" />
<!-- MenuFlyout - with Commands -->
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyout.MenuFlyoutPresenterStyle>
<Style TargetType="MenuFlyoutPresenter">
<Setter Property="Background" Value="{StaticResource ThemeBrush}"/>
</Style>
</MenuFlyout.MenuFlyoutPresenterStyle>
<MenuFlyoutItem Text="Edit"
Command="Binding ElementName=MyPage, Path=DataContext.EditCommentCommand}"/>
<MenuFlyoutItem Text="Delete"
Command="{Binding ElementName=MyPage, Path=DataContext.DeleteCommentCommand}"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<!-- Behavior -->
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Tapped">
<local:OpenFlyoutAction />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
public class OpenFlyoutAction : DependencyObject, IAction
{
public object Execute(object sender, object parameter)
{
FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);
return null;
}
}
public class CommentsTemplateSelector : DataTemplateSelector
{
public DataTemplate UserComment { get; set; }
public DataTemplate NoUserComment { get; set; }
protected override DataTemplate SelectTemplateCore(object item)
{
Commentaire comment = (Commentaire)item;
if (comment.isAuthor)
return UserComment;
else
return NoUserComment;
}
}
<ListView.ItemTemplateSelector>
<ts:CommentsTemplateSelector>
<!-- UserComment : with MenuFlyout -->
<ts:CommentsTemplateSelector.UserComment>
<DataTemplate>
<Border Tapped="Border_Tapped">
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
... />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
... />
</Grid>
...
</StackPanel>
<!-- MenuFlyout -->
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyout.MenuFlyoutPresenterStyle>
<Style TargetType="MenuFlyoutPresenter">
<Setter Property="Background" Value="{StaticResource ThemeBrush}"/>
</Style>
</MenuFlyout.MenuFlyoutPresenterStyle>
<MenuFlyoutItem Text="Edit"
Command="{Binding ElementName=CommentsPage, Path=DataContext.EditCommentCommand}" />
</MenuFlyoutItem>
<MenuFlyoutItem Text="Delete"
Command="{Binding ElementName=CommentsPage, Path=DataContext.DeleteCommentCommand}" />
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Tapped">
<local:OpenFlyoutAction />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</Border>
</DataTemplate>
</ts:CommentsTemplateSelector.UserComment>
<!-- NoUserComment : without MenuFlyout -->
<ts:CommentsTemplateSelector.NoUserComment>
<DataTemplate>
<Border Background="Red">
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
... />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
... />
</Grid>
...
</StackPanel>
</Border>
</DataTemplate>
</ts:CommentsTemplateSelector.UserComment>
</ts:CommentsTemplateSelector>
<ListView.ItemTemplateSelector>
=>是否可以直接在ViewModel中显示弹出型按钮而不是隐藏代码?
我首先创建了另一个主题,因为我在菜单应用项和命令上遇到了一个问题:
请告诉我是否必须继续讨论另一个主题并删除此主题。作为对DataTemplateSelector上Depechie答案的补充,以下是我所做的: 我创建了一个名为“CommentsTemplateSelector”的DataTemplateSelector类: 我在页面资源中声明此DataTemplateSelector及其关联模板:
<Page.Resources>
<!-- TemplateSelectors -->
<ts:CommentsTemplateSelector x:Key="CommentsTemplateSelector" />
<!-- DataTemplates -->
<!-- UserComment : with MenuFlyout -->
<DataTemplate x:Key="UserComment">
<Border Tapped="Border_Tapped">
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
... />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
... />
</Grid>
...
</StackPanel>
<!-- MenuFlyout -->
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyout.MenuFlyoutPresenterStyle>
<Style TargetType="MenuFlyoutPresenter">
<Setter Property="Background" Value="{StaticResource ThemeBrush}"/>
</Style>
</MenuFlyout.MenuFlyoutPresenterStyle>
<MenuFlyoutItem Text="Edit"
Command="{Binding ElementName=CommentsPage, Path=DataContext.EditCommentCommand}" />
</MenuFlyoutItem>
<MenuFlyoutItem Text="Delete"
Command="{Binding ElementName=CommentsPage, Path=DataContext.DeleteCommentCommand}" />
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Tapped">
<local:OpenFlyoutAction />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</Border>
</DataTemplate>
<!-- NoUserComment : without MenuFlyout -->
<DataTemplate x:Key="NoUserComment">
<Border Tapped="Border_Tapped" Background="Red">
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
... />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
... />
</Grid>
...
</StackPanel>
</Border>
</DataTemplate>
...
<Page.Resources>
...
...
...
最后,我将我的列表视图的ItemTemplateSelector影响到DataTemplateSelector:
<ListView x:Name="myCommentaires"
ItemsSource="{Binding Commentaires}"
IsItemClickEnabled="True"
ItemTemplateSelector="{StaticResource CommentsTemplateSelector}"
SelectionMode="Single"
SelectedItem="{Binding SelectedCommentaire, Mode=TwoWay}"
ContinuumNavigationTransitionInfo.ExitElementContainer="True">
启动应用程序时,我进入“CommentsTemplateSelector”类,它工作正常,列表视图只显示每个项目的型号名称:
因此,我认为DataTemplates中存在绑定问题,但问题是什么?在monvig将页面资源中的模板添加到ListView中后,它终于工作了。ItemTemplateSelector:
<ListView x:Name="myComments"
ItemsSource="{Binding Comments}"
IsItemClickEnabled="True"
SelectionMode="Single"
SelectedItem="{Binding SelectedComment}"
ContinuumNavigationTransitionInfo.ExitElementContainer="True">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
HorizontalAlignment="Stretch" VerticalAlignment="Center"
TextAlignment="Left"
Margin="0"
Foreground="{StaticResource ThemeBrush}"
Style="{StaticResource ListViewItemSubheaderTextBlockStyle}" />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
HorizontalAlignment="Stretch" VerticalAlignment="Center"
TextAlignment="Right"
Margin="0"
Foreground="{StaticResource ThemeBrush}"
Style="{StaticResource ListViewItemSubheaderTextBlockStyle}" />
</Grid>
<!-- 3. Content -->
<TextBlock Text="{Binding content}"
TextAlignment="Left"
TextWrapping="Wrap"
Margin="0"
Foreground="Black"
FontSize="20"
Style="{StaticResource GroupHeaderTextBlockStyle}" />
<!-- MenuFlyout - with Commands -->
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyout.MenuFlyoutPresenterStyle>
<Style TargetType="MenuFlyoutPresenter">
<Setter Property="Background" Value="{StaticResource ThemeBrush}"/>
</Style>
</MenuFlyout.MenuFlyoutPresenterStyle>
<MenuFlyoutItem Text="Edit"
Command="Binding ElementName=MyPage, Path=DataContext.EditCommentCommand}"/>
<MenuFlyoutItem Text="Delete"
Command="{Binding ElementName=MyPage, Path=DataContext.DeleteCommentCommand}"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<!-- Behavior -->
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Tapped">
<local:OpenFlyoutAction />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
public class OpenFlyoutAction : DependencyObject, IAction
{
public object Execute(object sender, object parameter)
{
FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);
return null;
}
}
public class CommentsTemplateSelector : DataTemplateSelector
{
public DataTemplate UserComment { get; set; }
public DataTemplate NoUserComment { get; set; }
protected override DataTemplate SelectTemplateCore(object item)
{
Commentaire comment = (Commentaire)item;
if (comment.isAuthor)
return UserComment;
else
return NoUserComment;
}
}
<ListView.ItemTemplateSelector>
<ts:CommentsTemplateSelector>
<!-- UserComment : with MenuFlyout -->
<ts:CommentsTemplateSelector.UserComment>
<DataTemplate>
<Border Tapped="Border_Tapped">
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
... />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
... />
</Grid>
...
</StackPanel>
<!-- MenuFlyout -->
<FlyoutBase.AttachedFlyout>
<MenuFlyout>
<MenuFlyout.MenuFlyoutPresenterStyle>
<Style TargetType="MenuFlyoutPresenter">
<Setter Property="Background" Value="{StaticResource ThemeBrush}"/>
</Style>
</MenuFlyout.MenuFlyoutPresenterStyle>
<MenuFlyoutItem Text="Edit"
Command="{Binding ElementName=CommentsPage, Path=DataContext.EditCommentCommand}" />
</MenuFlyoutItem>
<MenuFlyoutItem Text="Delete"
Command="{Binding ElementName=CommentsPage, Path=DataContext.DeleteCommentCommand}" />
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
<i:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Tapped">
<local:OpenFlyoutAction />
</core:EventTriggerBehavior>
</i:Interaction.Behaviors>
</Border>
</DataTemplate>
</ts:CommentsTemplateSelector.UserComment>
<!-- NoUserComment : without MenuFlyout -->
<ts:CommentsTemplateSelector.NoUserComment>
<DataTemplate>
<Border Background="Red">
<StackPanel Margin="0,0,19,12"
HorizontalAlignment="Stretch">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- 1. Author -->
<TextBlock Grid.Column="0"
Text="{Binding name}"
... />
<!-- 2. Date -->
<TextBlock Grid.Column="1"
Text="{Binding date, Converter={StaticResource DateToStringConverter}}"
... />
</Grid>
...
</StackPanel>
</Border>
</DataTemplate>
</ts:CommentsTemplateSelector.UserComment>
</ts:CommentsTemplateSelector>
<ListView.ItemTemplateSelector>
...
...
我不知道为什么它没有进入页面的资源中,因为我发现了一些类似这样的示例…我猜您有两个选项,一个是使用DataTemplateSelector,使用两个不同的datatemplates(一个有弹出框,一个没有弹出框),另一个是传递一个参数(一个类似布尔的IsAuthor,通过您的模型/视图模型填充)添加到eventtrigger,以便您可以验证是否在execute中实际显示弹出按钮method@Depechie我尝试使用DataTemplateSelector,但它不起作用:ListView现在将项显示为“SolutionName.Model.Comment”,而不是使用DataTemplate。我在回答中给你更多的细节,因为我不能在这里发布代码。