WP7 学习之MultiScaleImage控件运用

WP7 学习之MultiScaleImage控件使用

xaml:

<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Image/appbar.basecircle.rest.png" Text="full" Click="abbFull_Click"/>
            <shell:ApplicationBarIconButton IconUri="/Image/appbar.favs.addto.rest.png" Text="Original" Click="abbOri_Click"/>
            <shell:ApplicationBarIconButton IconUri="/Image/appbar.favs.rest.png" Text="zoomin" Click="abbZoomIn_Click"/>
            <shell:ApplicationBarIconButton IconUri="/Image/appbar.feature.settings.rest.png" Text="zoomout" Click="abbZoomOut_Click"/>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

multiscaleImage 控件的Source的路径是要web路径

dzc_output.xml是张图片，要用Deep Zoom Composer工具生成

cs:

public partial class MultiScaleImage : PhoneApplicationPage
{

        private double zoom = 1;
        private bool isMoving = false;
        private bool isDown = false;
        private Point lastMouseDownPos = new Point();
        private Point lastMousePos = new Point();
        private Point lastMouseViewPort = new Point();

        public MultiScaleImage()
        {
            InitializeComponent();
        }

        //成功加载事件
        private void multiScaleImage1_ImageOpenSucceeded(object sender, RoutedEventArgs e)
        {
            //成功加载后固定初始位置
            multiScaleImage1.ViewportOrigin = new Point(0, 0);
            multiScaleImage1.ViewportWidth = 1;
        }

        private void PhoneApplicationPage_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            //获取按下时图像坐标位置
            lastMouseDownPos = e.GetPosition(multiScaleImage1);
            //获取视区中心点位置
            lastMouseViewPort = multiScaleImage1.ViewportOrigin;
            //标识用户已经按下了 down
            isDown = true;
            //开始获取
            multiScaleImage1.CaptureMouse();
        }

        private void PhoneApplicationPage_MouseMove(object sender, MouseEventArgs e)
        {
            //获取移动的时候图像的坐标位置
            lastMousePos = e.GetPosition(multiScaleImage1);
            //条件为按下了和没在移动中才进入
            if (isDown && !isMoving)
            {
                //设为在移动
                isMoving = true;

                //获取视区窗口大小
                double w = multiScaleImage1.ViewportWidth;
                //获取视区窗口的坐标位置
                Point p = new Point(multiScaleImage1.ViewportOrigin.X, multiScaleImage1.ViewportOrigin.Y);
                //设置暂时还没移动效果
                multiScaleImage1.UseSprings = false;
                //把获取好的坐标值赋值
                multiScaleImage1.ViewportOrigin = new Point(p.X, p.Y);
                //把获取到的视区宽度赋值
                multiScaleImage1.ViewportWidth = w;
                //设置变焦数
                zoom = 1 / w;
                //启动移动效果
                multiScaleImage1.UseSprings = true;
            }
            //正在移动
            if (isMoving)
            {
                //将获取到按下时视区的中心位置
                Point point = lastMouseViewPort;
                //进行坐标进行
                point.X = (lastMouseDownPos.X - lastMousePos.X) / multiScaleImage1.ActualWidth * multiScaleImage1.ViewportWidth;
                point.Y = (lastMouseDownPos.Y - lastMousePos.Y) / multiScaleImage1.ActualWidth * multiScaleImage1.ViewportWidth;
                //将计算好的视区坐标进行赋值
                multiScaleImage1.ViewportOrigin = point;
            }

}

        private void PhoneApplicationPage_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            if (isMoving)
            {
                bool isShift = (Keyboard.Modifiers & ModifierKeys.Shift) == ModifierKeys.Shift;
                double newzoom = zoom;
                if (isShift)
                {
                    newzoom /= 2;
                }
                else
                {
                    newzoom *= 2;
                }

            }
            isMoving = false;
            isDown = false;
            Zoom(zoom, multiScaleImage1.ElementToLogicalPoint(this.lastMousePos));
            multiScaleImage1.ReleaseMouseCapture();
        }

        private void Zoom(double newzoom, Point p)
        {
            if (newzoom < 0.5)
            {
                newzoom = 0.5;
            }
            multiScaleImage1.ZoomAboutLogicalPoint(newzoom / zoom, p.X, p.Y);
            zoom = newzoom;
        }

        private void abbFull_Click(object sender, EventArgs e)
        {
            multiScaleImage1.ZoomAboutLogicalPoint(3, 0, 0);
        }

        private void abbOri_Click(object sender, EventArgs e)
        {
            this.multiScaleImage1.ViewportWidth = 1;
            this.multiScaleImage1.ViewportOrigin = new Point(0, 0);
        }

        private void abbZoomIn_Click(object sender, EventArgs e)
        {
            Zoom(zoom * 1.3, multiScaleImage1.ElementToLogicalPoint(new Point(0.5 * multiScaleImage1.ActualWidth, 0.5 * multiScaleImage1.Height)));
        }

        private void abbZoomOut_Click(object sender, EventArgs e)
        {
            Zoom(zoom / 1.3, multiScaleImage1.ElementToLogicalPoint(new Point(0.5 * multiScaleImage1.ActualWidth, 0.5 * multiScaleImage1.Height)));
        }

}

WP7 学习之MultiScaleImage控件运用

相关推荐