I can't change the Height of a WebView inside of a Stack Layout...

WarwenczackWarwenczack BRMember ✭✭

I'm trying to change the Height of my webView, but without success, i'm using StackLayout with a grid, i'm setting the Grid.RowSpan to "6", but my webView stay the same...
part of the code bellow...

<StackLayout  Grid.Row="10" Grid.Column="0" Grid.ColumnSpan="2" Grid.RowSpan="4" BackgroundColor="White" VerticalOptions="End" Padding="0">
    <StackLayout BackgroundColor="Black" Padding="1" VerticalOptions="EndAndExpand">
        <WebView x:Name="webViewDesc" VerticalOptions="EndAndExpand" HeightRequest="100" Margin="0" />
    </StackLayout>
</StackLayout>

Best Answer

  • WarwenczackWarwenczack BR ✭✭
    Accepted Answer

    To solve the problem, i've just change the rows...

Answers

  • VenkataSwamyVenkataSwamy INMember ✭✭✭
    edited June 2017

    Hi @Warwenczack,

    You have to give FillAndExpand to the StackLayouts and give

                <RowDefinition Height="*"/> for 10th Row  maybe it will work for you
    

    The problem is Parent Layout

       <StackLayout  Grid.Row="10" Grid.Column="0" Grid.ColumnSpan="2" Grid.RowSpan="4" BackgroundColor="White" 
       VerticalOptions="End" Padding="0">
       <StackLayout BackgroundColor="Black" Padding="1" VerticalOptions="FillAndExpand">
        <WebView x:Name="webViewDesc" VerticalOptions="FillAndExpand" HeightRequest="100" Margin="0" />
       </StackLayout>
      </StackLayout>
    
  • WarwenczackWarwenczack BRMember ✭✭

    @VenkataSwamyBalaraju said:
    Hi @Warwenczack,

    You have to give FillAndExpand to the StackLayouts and give for 10th Row maybe it will work for you

    The problem is Parent Layout

       <StackLayout  Grid.Row="10" Grid.Column="0" Grid.ColumnSpan="2" Grid.RowSpan="4" BackgroundColor="White" 
       VerticalOptions="End" Padding="0">
       <StackLayout BackgroundColor="Black" Padding="1" VerticalOptions="FillAndExpand">
        <WebView x:Name="webViewDesc" VerticalOptions="FillAndExpand" HeightRequest="100" Margin="0" />
       </StackLayout>
      </StackLayout>
    

    Doesn't change nothing :(

  • N_BauaN_Baua INMember ✭✭✭✭✭

    Hi @Warwenczack ,

    If you are referring the classic issue of webview height request based on the content length,
    Please note that setting heightrequest will not work as expected.

    I have implemented the following HACK and it works awesome.

    XAML

    <ContentPage.Content> <ScrollView VerticalOptions="Fill"> <WebView x:Name="webView" HeightRequest="{Binding WebPageHeightRequest}" > <WebView.Source> <HtmlWebViewSource Html="{Binding WebPageData}"/> </WebView.Source> </WebView> </ScrollView> </ContentPage.Content>

    VIEWMODEL

    ` //Step 1: If the page is offline Fatch approproate markup or else fetch the web page content
    var oHtmlWebViewSource = new HtmlWebViewSource
    {
    Html = await Utility.GetStaticHTMLContentFromServer(Constants.staticFAQPageURL)
    };
    //Step 2: Assign it to in-memory label and add it to ScrollView

    var dummyLabel = new Label
    {
    

    VerticalOptions = LayoutOptions.FillAndExpand,
    HorizontalOptions = LayoutOptions.Fill,
    Text = oHtmlWebViewSource.Html,
    };

    var inMemoryScrollView = new ScrollView
    {
    

    VerticalOptions = LayoutOptions.FillAndExpand,
    HorizontalOptions = LayoutOptions.Fill,
    IsClippedToBounds = true,
    Content = dummyLabel
    };

    //Step 3: Assign the Html Web Source and bind
    WebPageData = oHtmlWebViewSource.Html;
    WebPageHeightRequest = inMemoryScrollView.ContentSize.Height;`
    

    Though this example is MVVM based, however works well with code-behind .cs file (Event mode) as well.
    Hope this helps.

    Regards,
    N Baua

  • WarwenczackWarwenczack BRMember ✭✭
    Accepted Answer

    To solve the problem, i've just change the rows...

Sign In or Register to comment.