調整XAML Grid的大小。背景圖片

我有一段簡單的XAML，它展示了一組包含背景圖像圖標的圖塊。調整XAML Grid的大小。背景圖片

   <Grid.Background> 
        <ImageBrush Stretch="None" 
           ImageSource="{Binding ImageSource}" 
           AlignmentY="Center" 
           AlignmentX="Center"/> 
       </Grid.Background>

這工作正常，除了背景圖像完美填補廣場。我相信XAML認爲這很好，但實際上它需要大約一半的尺寸才能符合規格。

我嘗試了幾種方法，包括在網格中添加邊框（截斷背景圖片，保留尺寸但在側面和頂部將其切除），並在各個位置添加邊距和填充。

我也玩過這種做法，但所有東西都浮在這個背景圖片的頂部，所以這不是一個選項。

最後我應該提到這是一個使用Windows運行時的Windows 8 Windows應用商店應用程序，因此WPF中的某些功能在此處不可用（如ViewPort）。

問題：如何調整XAML網格背景圖像的大小/尺寸？

旁註：我認爲解決方案可能在於一個轉換......？

更新：每個海報請求在這裏是預期的結果應該是什麼。儘管這裏看起來沒有背景圖像漂浮，但在其他地方，文字漂浮在背景上。這就是爲什麼它需要成爲一個而不是一個要素。

現在怎麼看起來：

Current background image

那應該怎麼看：

How I want it to look

來源

2013-12-23 nocarrier

你可以發佈你想要的快照嗎？ –

一個規模呈現transfrom應該做你想要什麼：（您可能需要設置的centerX和CenterY得到它看起來完全是你想要的樣子）

<Grid.Background> 
     <ImageBrush Stretch="None" 
         ImageSource="{Binding ImageSource}" 
         AlignmentY="Center" 
         AlignmentX="Center"> 
      <ImageBrush.Transform> 
       <ScaleTransform ScaleX=".5" ScaleY=".5"/> 
      </ImageBrush.Transform> 
     </ImageBrush> 
    </Grid.Background>

來源

2013-12-24 20:29:23 BradleyDotNET

謝謝@LordTakkera;這個解決方案很好用！優雅和直接，這正是我正在尋找。 +1提到CenterX和CenterY調整，最終需要讓這個看起來正確。喜歡XAML！再次感謝。 – nocarrier

沒問題。您也可以使用類似的代碼旋轉，翻譯和傾斜UI元素。如果將它們包裝在TransformGroup集合中，您甚至可以將它們組合起來。 – BradleyDotNET

可以擠壓圖像刷到您的自定義視口，以便它會帶你想要的大小它來。

有一些信息：http://keyvan.io/viewbox-and-viewport-in-windows-presentation-foundation

如果要削減一半，然後你開始X &Ÿ應該是0.25和結束的x，y 0.75。這樣的事情應該做的伎倆：

  <Grid.Background> 
       <ImageBrush Stretch="None" 
          ImageSource="{Binding ImageSource}" 
          AlignmentY="Center" 
          AlignmentX="Center" 
          Viewport="0.25, 0.25, 0.75, 0.75"/> 
      </Grid.Background>

//編輯對Win8的可能：

<Grid> 
<Grid> 
    <Grid.RenderTransform> 
     <ScaleTransform RenderTransformOrigin="0.5, 0.5" ScaleX="0.5" ScaleY="0.5" /> 
    </Grid.RenderTransform> 

    <Grid.Background> 
    <ImageBrush Stretch="None" 
     ImageSource="{Binding ImageSource}" 
     AlignmentY="Center" 
     AlignmentX="Center"/> 
    </Grid.Background> 
</Grid> 
</Grid>

來源

2013-12-23 19:14:12

我忘了提及，這是一個Windows 8（Windows應用商店）應用程序。我試過這個解決方案，但ViewPort在Windows運行時框架中不可用。謝謝，但還有其他想法？ – nocarrier

您可以將網格包裝到另一個網格中並使用ScaleTransformon。我已更新該帖子。它不應該工作嗎？ –

感謝Windows 8更新@ Erti-Chris Eelmaa我可以驗證這確實適用於Windows運行時（Windows應用商店AKA Windows 8 Metro應用）。 WinRT中有很多人錯過我們WPF的人認爲是理所當然的。 DataTriggers浮現在腦海......無論如何，再次感謝。 – nocarrier

調整XAML Grid的大小。背景圖片

回答

相關問題