在 Windows 應用商店應用中剪切圖像

Question

那么我們究竟如何在 UWP aka Windows Store 應用程序中制作精靈呢？ 此 SO 帖子中描述的兩種方法在 UWP 中不起作用。 （ CroppedBitmap類不起作用， ImageBrush類沒有Viewbox屬性）。 我嘗試用RenderTransform做Clip ，但也沒有成功。 下一步去哪里？

Answer 1

正如@ibebbs 所說， Win2D是在 UWP 中使用精靈的不錯選擇。 Win2D 是一個易於使用的 Windows 運行時 API，用於使用 GPU 加速進行即時模式 2D 圖形渲染。 Win2D 中的 CanvasSpriteBatch 類針對精靈場景進行了優化。

CanvasSpriteBatch允許更高效地繪制多個位圖，並且比DrawImage API 具有更好的性能，尤其是在使用相同的源位圖連續繪制多個精靈時。 CanvasSpriteBatch支持以下功能：

• 精靈可以用它們自己的位置、比例、旋轉和色調來繪制（ Draw Overload和DrawFromSpriteSheet Overload ）
• 單個精靈可以水平或垂直翻轉。 ( CanvasSpriteFlip )
• 精靈表（ DrawFromSpriteSheet 重載）
• 精靈可以被夾在一個源矩形上，不需要在精靈表中的精靈之間添加填充。
• 批次可以按位圖排序以獲得更好的性能。

有關如何使用 CanvasSpriteBatch 的更多信息，請參閱CanvasSpriteBatch 類文檔以及 GitHub 上的Sprite Sheets 示例。

更新：

如果您不想使用 Win2D，實現您想要的一種簡單方法是使用ImageBrush和Transform ，如下所示：

<Rectangle Width="128" Height="192">
    <Rectangle.Fill>
        <ImageBrush AlignmentX="Left"
                    AlignmentY="Top"
                    ImageSource="Assets/WizardIdleRight.png"
                    Stretch="None">
            <ImageBrush.Transform>
                <TranslateTransform x:Name="SpriteSheetOffset" X="0" Y="-384" />
            </ImageBrush.Transform>
        </ImageBrush>
    </Rectangle.Fill>
</Rectangle>

這里我使用了Sprite Sheets 示例中的WizardIdleRight.png ，我們可以在TranslateTransform 中更改偏移量以顯示我們想要的精靈。