wpf - 滚动/适合带有复选框的图像

Question

我想显示图像并添加复选框“适合屏幕”-使图像适合可见区域。

为了使图像适合可见区域，我使用以下 xaml 片段:

<Image Source="{Binding Picture}" Stretch="Uniform"/>

要禁用适配并添加滚动，我使用以下 xaml 片段:

<ScrollViewer VerticalScrollBarVisibility="Auto" 
              HorizontalScrollBarVisibility="Auto">
    <Image Source="{Binding Picture}" Stretch="None"/>
</ScrollViewer>

问题是如何用滚动条将拟合尺寸和实际尺寸结合起来，并使用checkbox在两种状态之间切换？

更新:

问题在于代码 Image/@Stretch=Uniform行为方式与 Image/@Stretch=None 相同里面<ScrollViewer> 。在这两种情况下滚动都是可见的，并且图像以其实际大小显示。

详细信息。代码

<ScrollViewer VerticalScrollBarVisibility="Auto" 
              HorizontalScrollBarVisibility="Auto">
    <Image Source="{Binding Picture}" Stretch="Uniform" />
</ScrollViewer>

工作方式与

相同

<ScrollViewer VerticalScrollBarVisibility="Auto" 
              HorizontalScrollBarVisibility="Auto">
    <Image Source="{Binding Picture}" Stretch="None" />
</ScrollViewer>

Answer 1

创建一个值转换器，将复选框的选中状态转换为 Stretch.Unfiorm 或 Stretch.None。

public class StretchValueConverter : IValueConverter
{
  public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
  {
    return (bool)value ? Stretch.Uniform : Stretch.None;
  }

  public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
  {
    return value.Equals(Stretch.Uniform);
  }

}

然后在您的 XAML 中，您可以执行以下操作:

<Window.Resources>

  <local:StretchValueConverter x:Key="StretchValueConverter" />

</Window.Resources>

<CheckBox x:Name="FitToScreen" />

<ScrollViewer VerticalScrollBarVisibility="Auto" 
              HorizontalScrollBarVisibility="Auto">
    <Image Source="{Binding Picture}" Stretch="{Binding ElementName=FitToScreen Converter={StaticResource StretchValueConverter}, Path=Checked"/>
</ScrollViewer>

更新

您还需要将 Horizo​​ntalScrollBarVisibility 和 VerticalScrollBarVisibilty 设置为 Disabled 以强制滚动查看器的内容不超出边界。您可以使用另一个监听 Checkbox.Checked 属性的转换器或样式来执行此操作。

<Window x:Class="Overflow.Examples.Wpf.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <CheckBox x:Name="FitToScreen" Grid.Row="0" Content="Fit to screen" />

        <ScrollViewer Grid.Row="1">
            <Image Source="{Binding Picture}">
                <Image.Style>
                    <Style TargetType="Image">
                        <Setter Property="Stretch" Value="None" />
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding ElementName=FitToScreen, Path=IsChecked}" Value="True">
                                <Setter Property="Stretch" Value="Uniform" />
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Image.Style>
            </Image>

            <ScrollViewer.Style>
                <Style TargetType="ScrollViewer">
                    <Setter Property="HorizontalScrollBarVisibility" Value="Auto" />
                    <Setter Property="VerticalScrollBarVisibility" Value="Auto" />
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ElementName=FitToScreen, Path=IsChecked}" Value="True">
                            <Setter Property="HorizontalScrollBarVisibility" Value="Disabled" />
                            <Setter Property="VerticalScrollBarVisibility" Value="Disabled" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </ScrollViewer.Style>
        </ScrollViewer>
    </Grid>
</Window>