如何在ObservableCollection填充時更改視圖中的圖像大小

我有一個正在由ObservableCollection填充的圖像列表。這是通過將ListBox的ItemsSource綁定到後面代碼中的Collection來完成的。一切工作正常，雖然結果的圖像列表看起來不漂亮。目前圖像被包裝在一個水平的WrapPanel中，這是我想保留的功能。但問題在於，取決於從CameraCaptureTask獲取的圖像是橫向模式還是縱向模式，在視圖中顯示時，圖像非常寬或很高。我希望能夠調整這些圖像的大小，同時保持縱橫比。也許設置寬度或高度的限制不超過128.我將如何在下面的代碼中做到這一點？此外，圖像是否知道保持寬高比？例如，肖像圖像是否知道最大高度爲128，同時保持小於128的寬度以保持縱橫比？如何在ObservableCollection填充時更改視圖中的圖像大小

MainPage.xaml中

<ListBox x:Name="Recent" ItemsSource="{Binding}" Margin="8" 
        SelectionChanged="recent_SelectionChanged" toolkit:TiltEffect.IsTiltEnabled="True" 
        ItemContainerStyle="{StaticResource MyStyle}"> 
       <ListBox.ItemsPanel> 
        <ItemsPanelTemplate> 
         <toolkit:WrapPanel Orientation="Horizontal" /> 
        </ItemsPanelTemplate> 
       </ListBox.ItemsPanel> 
      </ListBox>

來源

2013-08-01 Matthew

很多問題在一個問題中..我只對你有幫助..你可以爲listview定義itemTemplate，並且可以將它的大小綁定到一些屬性，這些屬性將在你的item類中定義。這是你如何操作圖像項目的大小。 – loop

您可以設置ItemTemplate像@tanuj_loop建議，但我會建議可能還嵌入項目在ViewBox和應用你的尺寸改變它，而不是直接將圖像以確保你保留圖像的分辨率，但得到你想要的大小限制，所以類似;

<ListBox.ItemTemplate> 
    <DataTemplate> 
    <ViewBox MaxHeight="128" MaxWidth="128"> 
      <Image Source="{Binding }"/> 
     </ViewBox>          
    </DataTemplate> 
</ListBox.ItemTemplate>

這樣你ViewBox爲你處理所有的潛在調整大小的問題，你的圖像仍然出來，你想如酥。

希望這會有所幫助。

來源

2013-08-01 14:32:48

我一定要試試這個。另外，如果我希望「裁剪」圖像以顯示中心，並根據此情況的縱橫比裁剪出額外的寬度或高度，那麼如何修改該實例的ViewBox參數？ – Matthew

我不認爲ViewBox會爲剪裁提供很大幫助，如果您想要創建一切均勻的內容，您需要查看WriteableBitmap/BitMapSource。有點像這裏http://www.kunal-chowdhury.com/2012/12/how-to-crop-image-using-writeablebitmap.html –

我明白了。我想我的問題是在執行裁剪程序時佔用資源，因爲我的應用程序可能在其收藏中包含數百或數千張圖像。 Viewbox方法是一種很好的方式，可以在不修改圖像的情況下輕鬆修改尺寸，只要有一種方法可以執行相同操作，但會相應地剪裁圖像的某些部分。我的最終目標是在列表框中顯示大小爲128x128的圖像的正方形以及用戶的樂趣。 – Matthew

如何在ObservableCollection填充時更改視圖中的圖像大小

回答

相關問題