在Windows商店應用

裁剪圖像那麼到底我們該怎麼做精靈在UWP又名Windows應用商店的應用程序？ this SO post中描述的兩種方法在UWP中不起作用。（CroppedBitmap類不工作，ImageBrush類沒有Viewbox屬性）。我試過Clip與RenderTransform，但還沒有成功。下一步該去哪裏？在Windows商店應用

來源

2016-09-15 dotNET

你能澄清的是什麼你實際上是想幹什麼？通過精靈，我猜你想要一個包含所有狀態下所有精靈圖像的大型位圖，然後試圖動態更改裁剪以執行精靈動畫。如果這確實是你正在試圖做的話，我會建議調查[Win2D（https://github.com/Microsoft/Win2D），這是更具針對性什麼你彷彿是試圖做。 – ibebbs

@ibebbs：你的理解是正確的。在WPF和SL中，我們可以在純XAML中完成此操作，而無需編寫任何代碼（請參閱我在問題中發佈的SO鏈接）。我在Google上看到了Win2D。看起來我不得不使用它作爲最後的手段，如果我找不到更簡單的方法。 – dotNET

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

CanvasSpriteBatch允許更高效地被多個位圖和具有比DrawImage API更好的性能，特別是當許多精靈在連續使用同一源位圖繪製。 CanvasSpriteBatch支持以下功能：

精靈可以用自己的位置，縮放，旋轉和色調（Draw Overload和DrawFromSpriteSheet Overload）
個別精靈可以水平或垂直翻轉繪製。（CanvasSpriteFlip）
的Sprite表（DrawFromSpriteSheet Overload）
精靈可以clamped to a source rectangle，不再需要在精靈表精靈之間添加填充。
批，可以sorted by bitmap獲得更好的性能。

有關如何使用CanvasSpriteBatch更多信息，請參閱CanvasSpriteBatch Class document也Sprite Sheets sample在GitHub上。

更新：

如果你不想使用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 sample使用的WizardIdleRight.png，我們可以改變TranslateTransform送偏移我們想要的精靈如何。

來源

2016-09-16 07:10:15

謝謝Jay，非常翔實。我正在開發的遊戲是一款簡單的紙牌遊戲，我將所有52張卡片圖像放在一個PNG中。我正在尋找的是將該圖像作爲應用程序級資源加載，然後爲每個「Image」元素分配集合「Clip」屬性以顯示相應的卡片。對我來說，Win2D聽起來像是一把更大的槍，用於更激烈，互動和實時的遊戲。或者是？ – dotNET

只是出於好奇，如果您在XAML中編寫此代碼，爲什麼不使用DataTemplate卡，並使用適合圖形資源的套裝字形（或更好的符號字體）。這將導致尺寸更小的應用程序在各種分辨率下更好地擴展。 – ibebbs

@dotNET如果你不想使用Win2D，使用ImageBrush和Transform可能是一種簡單的方法。請檢查我更新的答案。 –

在Windows商店應用

回答

相關問題