將圖像分解爲圖塊

嘿。我有一個480×800的圖像，並希望將其放置在我的地圖上。我試圖將圖像分割成網格（6 x 10），併爲每個圖塊分配圖像的特定部分。本質上，由於每個圖塊都附加了圖像的相關部分，所以該圖塊看起來像一個大圖像。這樣做的最好方法是什麼？我已經嘗試瞭解每個tile並將其繪製到WriteableBitmap，但所有圖像都是相同的。將圖像分解爲圖塊

WriteableBitmap wb = new WriteableBitmap(80,80); 
Rect src= new Rect(x*Width,y*Height, 80, 80); 
Rect dest= new Rect(0, 0, 80, 80); 
wb.Blit(dest, mainWb, src); 
tile.SetImage(wb);

（x和y）是剛通過tilemap的迭代時所使用的索引，80是瓦片的高度和寬度和mainWb是大圖像欲分割。謝謝你的幫助。

編輯：完全循環代碼：

var mainImage = Application.GetResourceStream(new Uri("MainImage.jpg", UriKind.Relative)).Stream; 
        WriteableBitmap mainWb = new WriteableBitmap(480, 800);   

        mainWb.SetSource(mainImage); 
        for (int x = 0; x < 6; x++) 
        { 
         for (int y = 0; y < 12; y++) 
         { 
          Tile tile = new Tile(); 

          WriteableBitmap wb = new WriteableBitmap(80,80); 


Rect src = new Rect(x*Width,y*Height, 80, 80); 

         Rect dest = new Rect(0, 0, 80, 80); 

         wb.Blit(dest, mainWb, src); 
         tile.SetImage(wb);  

         Canvas.SetLeft(tile, x * WIDTH); 
         Canvas.SetTop(tile, y * HEIGHT); 


         LayoutRoot.Children.Add(tile); 
         ls.Add(tile); 
        } 
       }

的Tile類是與圖像控制簡單的80×80畫布稱爲img。上述SetImage方法是這樣的：

public void SetImage(WriteableBitmap wb) 
     {     
      img.Source = wb;      
     }

來源

2011-05-19 Skoder

該代碼似乎是正確的。你能發佈整個循環嗎？ – 2011-05-19 12:19:03

@ Olivier Payen - 我已經添加了完整的循環。 – Skoder 2011-05-19 14:36:19

，你可以用一個漂亮的把戲做到這一點 - 用帆布每次只需裁剪圖像，以及移動圖像所以每次另一片顯示：

 <Canvas Width="80" Height="80"> 
      <Canvas.Clip> 
       <RectangleGeometry Rect="0,0,80,80" /> 
      </Canvas.Clip> 
      <Image Source="your_image.png" 
    Canvas.Left="0" Canvas.Top="0" /> 
      <!-- or -80, -160, -240 etc.. --> 
     </Canvas>

來源

2011-05-19 01:37:11

我在原始問題中增加了一些代碼。我應該在循環中的代碼中執行此操作，並修改「SetImage」方法以接受「canvas」參數嗎？ – Skoder 2011-05-19 14:46:59

你可以做我喜歡你的建議，但最優雅的是做數據綁定。將上述畫布放在一個itemsControl.DataTemplate中，並將它綁定到一個包含相關座標的對象列表。該列表應在代碼後面創建。 – 2011-05-19 14:50:53

將圖像分解爲圖塊

回答

相關問題