.NET MAUI在iOS上:图像未在列表单元中显示

huangapple go评论57阅读模式
英文:

.NET MAUI on iOS: Image is not displayed in the list cell

问题

在我的移动应用程序中,声明了一个带有图像的列表:

<ListView ItemsSource="{Binding PhotosCollection}"
		  SelectionMode="Single"
		  VerticalOptions="FillAndExpand"
		  SelectedItem="{Binding SelectedPhotoDocument}">
		  
   <ListView.ItemTemplate>
      <DataTemplate>
         <ViewCell>
            <Grid Margin="4">

               <Grid.RowDefinitions>
                  <RowDefinition Height="64" />
                  <RowDefinition Height="*" />
               </Grid.RowDefinitions>

               <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="*" />
                  <ColumnDefinition Width="*" />
               </Grid.ColumnDefinitions>

               <Image Grid.RowSpan="2" 
					  Grid.Column="0" 
					  Source="{Binding ThumbnailImageSource}" 
					  HorizontalOptions="Start" 
					  VerticalOptions="Center" 
					  Aspect="AspectFit" />
					  
               <Label Grid.Column="1" 
					  Grid.RowSpan="2" 
					  Text="{Binding Description}" 
					  FontAttributes="Bold" 
					  HorizontalOptions="Start" 
					  VerticalOptions="Center" 
					  HorizontalTextAlignment="Start" 
					  VerticalTextAlignment="Center" />
            </Grid>
         </ViewCell>
      </DataTemplate>
   </ListView.ItemTemplate>
</ListView>

这个列表在Android平台上运行正常,并显示图像和描述。但在iOS平台上缩略图没有显示,只显示描述。

如何解决这个问题?

英文:

In my mobile application, there's declared a list with images:

<ListView ItemsSource="{Binding PhotosCollection}" 
		  SelectionMode="Single" 
		  VerticalOptions="FillAndExpand" 
		  SelectedItem="{Binding SelectedPhotoDocument}">
		  
   <ListView.ItemTemplate>
      <DataTemplate>
         <ViewCell>
            <Grid Margin="4">

               <Grid.RowDefinitions>
                  <RowDefinition Height="64" />
                  <RowDefinition Height="*" />
               </Grid.RowDefinitions>

               <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="*" />
                  <ColumnDefinition Width="*" />
               </Grid.ColumnDefinitions>

               <Image Grid.RowSpan="2" 
					  Grid.Column="0" 
					  Source="{Binding ThumbnailImageSource}" 
					  HorizontalOptions="Start" 
					  VerticalOptions="Center" 
					  Aspect="AspectFit" />
					  
               <Label Grid.Column="1" 
					  Grid.RowSpan="2" 
					  Text="{Binding Description}" 
					  FontAttributes="Bold" 
					  HorizontalOptions="Start" 
					  VerticalOptions="Center" 
					  HorizontalTextAlignment="Start" 
					  VerticalTextAlignment="Center" />
            </Grid>
         </ViewCell>
      </DataTemplate>
   </ListView.ItemTemplate>
</ListView>

This list works perfectly on Android platform and displays images along with descriptions. But on iOS platform thumbnails are not being displayed. Only descriptions are shown.

How can I overcome this issue?

答案1

得分: 0

为了解决这个问题,使移动应用在iOS和Android上正常工作,我在ListView的数据模板声明中使用了ImageCell而不是ImageLabel标记。

<ListView 
    ItemsSource="{Binding PhotosCollection}"
    SelectionMode="Single"
    VerticalOptions="FillAndExpand"
    SelectedItem="{Binding SelectedPhotoDocument}">
	    <ListView.ItemTemplate>
		    <DataTemplate>
			    <ImageCell
                    ImageSource="{Binding ThumbnailImageSource}"
                    Text="{Binding Description}" />
		</DataTemplate>
	</ListView.ItemTemplate>
</ListView>
英文:

To fix this issue to get mobile app working as well as on iOS and on Android, I used ImageCell instead of Image and Label tags in the ListView data template declaration.

<ListView 
    ItemsSource="{Binding PhotosCollection}"
    SelectionMode="Single"
    VerticalOptions="FillAndExpand"
    SelectedItem="{Binding SelectedPhotoDocument}">
	    <ListView.ItemTemplate>
		    <DataTemplate>
			    <ImageCell
                    ImageSource="{Binding ThumbnailImageSource}"
                    Text="{Binding Description}" />
		</DataTemplate>
	</ListView.ItemTemplate>
</ListView>

huangapple
  • 本文由 发表于 2023年2月14日 20:55:09
  • 转载请务必保留本文链接:https://go.coder-hub.com/75448140.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定