0

We use a relative layout with buttons above and a button/link below a WebView. It all appears great ... until a larger web page is loaded. Then the WebView expands and the link/button below it pushes out of view. We want to lock the size of the WebView; but make it fill all available space on all screens. We are also hiding the status bar. Anyone know how to do this? (Read and tried several SO and blogs on it. They work when the WebView content does not grow larger on the next page load.)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    style="@style/match"
    android:animateLayoutChanges="true"
    android:background="@color/white"
    android:paddingTop="@dimen/responsive_top_padding"
    android:paddingBottom="@dimen/responsive_bottom_padding"
    android:orientation="vertical">

    <!-- Header -->
    <android.support.percent.PercentRelativeLayout
        android:id="@+id/responsive_header"
        android:layout_alignParentTop="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
       app:layout_heightPercent="@fraction/responsive_initial_header_height">

        <!-- up button -->
        <ImageView
            android:id="@+id/responsive_up_button"
            android:layout_width="@dimen/responsive_web_view_up_icon_height"
            android:layout_height="@dimen/responsive_web_view_up_icon_height"
          android:layout_marginLeft="@dimen/responsive_web_view_side_padding"
            android:layout_alignParentLeft="true"
    app:layout_marginLeftPercent="@fraction/responsive_header_margin_percent"
            android:src="@drawable/responsive_up"
            android:layout_centerVertical="true"/>

        <!-- logo -->
        <ImageView
            android:id="@+id/responsive_logo"
            android:layout_width="@dimen/responsive_web_view_logo_height"
            android:layout_height="@dimen/responsive_web_view_logo_width"
            android:src="@drawable/responsive_logo"
            android:layout_centerInParent="true"/>
        <!--Phone button  -->
        <ImageView
            android:id="@+id/responsive_phone_button"
          android:layout_width="@dimen/responsive_web_view_phone_icon_height"
         android:layout_height="@dimen/responsive_web_view_phone_icon_height"                   
android:layout_marginRight="@dimen/responsive_web_view_side_padding"              
app:layout_marginRightPercent="@fraction/responsive_header_margin_percent"
            android:layout_alignParentRight="true"
            android:src="@drawable/responsive_phone"
            android:layout_centerVertical="true"/>

    </android.support.percent.PercentRelativeLayout>

    <!-- Footer -->
    <com.xyz.m.android.ui.common.view.CommonPrivacySecurityView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:id="@+id/footer_privacy_and_security"
        android:layout_alignParentBottom="true"/>

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="fill_parent"
            android:layout_above="@+id/footer_privacy_and_security"
            android:layout_below="@+id/responsive_header">
            <!-- Web view -->
            <com.xyz.m.android.ui.responsive.client.ResponsiveWebView
                android:id="@+id/responsiveWebView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:paddingBottom="@dimen/responsive_bottom_padding"                
android:paddingLeft="@dimen/contact_us_schedule_callback_mainui_padding"                    
android:paddingRight="@dimen/contact_us_schedule_callback_mainui_padding" />

        </FrameLayout>

</RelativeLayout>

Do we need to over-ride the shouldOverrideURLLoading and explicitly call loadURL? (saw that in some examples but no explanation of why it was done)

Would the technique of LinearLayout and layout weights be suboptimal due to wasted space on larger screens? (due to oversized allocation to each button row)? E.g. Add native footer view to webview

Community
  • 1
  • 1
  • Using the LinearLayout with weights does not solve the problem. The appearance is actually worse and the pushing of the lower row of buttons/links off the screen still there. – UB Mobile Banking Oct 07 '16 at 15:19
  • Just a tip, it's a little confusing to read XML not properly formatted. For a while I though your webview framelayout was inside the footer view. – jak10h Oct 07 '16 at 15:26
  • Also tried the newer PercentRelativeLayout and fixing top row at 10%, webview at 80%, and lower row at 10%. Looks good, until the web page expands. :-( Please don't tell me I will have to manually find the screen size and somehow set the webview size to prevent resizing. – UB Mobile Banking Oct 07 '16 at 15:37
  • Also tried **android:windowSoftInputMode="adjustNothing" >** for the activity in Manifest. No help. – UB Mobile Banking Oct 07 '16 at 15:48
  • Can you try adding an id to the framelayout (i.e. @+id/webview_container) then adding layout_below="@+id/webview_container" into the footer view? Edit: also to add to this, you may need to set the webview + frame to height=wrap_content. Not familiar with these custom views so they may behave differently than normal. – jak10h Oct 07 '16 at 15:54
  • Thank you jak10h. I did try wrapping the WebView in a FrameLayout but still once the page grows then the View below it slides down and off of the screen (apparently, I cannot actually get down to see if its offscreen or overshadowed). Tried with **android:layout_height="wrap_content"** and 0dp and with **android:layout_below="@+id/responsive_header"** in the FrameLayout. – UB Mobile Banking Oct 07 '16 at 16:33
  • The other attempt can be changing the root layout to a LinearLayout, setting the header and footer height to wrap_content and finally setting the framelayout's height to 0dp and adding layout_weight="1" – jak10h Oct 07 '16 at 16:36

0 Answers0