locked
WPF zoom with scrollviewer???

    Question

  • The first, Zoom in, out by button

    The second, Get "position"(Point posNow = e.GetPosition(scrollViewer);

    e.GetPosition not support on universal.

    Event OnmouseMove()???
    Wednesday, April 8, 2015 6:33 AM

Answers

  • Hi Grey,

    >>The first, Zoom in, out by button

    You need to change the height of elements inside the ScrollViewer form code behind, for example:

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="100" />
            </Grid.ColumnDefinitions>
            <ScrollViewer x:Name="scrollViewer1" 
                      VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" 
                      ZoomMode="Enabled">
                <Image Name="img1" Height="{Binding ActualHeight, ElementName=scrollViewer1}" Width="{Binding ActualWidth, ElementName=scrollViewer1}" Source="Assets/pic1.jpg" />
            </ScrollViewer>
            
            <StackPanel Grid.Column="1">
                <Button Name="btnZoomin" Content="Zoom in" Width="100" Click="btnZoomin_Click" />
                <Button Name="btnZoomout" Content="Zoom out" Width="100" Click="btnZoomout_Click" />
            </StackPanel>
        </Grid>

    private void btnZoomin_Click(object sender, RoutedEventArgs e)
    {
                img1.Height *= 1.1;
                img1.Width *= 1.1;
    }
    
    private void btnZoomout_Click(object sender, RoutedEventArgs e)
    {
                img1.Height /= 1.1;
                img1.Width /= 1.1;
    }

    >>The second, Get "position"(Point posNow = e.GetPosition(scrollViewer);

    We need to handle PointerMoved event and use PointerRoutedEventArgs.GetCurrentPoint method to get position: https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.input.pointerroutedeventargs.getcurrentpoint(v=win.10).aspx

    <Page
        ......
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d" PointerMoved="Page_PointerMoved">

    private void Page_PointerMoved(object sender, PointerRoutedEventArgs e)
    {
                var pointerPoint = e.GetCurrentPoint(scrollViewer1);
                Point position = pointerPoint.Position;
                Debug.WriteLine(position.X + " " + position.Y);
    }


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Thursday, April 9, 2015 5:25 AM
    Moderator

All replies

  • Hi Grey,

    >>The first, Zoom in, out by button

    You need to change the height of elements inside the ScrollViewer form code behind, for example:

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="100" />
            </Grid.ColumnDefinitions>
            <ScrollViewer x:Name="scrollViewer1" 
                      VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" 
                      ZoomMode="Enabled">
                <Image Name="img1" Height="{Binding ActualHeight, ElementName=scrollViewer1}" Width="{Binding ActualWidth, ElementName=scrollViewer1}" Source="Assets/pic1.jpg" />
            </ScrollViewer>
            
            <StackPanel Grid.Column="1">
                <Button Name="btnZoomin" Content="Zoom in" Width="100" Click="btnZoomin_Click" />
                <Button Name="btnZoomout" Content="Zoom out" Width="100" Click="btnZoomout_Click" />
            </StackPanel>
        </Grid>

    private void btnZoomin_Click(object sender, RoutedEventArgs e)
    {
                img1.Height *= 1.1;
                img1.Width *= 1.1;
    }
    
    private void btnZoomout_Click(object sender, RoutedEventArgs e)
    {
                img1.Height /= 1.1;
                img1.Width /= 1.1;
    }

    >>The second, Get "position"(Point posNow = e.GetPosition(scrollViewer);

    We need to handle PointerMoved event and use PointerRoutedEventArgs.GetCurrentPoint method to get position: https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.input.pointerroutedeventargs.getcurrentpoint(v=win.10).aspx

    <Page
        ......
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d" PointerMoved="Page_PointerMoved">

    private void Page_PointerMoved(object sender, PointerRoutedEventArgs e)
    {
                var pointerPoint = e.GetCurrentPoint(scrollViewer1);
                Point position = pointerPoint.Position;
                Debug.WriteLine(position.X + " " + position.Y);
    }


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Thursday, April 9, 2015 5:25 AM
    Moderator
  • Thanks very much. It ok.

     I use mouse to move photos it will be replace Move Hor or Ver of scrollbar(hidden) on scrollviewer. How.

    Thursday, April 9, 2015 2:24 PM