Forum Xamarin.Forms

Announcement:

The Xamarin Forums have officially moved to the new Microsoft Q&A experience. Microsoft Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

To create new threads and ask questions head over to Microsoft Q&A for .NET and get involved today.

How to use a web view inside a list View

awasthiharawasthihar Member ✭✭
edited February 18 in Xamarin.Forms
I want my list view view cell to take a web wiew ...by binding source to my view model

Answers

  • JoeMankeJoeManke USMember ✭✭✭✭✭

    Why? For what purpose do you possibly need to display several WebViews on a page at once? It sounds like an atrocious user experience.

  • awasthiharawasthihar Member ✭✭
    edited February 18
    Actually I want my label to get wrapped by an image so that when line of text changes image also goes down @JoeManke
  • JohnHardmanJohnHardman GBUniversity admin

    @awasthihar said:
    I want my list view view cell to take a web wiew ...by binding source to my view model

    Assuming that this is a continuation of https://forums.xamarin.com/discussion/187471/i-want-to-wrap-xamarin-label-with-an-image

    Ensure that you use HasUnevenRows on the ListView, and then size each ViewCell so that the nested WebView does not require scrollbars. If you don't do this, you will end up with nested scrollable regions, which goes against UX recommendations. The alternative is to replace the entire ListView by one WebView rather than having a WebView per ViewCell, although I tend to think that once an app starts doing that, it probably shouldn't be using Xamarin.Forms at all (others might disagree)

  • YelinzhYelinzh Member, Xamarin Team Xamurai

    To warp the image inside text content using the WebView, you could use HtmlWebViewSource to display the view.

    Check the code:

    <WebView x:Name="browser" HeightRequest="200"/>
    

    Page.xaml.cs

    public partial class Page1 : ContentPage
    {
        public Page1()
        {
            InitializeComponent();
    
            var htmlSource = new HtmlWebViewSource();
            htmlSource.Html = @"<html>
                            <head>
                            </head>
                            <body>
                            <h1>Xamarin.Forms</h1>
                            <p>The CSS and image are loaded from local files!</p>
                            <img src='grid_.png' style='width: 50px; height: 50px;' align = 'left'/>
                            <p>The CSS and image are loaded from local files!The CSS and image are loaded from local files!
                            The CSS and image are loaded from local files!The CSS and image are loaded from local files!</p>
                            </body>
                            </html>";
            htmlSource.BaseUrl = DependencyService.Get<IBaseUrl>().Get();
            browser.Source = htmlSource;
        }
    }
    

    Xamarin forums are migrating to a new home on Microsoft Q&A!
    We invite you to post new questions in the Xamarin forums’ new home on Microsoft Q&A!
    For more information, please refer to this sticky post.

Sign In or Register to comment.