在Xamarin表单列表视图中显示与URL关联的图像

Question

I am building a mobile app with xamarin forms. I have a listview that will store description about a url. I want to be able to display the icons or images that are tied to the url without saving images in my database. When you text a url to someone, am image shows with the url. Any ideas how this can be done? I have been researching and no luck.

Answer 1

hope this helps , specify a UriImage source for your image, set the uri property to the image url

               <Image 
                HorizontalOptions="FillAndExpand"
                VerticalOptions="FillAndExpand"
                    Aspect="AspectFit">
                    <Image.Source>
                        <UriImageSource Uri="{Binding EventImage}" 
                            CacheValidity="3" 
                            CachingEnabled="true"/>
                    </Image.Source>
                </Image>

Answer 2

to display in Image in a ListView, use an ImageCell

<ImageCell ImageSource="{Binding FaviconUrl}" Text="{Binding Name}" />

You'll have to add a property to your model that will determine (or guess) the correct url for the site's favicon.

Answer 3

You can get the fav-icon using the Google S2 converter .

For eg: https://www.google.com/s2/favicons?domain=yahoo.com :

To get it to work with your image control, this should technically work:

<ImageCell Text="{Binding DomainUrl}">
  <ImageCell.ImageSource>
    <UriImageSource Uri="{Binding Path=DomainUrl, StringFormat='https://www.google.com/s2/favicons?domain={0}'}"
      CacheValidity="1"
      CachingEnabled="true"/>
  </ImageCell.ImageSource>           
</ImageCell>

Or,

<ViewCell>
  <StackLayout Orientation="Horizontal" Padding="5">
    <Image HorizontalOptions="Center" VerticalOptions="Center">
      <Image.Source>
        <UriImageSource Uri="{Binding Path=DomainUrl, StringFormat='https://www.google.com/s2/favicons?domain={0}'}"
          CacheValidity="1"
          CachingEnabled="true"/>
      </Image.Source>                       
    </Image>
    <Label Text="{Binding Path=DomainUrl}" /> 
  </StackLayout>            
</ViewCell>