在WPF中的Popup中鼠标悬停时放大图像

时间:2016-03-16 13:44:08

标签: c# wpf image visual-studio-2012

大家好我已经通过不同的解决方案查看了几个论坛帖子,但似乎无法得到它。我的风格

<Style x:Key="ScaleStyle" TargetType="Image">
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Grid.ZIndex" Value="1"/>
                        <Setter Property="RenderTransform">
                            <Setter.Value>
                                <ScaleTransform ScaleX="2.5" ScaleY="2.5"/>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>      

我的UniformGrid图片:

<ListView Grid.ColumnSpan="5" Grid.Row="11" Name="Thumbnails">
                    <ListView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <UniformGrid Columns="5"/>                               
                        </ItemsPanelTemplate>                             
                    </ListView.ItemsPanel>
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <Image Style="{StaticResource ScaleStyle}" RenderTransformOrigin="0.5,0.5" Source="{Binding}" Height="100" Width="100" Margin="3">

                            </Image>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

这会使图像变大但在均匀网格内部,这使得它与其他图像重叠并且看起来不太好看。

另一方面,我尝试使用工具提示弹出窗口,它会打开一个新的弹出窗口,但里面的图像将是图像角落的巨大缩放。

<Image Name="Image" Source="/WpfApplication1;component/Images/Tulips.jpg" Height="100"
Stretch="Uniform">
<Image.ToolTip>
    <ToolTip DataContext="{Binding PlacementTarget, 
        RelativeSource={RelativeSource Self}}">
        <Border BorderBrush="Black" BorderThickness="1" Margin="5,7,5,5">
            <Image Source="{Binding Source}" Stretch="None" />
        </Border>
    </ToolTip>
</Image.ToolTip>

问题可能是原始图像非常大并且在统一网格中我将宽度和高度设置为100,这使得它们看起来像缩略图但工具提示似乎参考原始宽度和高度并从角落开始直到它适合工具提示弹出窗口的宽度和高度,最终只显示原始非常大的图片的一小部分。

非常感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

将图片的Stretch属性设置为fill会使图片大小调整为容器大小。