Android中实现两个Fragment等高布局:WebView高度适配问题
Hey George, I’ve run into this exact WebView height issue before—super frustrating when you want an equal split layout but the WebView refuses to fill its allocated space! The core problem is that WebView doesn’t automatically expand to match its parent’s height unless we explicitly configure it, and the fragment containers need setup to enforce equal heights without hardcoding dp/px values. Here are two reliable solutions:
Solution 1: LinearLayout with Weight (Simplest Approach)
Wrap your fragment containers in a vertical LinearLayout, and use layout_weight="1" paired with layout_height="0dp" for both containers. This tells Android to split the available vertical space equally between them.
Updated Activity Layout:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:divider="@null" android:showDividers="none"> <!-- Top Fragment Container --> <FrameLayout android:id="@+id/fragment_top" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> <!-- WebView Fragment Container --> <FrameLayout android:id="@+id/fragment_webview" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> </LinearLayout> </android.support.design.widget.CoordinatorLayout>
Fix the WebView Itself:
In your WebView’s fragment layout, add android:fillViewport="true" to force the WebView to fill its parent container even if the loaded content is shorter:
<WebView android:id="@+id/detail_webview" android:layout_width="match_parent" android:layout_height="match_parent" android:fillViewport="true" />
Solution 2: ConstraintLayout (More Flexible)
If you prefer using ConstraintLayout (great for complex layouts), use percentage-based height constraints to split the screen evenly:
Updated Activity Layout:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.constraint.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent"> <FrameLayout android:id="@+id/fragment_top" android:layout_width="match_parent" android:layout_height="0dp" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toTopOf="@id/fragment_webview" app:layout_constraintHeight_percent="0.5" /> <FrameLayout android:id="@+id/fragment_webview" android:layout_width="match_parent" android:layout_height="0dp" app:layout_constraintTop_toBottomOf="@id/fragment_top" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintHeight_percent="0.5" /> </android.support.constraint.ConstraintLayout> </android.support.design.widget.CoordinatorLayout>
Extra Code Tweak for WebView:
If your web content still doesn’t fill the space, add these settings in your fragment’s code to force the WebView to scale to fit the container:
WebView webView = view.findViewById(R.id.detail_webview); WebSettings webSettings = webView.getSettings(); webSettings.setLoadWithOverviewMode(true); webSettings.setUseWideViewPort(true);
Either of these approaches will ensure both fragments take exactly half the screen height, no fixed dimensions required. The key is making sure the fragment containers are set to expand equally, and the WebView is configured to fill its allocated space.
内容的提问来源于stack exchange,提问作者George Slupitsky




