wp7屏幕地图

实际大小超出屏幕范围时,显示屏幕对应的位置,如图

wp7屏幕地图

具体代码如下:

<Grid x:Name="LayoutRoot">

        <Border BorderBrush="AliceBlue" HorizontalAlignment="Right" BorderThickness="5" VerticalAlignment="Top"  Height="330" Width="250" >

            <Canvas>

                <Image Canvas.Left="0" Canvas.Top="0" Name="img" Height="320" Width="240" Stretch="Fill"/>

                <Rectangle Name="rcLocation" Canvas.Left="0" Canvas.Top="0" Canvas.ZIndex="1" Stroke="Red"  Height="10" Width="180"/>

            </Canvas>

        </Border>

        <ScrollViewer  Name="sc" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden">

            <StackPanel Width="600" Name="content">

                <TextBlock Text="windows phone:"/>

                <TextBox Width="200" HorizontalAlignment="Left"/>

                <TextBlock Text="windows phone:"/>

                <TextBox Width="200" HorizontalAlignment="Left"/>

                <TextBlock Text="windows phone:"/>

                <TextBox Width="200" HorizontalAlignment="Left"/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

                <TextBlock Text="windows phone:"/>

                <TextBox/>

            </StackPanel>

        </ScrollViewer>

    </Grid>
public partial class MainPage : PhoneApplicationPage

    {

        // Constructor

        public MainPage()

        {

            InitializeComponent();

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

        }



        ScrollBar hScrollBar, vScrollBar;



        void MainPage_Loaded(object sender, RoutedEventArgs e)

        {

            CompositionTarget.Rendering += new EventHandler(CompositionTarget_Rendering);



            hScrollBar = GetScrollBar(sc, true);

            vScrollBar = GetScrollBar(sc, false);

            hScrollBar.ValueChanged += new RoutedPropertyChangedEventHandler<double>(hScrollBar_ValueChanged);

            vScrollBar.ValueChanged += new RoutedPropertyChangedEventHandler<double>(vScrollBar_ValueChanged);



            rcLocation.Height = content.ActualHeight >= 800 ? 800 / content.ActualHeight * 320 : 320;

            rcLocation.Width = content.ActualWidth >= 480 ? 480 / content.ActualWidth * 240 : 240;

        }



        /// <summary>

        /// 垂直滚动条

        /// </summary>

        void vScrollBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)

        {

            this.rcLocation.SetValue(Canvas.TopProperty, e.NewValue / content.ActualHeight * 320);

        }



        /// <summary>

        /// 水平滚动条

        /// </summary>

        void hScrollBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)

        {

            this.rcLocation.SetValue(Canvas.LeftProperty, e.NewValue / content.ActualWidth * 320);

        }





        void CompositionTarget_Rendering(object sender, EventArgs e)

        {

            WriteableBitmap bit = new WriteableBitmap(content, null);

            img.Source = bit;

        }



        private ScrollBar GetScrollBar(ScrollViewer viewer, bool isHor)

        {

            var a = VisualTreeHelper.GetChild(viewer, 0);

            var b = VisualTreeHelper.GetChild(a, 0);

            var c = VisualTreeHelper.GetChild(b, 0);



            if (isHor)

                return VisualTreeHelper.GetChild(b, 2) as ScrollBar;//水平

            else

                return VisualTreeHelper.GetChild(b, 1) as ScrollBar;//垂直           

        }

    }

你可能感兴趣的:(wp7)