限制平移量以防止图像偏离窗口

时间:2015-10-14 20:39:48

标签: c# wpf xaml panning

引言:

我已将SVG导出为XAML,并且它变成了带有大量路径的Canvas。

在制作简单的自动生成窗口的Canvas主要内容后,图像被剪裁,因为它比主窗口的客户端矩形大。

我通过实施平移解决了这个问题。

由于我打算稍后进行缩放,我在Canvas的ScaleTransform中添加了虚拟XAML并将其RenderTransformOrigin更改为0.5 , 0.5(因此我可以缩放图像它的中心)。

我想在加载窗口时将图像置于中心位置,所以在调整了几个属性后,我将Canvas放在Viewbox中,看起来效果很好。

问题:

由于我更改了Canvas的RenderTransformOrigin,我无法弄清楚能够限制平移量的数学。

即使Viewbox是主窗口的内容,我也无法获得主窗口客户区的尺寸(Viewbox调整大小以适应其内容)。这使我的任务更加困难。

我努力解决这个问题:

除了使用P/InvokeGetClientRect WinAPI调用之外,似乎没有其他方法可以获取主窗口的客户端矩形。

还有另一个黑客查询SystemParametersInfo用于非客户端指标(如边框和标题栏),但估算可能因应用主题和类似内容而失败。

我还没有尝试使用P/Invoke,因为我现在只是拒绝这样做。必须有比这更好的解决方案!那条道路应该是我的最后选择,也是我绝望的选择。

我试图自己寻找替代方法,但失败了。

我尝试使用TransformToAncestor(...).Transformtobounds(..)进行计算,但也失败了。

问题:

如何限制平移,以便在用户拖得太多时图像不会从主窗口消失?

我会接受替代解决方案。提交的代码是一个缺乏经验,自学成才的初学者的尝试,所以我接受建设性的批评和建议。

相关信息:

为了使这篇文章尽可能短,我只提供相关的XAML和"代码"下面的片段。

完整代码粘贴在Pastebin上,可以在本文的最底部找到。

相关的XAML摘要:

<Window  x:Class="TestZaMapu.MainWindow" 
        Name="GlavniProzor" 
        WindowStartupLocation="CenterScreen"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" 
        Height="350" 
        Width="525" 
        MouseLeftButtonDown="GlavniProzor_MouseLeftButtonDown" 
        MouseLeftButtonUp="GlavniProzor_MouseLeftButtonUp" 
        MouseMove="GlavniProzor_MouseMove" 
        LostMouseCapture="GlavniProzor_LostMouseCapture">
    <Viewbox 
        Name="surface"
        Stretch="UniformToFill" 
        HorizontalAlignment="Center"
        VerticalAlignment="Center">
        <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
                Background="Blue" 
                x:Name="svg4306" 
                Width="494.44705" 
                Height="510.55356"
                <!-- needed in the future, for zooming around center-->
                RenderTransformOrigin="0.5, 0.5">
            <!--Unknown tag: metadata-->
            <Canvas.RenderTransform>
                <TransformGroup>
                    <!-- I intend to experiment with scaling in the future, so I added the below part -->
                    <ScaleTransform ScaleX="1" ScaleY="1"/>
                    <!-- I have used dependency properties for translation -->
                    <TranslateTransform X="{Binding TranslationFactorX, ElementName=GlavniProzor, Mode=TwoWay}" Y="{Binding TranslationFactorY, ElementName=GlavniProzor, Mode=TwoWay}"/>
                </TransformGroup>
            </Canvas.RenderTransform>
        <!-- Bunch of Path objects, omitted for brevity-->
        </Canvas>
    </Viewbox>
</Window>

片段背后的相关代码:

namespace TestZaMapu
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            TranslationFactorX = 0;
            TranslationFactorY = 0;
            isPanning = false;

        }

        // panning variables
        private Point ptOldPosition;
        private bool isPanning ;

        // dependency properties for translation along X and Y axes

        public static readonly DependencyProperty TranslateX =
            DependencyProperty.Register("TranslationFactorX", typeof(double), typeof(MainWindow));

        public static readonly DependencyProperty TranslateY =
            DependencyProperty.Register("TranslationFactorY", typeof(double), typeof(MainWindow));

        public double TranslationFactorX
        {
            get { return (double)GetValue(TranslateX); }
            set { SetValue(TranslateX, value); }
        }

        public double TranslationFactorY
        {
            get { return (double)GetValue(TranslateY); }
            set { SetValue(TranslateY, value); }
        }

        // mouse event handlers for panning

        private void GlavniProzor_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            base.OnMouseLeftButtonDown(e);
            if (isPanning )
                return;
            isPanning = this.CaptureMouse(); 
            ptOldPosition = e.GetPosition(this);
        }

        private void GlavniProzor_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            base.OnMouseLeftButtonUp(e);

            if (this.IsMouseCaptured)
            {
                this.ReleaseMouseCapture();
                isPanning = false;
            }
        }

        private void GlavniProzor_MouseMove(object sender, MouseEventArgs e)
        {
            base.OnMouseMove(e);

            if (isPanning )
            {
                Point ptNewPosition = e.GetPosition(this);

                if (ptNewPosition != ptOldPosition)
                {
                    Vector direction = ptOldPosition - ptNewPosition;

                    direction.X = TranslationFactorX - direction.X;
                    direction.Y = TranslationFactorY - direction.Y;

                    TranslationFactorX = direction.X;
                    TranslationFactorY = direction.Y;

                    ptOldPosition = ptNewPosition;
                }
            }
        }

        private void GlavniProzor_LostMouseCapture(object sender, MouseEventArgs e)
        {
            isPanning = false;
            this.OnLostMouseCapture(e);
        }
    }
}

Here是完整的XAML,here已完整且#34;代码落后于&#34;。

2 个答案:

答案 0 :(得分:1)

我真的没有读完整个问题(我想没人会),但这里是我在图表库中用来限制平移的代码。这是数学。现在加入你的情况。 提示:下次只输入相关代码,以便我们提供更好的答案。

我在平移结束时调用此方法(在我的情况下鼠标向上事件)

如果它有助于这是图书馆(https://github.com/beto-rodriguez/Live-Charts),也许你可以帮助你看到源代码。放松我认为你使它变得比它更难。

    private void PreventGraphToBeVisible()
    {
        var tt = Canvas.RenderTransform as TranslateTransform;
        if (tt == null) return;
        var eX = tt.X;
        var eY = tt.Y;
        var xOverflow = -tt.X + ActualWidth - Canvas.Width;
        var yOverflow = -tt.Y + ActualHeight - Canvas.Height;

        if (eX > 0)
        {
            tt.X = 0;
        }

        if (eY > 0)
        {
            tt.Y = 0;
        }

        if (xOverflow > 0)
        {
            tt.X = tt.X + xOverflow;
        }

        if (yOverflow > 0)
        {
            tt.Y = tt.Y + yOverflow;
        }
    }

答案 1 :(得分:1)

听起来很简单,但是如果你的目标是阻止你的矢量在分配给它的空间之外剪裁,为什么不把你的Viewbox的Stretch="UniformToFill"更改为{{1} }?