简体   繁体   中英

Android webview content sometimes not fit the width

In my application ,

first I have some html code as string , then I load it into the webview like this:

WebView content = (WebView) rootView.findViewById(R.id.content);

StringBuilder sb = new StringBuilder();
        sb.append("<HTML><HEAD><meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'></HEAD><body>");
        sb.append(pageItem.page_content_chi.toString());
        sb.append("</body></HTML>");

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            content.getSettings().setAllowUniversalAccessFromFileURLs(true);
            content.getSettings().setAllowFileAccessFromFileURLs(true);
        }

        content.setWebChromeClient(new WebChromeClient());
        content.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                startActivity(intent);
                return true;
            }
        });

        content.getSettings().setUseWideViewPort(true);
        content.getSettings().setJavaScriptEnabled(true);
        content.getSettings().setLoadWithOverviewMode(true);
        content.getSettings().setAppCacheMaxSize(1024 * 1024 * 8);
        String cachePath = ctx.getCacheDir().getAbsolutePath();
        content.getSettings().setAppCachePath(cachePath);
        content.getSettings().setAppCacheEnabled(true);
        content.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);

        content.loadDataWithBaseURL("file:///android_asset/",sb.toString(), "text/html", "utf-8", null);
        content.setBackgroundColor(0x00000000);

        content.setOnTouchListener(new View.OnTouchListener() {
            public boolean onTouch(View v, MotionEvent event) {
                return (event.getAction() == MotionEvent.ACTION_MOVE);
            }
        });

        content.setVerticalScrollBarEnabled(false);
        content.setHorizontalScrollBarEnabled(false); 

Layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/bg"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:overScrollMode="never"
        android:scrollbars="vertical" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_margin="5dp"
                android:textSize="25sp"
                android:textStyle="bold" />

            <WebView
                android:id="@+id/content"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />
        </LinearLayout>
    </ScrollView>

</LinearLayout>

The problem is , the content inside webview sometimes fit to the width , however, it sometimes not fitting and exceed the width. It happen randomly , so when I click on the tab and reload the webview, it sometimes fit the view and sometimes exceed the view. How to fix this? Thanks a lot

Use the WebView Properties as

<WebView
                android:id="@+id/content"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" />

After you are done with this the next thing that you have to see is that the website which you are trying to get the content in your webview is responsive or not means that whether its working for all the screens at clear and fine resolution.if not then you must make the webpage Responsive to you that in Webview with as example

@media (min:320px , max:568px ){ Css Body}

Please add below code in manifest file:

<supports-screens android:smallScreens="true"
    android:normalScreens="true" android:largeScreens="true"
    android:anyDensity="true" />

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM