admin管理员组

文章数量:1410737

I have an ItemesView with binding collection. I styled the DataTemplate for it with root element ItermContainer, but at attempt to provide some VisualState for it it just doesn't work. How to make DataTemplate react on interactions like: MouseOver(PointOver) or Pressed?

I've also tried to provide it with ItemContaienr.Triggers but all of them for some reasons lead to exception in attempt to launch application.

Here is my code which I tried to use:

<ItemsView Grid.Row="1" SelectionMode="Single" Margin="0,10,0,0"
       ItemsSource="{Binding Items, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" >
<i:Interaction.Behaviors>
    <i:EventTriggerBehavior EventName="Loaded">
        <i:InvokeCommandAction Command="{Binding LoadedCommand}"/>
    </i:EventTriggerBehavior>
</i:Interaction.Behaviors>
<ItemsView.Layout>
    <LinedFlowLayout ItemsStretch="Fill" LineSpacing="5" MinItemSpacing="5"/>
</ItemsView.Layout>
<ItemsView.ItemTemplate>
    <DataTemplate x:DataType="vm:CourseContainerViewModel">
        <ItemContainer HorizontalContentAlignment="Center" VerticalContentAlignment="Center" CornerRadius="10">
            <Border Background="{StaticResource ButtonBackgroundThemeBrush}">
                <Grid x:Name="RootElement">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Border Grid.Row="0" Width="150" Height="150" CornerRadius="10">
                        <Border.Background>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                                <GradientStop Color="#ff1b6b" Offset="0.0" />
                                <GradientStop Color="#45caff" Offset="1.0" />
                            </LinearGradientBrush>
                        </Border.Background>
                        <Viewbox Grid.Row="0" Width="80">
                            <SymbolIcon Symbol="Pictures" Opacity="0.6"/>
                        </Viewbox>
                    </Border>
                    <TextBlock Grid.Row="1" HorizontalAlignment="Left" TextAlignment="Center" Margin="3,6,0,6" 
                               FontWeight="Medium" Opacity="1" FontSize="14" Foreground="#fff"
                               Text="{Binding Name, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"/>

                    <Button x:Name="CourseMenuButton" Background="Transparent" BorderBrush="Transparent" 
                            Visibility="Collapsed"
                            VerticalAlignment="Top" HorizontalAlignment="Right" Margin="5" Padding="3">
                        <SymbolIcon Symbol="More"/>
                        <Button.Flyout>
                            <MenuFlyout Placement="BottomEdgeAlignedLeft">
                                <MenuFlyoutItem Text="Delete"/>
                            </MenuFlyout>
                        </Button.Flyout>
                    </Button>
                </Grid>
                <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="CommonStates">
                        <VisualState x:Name="Normal"/>
                        <VisualState x:Name="PointerOver">
                            <VisualState.Setters>
                                <Setter Target="CourseMenuButton.Visibility" Value="Visible"/>
                                <Setter Target="RootElement.Background" Value="Red"/>
                            </VisualState.Setters>
                        </VisualState>
                        <VisualState x:Name="Pressed">
                            <VisualState.Setters>
                                <Setter Target="CourseMenuButton.Visibility" Value="Visible"/>
                                <Setter Target="RootElement.Background" Value="Red"/>
                            </VisualState.Setters>
                        </VisualState>
                        <VisualState x:Name="Selected">
                            <VisualState.Setters>
                                <Setter Target="CourseMenuButton.Visibility" Value="Visible"/>
                                <Setter Target="RootElement.Background" Value="Red"/>
                            </VisualState.Setters>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>
            </Border>
        </ItemContainer>
    </DataTemplate>
</ItemsView.ItemTemplate>

本文标签: xamlHow to make item with styled DataTemplate react on Visual states WinUIStack Overflow