Question

我为图像定义了xaml，如下所示：

 <ControlTemplate>
                <Grid>                  
                    <Image x:Name="documentPage" Source="{Binding ImageSource}"
                            VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Stretch="Fill">    
                        <Image.LayoutTransform>
                            <TransformGroup>
                                <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}"/>
                            </TransformGroup>
                        </Image.LayoutTransform>
                    </Image>                     
                </Grid>
            </ControlTemplate>

和用于放大和缩小的按钮我将ScaleFactor递增0.1（放大）或递减0.1（缩小）。

现在我也想要应用翻转图像......就像垂直或水平翻转一样......我该怎么做？谢谢！

Answer 1

在您应用于LayoutTransform的TransformGroup中，您可以根据需要放置任意数量的缩放变换，您可以将另一个缩放变换绑定到属性。

<Image.LayoutTransform>
    <TransformGroup>
      <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}"/>
      <ScaleTransform ScaleX="-1" ScaleY="1"/>
    </TransformGroup>
</Image.LayoutTransform>

在第二个转换中，

而不是-1和1将它们绑定到viewmodel中的属性（显然，如果你的flipx和flipy属性是布尔值，则需要转换器）

在这里，我创建了一个简单的示例，使用转换器将布尔属性转换为比例转换ScaleX和ScaleY，显示问题的所有功能。

enter image description here

XAML

  <Window x:Class="flipx.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:local="clr-namespace:flipx"
            DataContext="{Binding RelativeSource={RelativeSource Self}}"
            Title="MainWindow" Height="350" Width="525">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="30"/>
            </Grid.RowDefinitions>
            <Ellipse Grid.Row="0"  Width="100" Height="100">
                <Ellipse.Fill>
                    <LinearGradientBrush >
                        <GradientStop Color="Red"/>
                        <GradientStop Color="#FF2300FF" Offset="1"/>
                    </LinearGradientBrush>
                </Ellipse.Fill>
                <Ellipse.LayoutTransform>
                    <TransformGroup>
                        <ScaleTransform ScaleX="{Binding ScaleFactor}" ScaleY="{Binding ScaleFactor}"/>
                        <ScaleTransform ScaleX="{Binding FlipX, Converter={local:BooleanToScaleConverter}}" ScaleY="{Binding FlipY, Converter={local:BooleanToScaleConverter}}"/>
                    </TransformGroup>
                </Ellipse.LayoutTransform>
            </Ellipse>

            <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center">
                <CheckBox Margin="5" IsChecked="{Binding FlipX}">FlipX</CheckBox>
                <CheckBox Margin="5" IsChecked="{Binding FlipY}">FlipY</CheckBox>         
                <Slider Minimum="0.001" Maximum="5" Value="{Binding ScaleFactor}" Width="150"/>
            </StackPanel>
        </Grid>

    </Window>

C＃

using System;
using System.Windows;
using System.Windows.Data;
using System.Windows.Markup;

namespace flipx
{
    public class BooleanToScaleConverter : MarkupExtension, IValueConverter
    {
        static BooleanToScaleConverter converter;

        public BooleanToScaleConverter() { }

        public override object ProvideValue(IServiceProvider serviceProvider)
        {
            if (converter == null) converter = new BooleanToScaleConverter();
            return converter;
        }

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            bool boolValue = (bool)value;
            return boolValue ? -1 : 1;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

    public partial class MainWindow : Window
    {
        public double ScaleFactor
        {
            get { return (double)GetValue(ScaleFactorProperty); }
            set { SetValue(ScaleFactorProperty, value); }
        }
        public static readonly DependencyProperty ScaleFactorProperty =
            DependencyProperty.Register("ScaleFactor", typeof(double), typeof(MainWindow), new PropertyMetadata(1d));

        public bool FlipX
        {
            get { return (bool)GetValue(FlipXProperty); }
            set { SetValue(FlipXProperty, value); }
        }
        public static readonly DependencyProperty FlipXProperty =
            DependencyProperty.Register("FlipX", typeof(bool), typeof(MainWindow), new PropertyMetadata(false));

        public bool FlipY
        {
            get { return (bool)GetValue(FlipYProperty); }
            set { SetValue(FlipYProperty, value); }
        }        
        public static readonly DependencyProperty FlipYProperty =
            DependencyProperty.Register("FlipY", typeof(bool), typeof(MainWindow), new PropertyMetadata(false));

        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

应用缩放并翻转图像wpf？

1 个答案: