如何在ListView中設置圖像的大小？

Question

如何在ListView中設置圖像的大小？

目標設備是Windows Phone 10（即Windows通用平臺）。

我發現以下documentation：

注意針對Windows Phone的8.1時，將的ImageCell不是默認縮放 圖像。另外請注意，Windows Phone 8.1是唯一的 平臺，默認情況下，其中的詳細文本以相同顏色和字體 作爲主文本顯示。的Windows Phone 8.0渲染的ImageCell如 看到如下：

我已經試過：

<ListView Grid.Row="1" ItemsSource="{Binding Photos}" SelectedItem="{Binding SelectedPhoto, Mode=TwoWay}"> 
    <ListView.ItemTemplate> 
    <DataTemplate> 
     <ImageCell ImageSource="{Binding ImageSource}" Text="{Binding Description}" TextColor="Silver" /> 
    </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

上圖顯示了一個全面的圖像，而不限制圖像的大小，使其適合作爲listview項目。

我也試過：

<ListView Grid.Row="1" ItemsSource="{Binding Photos}" SelectedItem="{Binding SelectedPhoto, Mode=TwoWay}"> 
    <ListView.ItemTemplate> 
    <DataTemplate> 
     <Image Source="{Binding ImageSource}" Aspect="AspectFit" /> 
    </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

上面的代碼不顯示任何圖像。它只顯示一個白色背景。

Answer 1

幾件事情： -

ImageCell沒有指定圖像寬度/高度（V2.0.x中）的能力。

你的第二個例子是更多的軌道上，但是，你需要用它在ViewCell因爲你正在處理一個ListView像這樣： -

<ListView ItemsSource="{Binding Photos}" HasUnevenRows="True"> 
    <ListView.ItemTemplate> 
    <DataTemplate>    
     <ViewCell> 
     <Image Source="{Binding MyImage}" Aspect="AspectFit" WidthRequest="{Binding MyWidth}" HeightRequest="{Binding MyHeight}" /> 
     </ViewCell> 
    </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

此外，請注意，對於ListView默認爲設置爲等於行高。

因此，如果您有不同的圖像大小，很可能這不會產生你想要的輸出。

爲了解決這個問題，請指定HasUnevenRows='True'。

如果進一步做BindableProperties你想要的ImageWidth和ImageHeight什麼你ViewModel，並指定他們在上面使用ImageWidthRequest和HeightRequest指定不同的值時，你會得到這樣的輸出的例子： -