向任意方向旋转图像和画布笔划 90 度答案

【问题标题】：Rotating image and canvas strokes 90 degrees in any direction向任意方向旋转图像和画布笔划 90 度
【发布时间】：2023-03-25 20:50:02
【问题描述】：

我正在开发一个应用程序，我在其中使用 InkCanvas 来允许用户编辑图片。一切都按预期工作，除了我找不到如何旋转inkCanvas storeks 和下面的背景图像。以下是我目前有任何帮助或指导的代码，将不胜感激。

<Grid >
     <Grid.RowDefinitions>
        <RowDefinition Height="40"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Grid
        ManipulationMode="TranslateX,TranslateInertia,System" 
        Row="0" Background="White">

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="50"/>

            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="240"/>
        </Grid.ColumnDefinitions>
        <FontIcon 
            Tapped="OnBackButtonClick"
            Grid.Column="0"
            Width="50"
            Height="40"
            FontFamily="Segoe MDL2 Assets" 
            Glyph="&#xE72B;"/>

        <FontIcon 
            Tapped="SaveButton_OnClick"
            Grid.Column="2"
            Width="50"
            Height="40"
            FontFamily="Segoe MDL2 Assets" 
            Glyph="&#xE74E;"/>

        <FontIcon 
            Tapped="RedoButton_OnClick"
            Grid.Column="3"
            Width="50"
            Height="40"
            FontFamily="Segoe MDL2 Assets" 
            Glyph="&#xE7A6;"/>

        <FontIcon 
            Tapped="UndoButton_OnClick"
            Grid.Column="4"
            Width="50"
            Height="40"
            FontFamily="Segoe MDL2 Assets" 
            Glyph="&#xE7A7;"/>

        <FontIcon 
            Grid.Column="5"
            Width="50"
            Tapped="OnButtonRotateClick"
            Height="40"
            FontFamily="Segoe MDL2 Assets" 
            Glyph="&#xE7AD;"/>

        <InkToolbar 
            Grid.Column="7"
            x:Name="inkToolbar"
            HorizontalAlignment="Right"
            TargetInkCanvas="{x:Bind ink}" />

    </Grid>

    <StackPanel Grid.Row="1" >
        <Grid x:Name="Container">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="43*"/>
                <ColumnDefinition Width="437*"/>
            </Grid.ColumnDefinitions>
            <Image x:Name="ImageControl"
                   Source="/Assets/sample.jpg" 
                   Visibility="Visible"
                   Grid.ColumnSpan="2"
                   RenderTransformOrigin="0,0" 
                   Margin="0" 
                   Stretch="Fill"
                 />
            <InkCanvas x:Name="ink" 
                       Visibility="Visible"
                       Grid.ColumnSpan="2"
                       HorizontalAlignment="Stretch" 
                       VerticalAlignment="Stretch"/>
        </Grid>
    </StackPanel>
</Grid>

【问题讨论】：

以下答案有效吗？
您好@NicoZhu-MSFT 下面的答案涵盖 WPF 或 Xamarin 而不是 UWP，它对我 UWP 不起作用，尝试一下，让我们知道您使用的是 WPF 还是 Xamarin
我在uwp而不是wpf中使用下面的代码，效果很好。

标签： uwp inkcanvas

【解决方案1】：

在任意方向旋转图像和画布笔划 90 度

根据您的要求，您可以将PointTransform 属性修改为InkStroke。请参考以下代码。

private void BtnSave_Click(object sender, RoutedEventArgs e)
{    
    IReadOnlyList<InkStroke> InkStrokeList = ink.InkPresenter.StrokeContainer.GetStrokes();
    foreach (InkStroke temp in InkStrokeList)
    {
        temp.PointTransform = Matrix3x2.CreateRotation((float)(90 * Math.PI / 180), new Vector2(500, 500));
    }
}

【讨论】：