Windows Phone 8.1 在 ScrollViewer 中使用 canvas 的 UserControl 不工作

Question

我在用户控件中有以下内容：

<Grid Background="#FFEEEEEE" Margin="0,0,0,0">
    <TextBlock x:Name="TitleLabel" HorizontalAlignment="Left" Margin="10,10,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Foreground="Black" FontSize="16" FontWeight="Bold"/>

    <Border BorderBrush="#FFE2E2E2" Margin="10,60,20,80" CornerRadius="4" BorderThickness="2">
        <Grid Background="#ffffffff">
            <Grid x:Name="SignatureGrid" Background="Transparent">
                <TextBlock TextWrapping="Wrap" Text="Sign here" Foreground="#FFEEEEEE" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="100"/>
                <Border BorderBrush="#FF333333" BorderThickness="1" Height="1" VerticalAlignment="Bottom" Margin="20,0,20,50" />
                <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Sign here" VerticalAlignment="Bottom" Foreground="#FF333333" FontSize="14" Margin="20,0,0,27"/>
            </Grid>

            <Canvas x:Name="inkCanvas" Background="Transparent" PointerPressed="inkCanvas_PointerPressed" PointerMoved="inkCanvas_PointerMoved" PointerReleased="inkCanvas_PointerReleased" />
        </Grid>
    </Border>

    <Button x:Name="ClearButton" Content="Clear" HorizontalAlignment="Right" Margin="0,0,20,20" VerticalAlignment="Bottom" Width="162" Background="#FF46B2D5" BorderThickness="0,0,2,0" Click="Button_Click"/>
</Grid>

然后我有一个包含以下内容的页面：

<ScrollViewer Grid.Row="2" x:Name="QuestionsScroller" HorizontalAlignment="Stretch" ZoomMode="Disabled" HorizontalScrollMode="Disabled" >
        <StackPanel x:Name="SectionContentPanel" />
    </ScrollViewer>

在后面的页面代码中，我将控件（和其他控件）动态添加到堆栈面板。在目前的形式下，canvas 不工作，但如果我删除 ScrollViewer，canvas 工作得很好，但我显然无法滚动到它下面的控件。

在我的 PointerMoved 事件中我有：

Point currentPoint = e.GetCurrentPoint(inkCanvas).Position;
if (_startPoint != currentPoint)
{
    _line.Points.Add(currentPoint);
    mHasDrawing = true;
}

使用 ScrollViewer，起点和终点永远不会不同（我猜是因为当我拖过 screen/emulator 时 canvas 与我的 finger/mouse 一起移动。没有 ScrollView，因为我说，效果不错

所以问题是，如何在 scrollViewer 中实现 Canvas？

Answer 1

在弄乱了一段时间之后，我在 Whosebug 上提出了这个问题，然后在 10 分钟内我想通了 - 这是任何想做同样事情的人的答案：

在您的 PointerPressed 事件中，您需要禁用 scrollViewer 滚动模式：

private void inkCanvas_PointerPressed(object sender, PointerRoutedEventArgs e)
    {            
        //get to the scrollViewer
        StackPanel sp = (StackPanel)this.Parent;
        ScrollViewer sv = (ScrollViewer)sp.Parent;
        sv.VerticalScrollMode = ScrollMode.Disabled;

        //Rest of code.
    }

此时 Canvas 将起作用，但您仍然无法滚动，直到您再次启用 ScrollViewer。您可以在 PointerReleased 事件中执行此操作：

private void inkCanvas_PointerReleased(object sender, PointerRoutedEventArgs e)
    {
        //get to the scrollViewer
        StackPanel sp = (StackPanel)this.Parent;
        ScrollViewer sv = (ScrollViewer)sp.Parent;
        sv.VerticalScrollMode = ScrollMode.Auto;

        //Rest of code
    }

Windows Phone 8.1 在 ScrollViewer 中使用 canvas 的 UserControl 不工作

Windows Phone 8.1 UserControl with canvas in a ScrollViewer doesn't work

canvas

scrollviewer

windows-phone-8.1