Windows Store 앱 돋보기

Question

Windows 8.1의 도면 앱에서 작업하고 있으며 사용자가 만지고있는 영역을 표시하는 간단한 방법이 필요했습니다.분명히 손가락을 사용하는 경우 도면을 볼 수있는 곳을 알기가 어렵습니다.내가해야 할 일은 대상 요소를 비트 맵으로 렌더링하고 사용자에게 디스플레이하여 도면의 위치를 볼 수있었습니다.내가 일어난 일은 아래 답변에 있습니다.

Answer 1

코드는 아래입니다.이를 사용하려면 원하는 곳에서 XAML (또는 프로그래밍 방식으로)에 컨트롤을 추가하고 대상 속성을 미리 볼 수있는 컨트롤로 설정하십시오.

예를 들어 WebView의 맨 위에 그림을 그리는 데 WebView를 대상으로 설정하고 돋보기를 웹뷰에 형제 자매로 추가했습니다.

public class Magnifier : Grid
{
    public Magnifier() : base()
    {
        this.Canvas = new Canvas();

        Border border = new Border();
        border.HorizontalAlignment = HorizontalAlignment.Left;
        border.VerticalAlignment = VerticalAlignment.Top;
        border.Child = this.Canvas;
        border.BorderBrush = new SolidColorBrush(Colors.Red);
        border.BorderThickness = new Thickness(10);
        border.Background = new SolidColorBrush(Colors.Black);

        this.Children.Add(border);

        this.border = border;
    }

    public async Task<object> Update(int x, int y)
    {
        this.Visibility = Visibility.Visible;

        // changes the amount of magnification
        int magnification = 2;

        // render the preview of the target
        RenderTargetBitmap bitmap = new RenderTargetBitmap();
        await bitmap.RenderAsync(this.Target);

        this.Canvas.Width = this.PreviewWidth;
        this.Canvas.Height = this.PreviewHeight;

        double w = this.PreviewWidth / (2 * magnification);
        double h = this.PreviewHeight / (2 * magnification);

        ImageBrush brush = new ImageBrush();
        brush.ImageSource = bitmap;

        double scaleX = this.Target.ActualWidth / this.PreviewWidth;
        double scaleY = this.Target.ActualHeight / this.PreviewHeight;

        TransformGroup transform = new TransformGroup();
        TranslateTransform translate = new TranslateTransform();
        translate.X = -(x - w) / scaleX;
        translate.Y = -(y - h) / scaleY;
        transform.Children.Add(translate);

        ScaleTransform scale = new ScaleTransform();
        scale.ScaleX = scaleX * magnification;
        scale.ScaleY = scaleY * magnification;

        transform.Children.Add(scale);

        brush.Transform = transform;

        Rectangle rect = new Rectangle();
        rect.Width = this.PreviewWidth;
        rect.Height = this.PreviewHeight;
        rect.Fill = brush;
        this.Canvas.Children.Clear();
        this.Canvas.Children.Add(rect);

        Ellipse centerDot = new Ellipse();
        centerDot.Width = 6;
        centerDot.Height = 6;
        centerDot.Fill = new SolidColorBrush(Colors.Red);

        Canvas.SetLeft(centerDot, this.PreviewWidth / 2 - 3);
        Canvas.SetTop(centerDot, this.PreviewHeight / 2 - 3);

        this.Canvas.Children.Add(centerDot);

        return null;
    }

    public Canvas Canvas { get; set; }
    public int PreviewWidth { get; set; }
    public int PreviewHeight { get; set; }
    private Border border = null;
    public FrameworkElement Target { get; set; }
}

.