How to handle Pinch in & out in UWP apps

Question

I have a TextBlock in my App. I want to handle pinch in & out on it to resize the font of that. when ManipulationDelta event fires I check Scale property, But most of times Scale is 1 even my fingers getting far from or getting nearer. or it doesn't work as I expected.

can anybody show me an example how to find that pinch in or out happened?

Answer 1

Put a scrollviewer around it. It has zooming via pinch out of the box.

Answer 2

Have you set the ManipulationMode on the TextBlock to Scale?

Also, I would suggest you put the manipulation on a Grid or Border container with Transparent background to capture the manipulation events. In the case of a TextBlock you could be running into hit testing issues that might cause the manipulation events not being fired.

<Grid ManipulationMode="Scale" ManipulationDelta="YourHandler">
   <TextBlock Text="YourTextBlock" />
</Grid>

Answer 3

I'm not sure if there're some issues in your code, but I've made a simple code sample. It can achieve your target.

Please check the following code:

<Grid Background="Red" Height="200" ManipulationDelta="StackPanel_ManipulationDelta" ManipulationMode="Scale">
        <TextBlock FontFamily="Verdana"
           FontSize="32"
           FontWeight="Bold"
           Foreground="SteelBlue"
           Text="Scaled Text" IsTextScaleFactorEnabled="True">
            <TextBlock.RenderTransform>
                <ScaleTransform x:Name="ScaleTransform" ScaleX="1.0" ScaleY="1.0" />
            </TextBlock.RenderTransform>
        </TextBlock>
</Grid>

private void Grid_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    ScaleTransform.ScaleX *= e.Delta.Scale;
    ScaleTransform.ScaleY *= e.Delta.Scale;
}