3

ユーザーが指で拡大縮小している間 (つまり、ピンチ)、シーンを拡大縮小 (ズーム) する必要があるサーフェス アプリを実行しています。

現在、問題なく動作していますが、ユーザーの指の間の中心点を拡大する必要があるという問題があります。

要点はわかりますが、翻訳の背後にある数学を把握するのは困難です。

キャンバス シーンに を適用するScaleTransformと、キャンバスの左上がズームインします。ピンチ ジェスチャの中心点をズームインする必要があります (これもありました)。

ズームがジェスチャの中心点にズームインしているように見えるようにするには、変換の計算はどのように機能するでしょうか?

編集：

これは基本的に私が持っているものです:

void Affine2DManipulationDelta(object sender, Affine2DOperationDeltaEventArgs e)
{
    //apply zoom and translate
    if (e.ScaleDelta != 1)
        ApplyZoom(e);
    else if (e.Delta.Length != 0)
        ApplyTranslation(e);
}

private void ApplyZoom(Affine2DOperationDeltaEventArgs e)
{
    //scale
    var newScale = _zoomTransform.ScaleX * e.ScaleDelta;
    newScale = GetCappedZoomLevel(newScale);

    _zoomTransform.ScaleX = newScale;
    _zoomTransform.ScaleY = newScale;
}

private void ApplyTranslation(Affine2DOperationDeltaEventArgs e)
{
    var xDiff = e.ManipulationOrigin.X - _screenStartPoint.X;
    var yDiff = e.ManipulationOrigin.Y - _screenStartPoint.Y;

    var translateX = xDiff + _startOffset.X;
    var translateY = yDiff + _startOffset.Y;

    //bounds testing to limit translation
    var rect = new Rect(0.0, 0.0, ZoomCanvas.RenderSize.Width, ZoomCanvas.RenderSize.Height);
    Rect bounds = ZoomCanvas.TransformToAncestor(MainViewportCanvas).TransformBounds(rect);

    if (CanTranslateX(translateX, bounds))
        _translateTransform.X = translateX;

    if (CanTranslateY(translateY, bounds))
        _translateTransform.Y = translateY;
}

かなり基本的ですが、ある程度は機能します...

_zoomTransform は でScaleTransform、_translateTransform はTranslateTransform

MainViewport は、変換を適用するキャンバスである ZoomCanvas を含むキャンバスです。

4

2 に答える 2

1

私はまさにこれを自分でしなければなりませんでした。基本的には、任意のコンテンツをホストし、ユーザーが (ジェスチャを使用して) パンおよびズームできる Surface コントロールです。私の操作プロセッサのハンドラーをAffine2DManipulationDelta以下に示します。うまくいけば、それはかなり自明であり、必要な場所にたどり着きます.

private void OnManipulationDelta(object sender, Affine2DOperationDeltaEventArgs e)
{
    Debug.Assert(_scrollViewer != null);

    if (CanScale && _scrollViewer != null && e.ScaleDelta != 1)
    {
        var scrollViewerContent = _scrollViewer.Content as UIElement;

        //can't do anything if the content isn't present and isn't a UIElement
        if (scrollViewerContent != null)
        {
            var newScale = Scale * e.ScaleDelta;

            newScale = Math.Max(MinScale, newScale);
            newScale = Math.Min(MaxScale, newScale);

            var origin = e.ManipulationOrigin;
            var pointInContent = _scrollViewer.TranslatePoint(origin, scrollViewerContent);

            var deltaScale = newScale - Scale;
            //width and height changes across the whole image
            var deltaWidth = deltaScale * _scrollViewer.ExtentWidth;
            var deltaHeight = deltaScale * _scrollViewer.ExtentHeight;
            //width and height changes relative to the point in the scroll viewer's content
            deltaWidth = (pointInContent.X / _scrollViewer.ExtentWidth) * deltaWidth;
            deltaHeight = (pointInContent.Y / _scrollViewer.ExtentHeight) * deltaHeight;

            _offset = Vector.Add(_offset, new Vector(deltaWidth, deltaHeight));
            var centerPoint = new Point(origin.X + deltaWidth, origin.Y + deltaHeight);
            centerPoint.Offset(_offset.X, _offset.Y);

            Scale = newScale;

            HorizontalOffset = _scrollViewer.HorizontalOffset + deltaWidth;
            VerticalOffset = _scrollViewer.VerticalOffset + deltaHeight;
        }
    }
    else if (CanPan && e.Delta.Length != 0)
    {
        var newHorizontalOffset = _scrollViewer.HorizontalOffset + (e.Delta.X * -1);
        var newVerticalOffset = _scrollViewer.VerticalOffset + (e.Delta.Y * -1);
        newHorizontalOffset = Math.Max(0, newHorizontalOffset);
        newVerticalOffset = Math.Max(0, newVerticalOffset);
        HorizontalOffset = newHorizontalOffset;
        VerticalOffset = newVerticalOffset;
    }
}
于 2010-01-27T09:20:52.630 に答える