wpf - WPF：鼠标悬停时使卡片更大一点

Question

我正在使用 XAML (MDIX) 中的材料设计来创建材料设计列表：卡片。当鼠标悬停在卡片上时，我想让每张卡片更大一点。

代码：

         <ListView ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                   ItemsSource="{Binding List}"
                   SelectedItem="{Binding Item}">

            <ListView.ItemsPanel>
               <ItemsPanelTemplate>
                  <WrapPanel HorizontalAlignment="Center"
                             VerticalAlignment="Center" />
               </ItemsPanelTemplate>
            </ListView.ItemsPanel>

            <ListView.ItemTemplate>
               <DataTemplate>
                  <materialDesign:Card Width="225" Height="400" Margin="10" >
                     <Grid />
                  </materialDesign:Card>
               </DataTemplate>
            </ListView.ItemTemplate>
         </ListView>

标签： wpfmaterial-designmouseeventmouseover

Answer 1

您应该将以下代码写入您的ListView

<ListView.ItemContainerStyle>
   <Style TargetType="{x:Type ListViewItem}">
      <Style.Triggers>
         <Trigger Property="IsMouseOver"
                  Value="True">
            <Setter Property="RenderTransform">
               <Setter.Value>
                  <ScaleTransform ScaleX="1.05"
                                    ScaleY="1.05" />
               </Setter.Value>
            </Setter>
         </Trigger>
      </Style.Triggers>
   </Style>
</ListView.ItemContainerStyle>