Silverlight圖像裁剪如何工作？

我有一個非常大的圖像，我想用於精靈技術（àla css image sprites）。Silverlight圖像裁剪如何工作？

我有下面的代碼：

<Image x:Name="testImage" Width="24" Height="12" Source="../Resources/Images/sprites.png"> 
    <Image.Clip> 
     <RectangleGeometry Rect="258,10632,24,12" /> 
    </Image.Clip> 
</Image>

這剪輯源圖像在258，10632源圖像中的相對位置24x12。

問題是我希望裁剪的圖像在testImage中顯示爲0,0，而在258,10632顯示它。它將幾何圖形用作切割指南，但也用作佈局指南。

任何人有任何想法應該如何做？ 如果根本就是。

結論： 似乎是在目前這樣做的沒有什麼好辦法，格雷姆的解決方案似乎是最接近的Silverlight 2.0實現這一目標。

這就是說，如果有人知道這樣做的更好方法，請回答一個答案。

來源

2009-04-13 Tristan Warner-Smith

事實證明這可以做到。

<Rectangle x:Name="myRect" Width="28" Height="12" /> 

ImageBrush imageBrush = new ImageBrush(); 
imageBrush.ImageSource = //Load in image source 
imageBrush.Stretch = Stretch.None; 
imageBrush.AlignmentX = AlignmentX.Left; 
imageBrush.AlignmentY = AlignmentY.Top; 

TranslateTransform offsetTransform = new TranslateTransform(); 
offsetTransform.X = -258; 
offsetTransform.Y = -10632; 

imageBrush.Transform = offsetTransform;

來源

2009-04-21 20:15:32

假設你是一個帆布

<Image x:Name="testImage" Width="24" Height="12" Canvas.Left="-258" Canvas.Top="-10632" Source="../Resources/Images/sprites.png"> 
<Image.Clip> 
    <RectangleGeometry Rect="258,10632,24,12" /> 
</Image.Clip>

使用WPF你可以使用一個CroppedBitmap但遺憾的是並不在Silverlight上存在。

<編輯>

隨着進一步的實驗，而無需使用畫布的解決方案：

<Image x:Name="testImage" Width="24" Height="12" Source="../Resources/Images/sprites.png"> 
    <Image.Clip> 
     <RectangleGeometry Rect="258,10632,24,12" /> 
    </Image.Clip> 
    <Image.RenderTransform> 
     <TranslateTransform X="-258" Y="10632"/> 
    </Image.RenderTransform> 
</Image>

它做同樣的事情，在畫布上稍稍整潔。

來源

2009-04-15 16:16:54

我喜歡你要去的地方在這裏，但改變圖像寬度24隱藏的內容。更改寬度會改變顯示原始圖像的哪一位。 – 2009-04-15 21:08:06

我可以將寬度和高度保留爲原始寬度=「800」高度=「18928」，但這是正確的方式嗎？ – 2009-04-15 21:10:26

問題是Silverlight尚不支持你想要做的事情。 CroppedBitmap是正確的方式，但不幸的是只存在於WPF中。所以，除非你打開Reflector並自己實現，否則你只剩下Image – 2009-04-16 08:05:52

Silverlight 3.0的Bitmap API將允許您從Sprite圖像中抓取剪輯。

查看How to crop instead of clip in silverlight

來源

2009-04-16 11:25:20 TJB

爲什麼這樣做，在這一切後，CSS圖像精靈的整點是使一個請求，而不是很多，以提高下載時間。但是，只需將所有圖像放入xap（或xap）中並將其下載到一個請求中即可實現。

來源