简体   繁体   中英

Android Webview layout not displaying correctly

I have build a sample Webview page displaying license agreement. It's working great on android Kitkat the text fit the page and you can scroll down.

But when I tried to run on android 9 or 10 the text does not display correctly as you can see from the screenshot below.

What Im I doing wrong ?

Update : this line is causing this :

            "<FONT COLOR=\"#0000ff\"><FONT SIZE=2><U>www.capturedoc.com</U></FONT></FONT></A><FONT SIZE=2>.</FONT></P>\n" +

Current Result (Android 9)

截屏

Expected Result (Android Kitkat)

截图2

LicenseAgreementActivity

        WebView licAgreementTextView = (WebView) findViewById(R.id.lic_agreement);

    String str = "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\">\n" +
            "<HTML>\n" +
            "<HEAD>\n" +
            "<META HTTP-EQUIV=\"CONTENT-TYPE\" CONTENT=\"text/html; charset=us-ascii\">\n" +
            "<TITLE></TITLE>\n" +
            "<META NAME=\"GENERATOR\" CONTENT=\"OpenOffice 4.1.1  (FreeBSD/amd64)\">\n" +
            "<META NAME=\"CREATED\" CONTENT=\"20180125;11134000\">\n" +
            "<META NAME=\"CHANGED\" CONTENT=\"0;0\">\n" +
            "<STYLE TYPE=\"text/css\">\n" +
            "\t<!--\n" +
            "\t\t@page { margin: 0.5in }\n" +
            "\t\tP { margin-bottom: 0.08in }\n" +
            "\t\tA:link { so-language: zxx }\n" +
            "\t-->\n" +
            "\t</STYLE>\n" +
            "</HEAD>\n" +
            "<BODY LANG=\"en-US\" DIR=\"LTR\" STYLE=\"border: none; padding: 0in\">\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2>This \n" +
            "End-User License Agreement (&ldquo;Agreement&rdquo;) governs your use \n" +
            "of the CaptureDoc Mobile Application software (&ldquo;Software&rdquo;) \n" +
            "provided by CaptureDoc, Inc and its affiliates (&ldquo;CaptureDoc&rdquo;).\n" +
            "Your use of the Software constitutes your acceptance of the terms of \n" +
            "this Agreement. Your use of the Software is also subject to the \n" +
            "signed agreement between CaptureDoc and your employer or in the \n" +
            "absence of a signed agreement, Capturedoc&rsquo;s standard license\n" +
            "terms as made available at " +
            "</FONT><A HREF=\"http://www.capturedoc.com/\">" +
            "<FONT COLOR=\"#0000ff\"><FONT SIZE=2><U>www.capturedoc.com</U></FONT></FONT></A><FONT SIZE=2>.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>1.\n" +
            "License.</B></FONT><FONT SIZE=2> The Software, in object code form only, solely on your mobile device.\n" +
            "You agree to the following license restrictions: (a) to not \n" +
            "duplicate, copy or redistribute the Software except as necessary for \n" +
            "use on your mobile device; and (b) to not modify, translate, make \n" +
            "derivative works of, disassemble, reverse engineer or otherwise use \n" +
            "the Software in order to build competitive technologies or for \n" +
            "competitive benchmark purposes.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>2.\n" +
            "Generally.</B></FONT><FONT SIZE=2> You agree that CaptureDoc shall not \n" +
            "have any liability to you for your use of the Software, including not \n" +
            "limited to your access or creation of content using the Software. By \n" +
            "using the Software, you acknowledge and agree that CaptureDoc is not \n" +
            "responsible for examining or evaluating the content, accuracy,\n" +
            "completeness, timeliness, validity, copyright compliance, legality,\n" +
            "decency, quality or any other aspect of the content accessed or \n" +
            "created by You. You further agree not to use the Software to infringe\n" +
            "or violate the rights of any other party, and that CaptureDoc is not \n" +
            "in any way responsible for any such use by you. </FONT>\n" +
            "</P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2>CaptureDoc \n" +
            "reserves the right to change, terminate, or disable access to the \n" +
            "Software as is reasonably necessary to ensure compliance with this \n" +
            "Agreement. In no event will CaptureDoc be liable for the change,\n" +
            "removal of, termination, or disabling of access to the Software. </FONT>\n" +
            "</P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>3.\n" +
            "Limitation Of Liability.</B></FONT><FONT SIZE=2> To the extent not \n" +
            "prohibited by law, in no event shall CaptureDoc be liable for personal \n" +
            "injury, or any incidental, special, indirect or consequential \n" +
            "damages, including, without limitation, damages for loss of profits,\n" +
            "loss of data, business interruption or any other commercial damages \n" +
            "or losses, arising out of or related to your use or inability to use \n" +
            "the Software or Services, however caused, regardless of the theory of \n" +
            "liability (contract, tort or otherwise) and even if CaptureDoc has \n" +
            "been advised of the possibility of such damages. In no event shall \n" +
            "CaptureDoc&rsquo;s total liability to you for all damages (other than\n" +
            "as may be required by applicable law in cases involving personal \n" +
            "injury) exceed the amount price paid for the Software, if any. The \n" +
            "foregoing limitations will apply even if the above stated remedy \n" +
            "fails of its essential purpose.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2>Some \n" +
            "jurisdictions do not allow the limitation of liability for personal \n" +
            "injury, or of incidental or consequential damages, so this limitation \n" +
            "may not apply to you.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>4.\n" +
            "Indemnification By You.</B></FONT><FONT SIZE=2> You agree to \n" +
            "indemnify and hold CaptureDoc, its subsidiaries, and affiliates, and \n" +
            "their respective officers, agents, partners and employees, harmless \n" +
            "from any loss, liability, claim or demand, including reasonable \n" +
            "attorney&rsquo;s fees, made by any third party due to or arising out \n" +
            "of your use of the Software in violation of this Agreement, and in \n" +
            "the event that any content accessed or created by you causes \n" +
            "CaptureDoc to be liable to another.</FONT></P>\n" +
            "</BODY>\n" +
            "</HTML>";

    licAgreementTextView.loadData(str, "text/html; charset=utf-8", "UTF-8" );
  }

content_license_agreement

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context=".copyright.LicenseAgreementActivity"
tools:showIn="@layout/activity_license_agreement">

 <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="20dp"
    tools:layout_editor_absoluteX="30dp"
    tools:layout_editor_absoluteY="30dp">

    <WebView
        android:id="@+id/lic_agreement"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

 </LinearLayout>

 </androidx.constraintlayout.widget.ConstraintLayout>

For some strange reason the tag <FONT COLOR="#0000ff">...</FONT> doesn't work properly try to change it with the following. It works for me on Android API 29.

"       <FONT COLOR=\"blue\">" +
"           <FONT SIZE=2>" +
"               <U>www.capturedoc.com</U>" +
"           </FONT>" +
"       </FONT>" +

Also I deleted the ConstraintLayout in the content_license_agreement.xml and now looks as follow:

<LinearLayout android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="20dp"
    android:padding="20dp"
    xmlns:android="http://schemas.android.com/apk/res/android">

        <WebView

            android:id="@+id/lic_agreement"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

</LinearLayout>

And finally here is the resulting activity:

I tried displaying your HTML String in a simple Webview app and it works! I'm on android 9 x86. I'll share the "simple code" version hoping it can help. Try running a simpler version of your app (no activities in activities).

带有 webview 的 HTML 查看器

MainActivity:

        WebView wbv = findViewById(R.id.wbview);

    String html = "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\">\n" +
            "<HTML>\n" +
            "<HEAD>\n" +
            "<META HTTP-EQUIV=\"CONTENT-TYPE\" CONTENT=\"text/html; charset=us-ascii\">\n" +
            "<TITLE></TITLE>\n" +
            "<META NAME=\"GENERATOR\" CONTENT=\"OpenOffice 4.1.1  (FreeBSD/amd64)\">\n" +
            "<META NAME=\"CREATED\" CONTENT=\"20180125;11134000\">\n" +
            "<META NAME=\"CHANGED\" CONTENT=\"0;0\">\n" +
            "<STYLE TYPE=\"text/css\">\n" +
            "\t<!--\n" +
            "\t\t@page { margin: 0.5in }\n" +
            "\t\tP { margin-bottom: 0.08in }\n" +
            "\t\tA:link { so-language: zxx }\n" +
            "\t-->\n" +
            "\t</STYLE>\n" +
            "</HEAD>\n" +
            "<BODY LANG=\"en-US\" DIR=\"LTR\" STYLE=\"border: none; padding: 0in\">\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2>This \n" +
            "End-User License Agreement (&ldquo;Agreement&rdquo;) governs your use \n" +
            "of the CaptureDoc Mobile Application software (&ldquo;Software&rdquo;) \n" +
            "provided by CaptureDoc, Inc and its affiliates (&ldquo;CaptureDoc&rdquo;).\n" +
            "Your use of the Software constitutes your acceptance of the terms of \n" +
            "this Agreement. Your use of the Software is also subject to the \n" +
            "signed agreement between CaptureDoc and your employer or in the \n" +
            "absence of a signed agreement, Capturedoc&rsquo;s standard license\n" +
            "terms as made available at " +
            "</FONT><A HREF=\"http://www.capturedoc.com/\">" +
            "<FONT COLOR=\"#0000ff\"><FONT SIZE=2><U>www.capturedoc.com</U></FONT></FONT></A><FONT SIZE=2>.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>1.\n" +
            "License.</B></FONT><FONT SIZE=2> The Software, in object code form only, solely on your mobile device.\n" +
            "You agree to the following license restrictions: (a) to not \n" +
            "duplicate, copy or redistribute the Software except as necessary for \n" +
            "use on your mobile device; and (b) to not modify, translate, make \n" +
            "derivative works of, disassemble, reverse engineer or otherwise use \n" +
            "the Software in order to build competitive technologies or for \n" +
            "competitive benchmark purposes.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>2.\n" +
            "Generally.</B></FONT><FONT SIZE=2> You agree that CaptureDoc shall not \n" +
            "have any liability to you for your use of the Software, including not \n" +
            "limited to your access or creation of content using the Software. By \n" +
            "using the Software, you acknowledge and agree that CaptureDoc is not \n" +
            "responsible for examining or evaluating the content, accuracy,\n" +
            "completeness, timeliness, validity, copyright compliance, legality,\n" +
            "decency, quality or any other aspect of the content accessed or \n" +
            "created by You. You further agree not to use the Software to infringe\n" +
            "or violate the rights of any other party, and that CaptureDoc is not \n" +
            "in any way responsible for any such use by you. </FONT>\n" +
            "</P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2>CaptureDoc \n" +
            "reserves the right to change, terminate, or disable access to the \n" +
            "Software as is reasonably necessary to ensure compliance with this \n" +
            "Agreement. In no event will CaptureDoc be liable for the change,\n" +
            "removal of, termination, or disabling of access to the Software. </FONT>\n" +
            "</P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>3.\n" +
            "Limitation Of Liability.</B></FONT><FONT SIZE=2> To the extent not \n" +
            "prohibited by law, in no event shall CaptureDoc be liable for personal \n" +
            "injury, or any incidental, special, indirect or consequential \n" +
            "damages, including, without limitation, damages for loss of profits,\n" +
            "loss of data, business interruption or any other commercial damages \n" +
            "or losses, arising out of or related to your use or inability to use \n" +
            "the Software or Services, however caused, regardless of the theory of \n" +
            "liability (contract, tort or otherwise) and even if CaptureDoc has \n" +
            "been advised of the possibility of such damages. In no event shall \n" +
            "CaptureDoc&rsquo;s total liability to you for all damages (other than\n" +
            "as may be required by applicable law in cases involving personal \n" +
            "injury) exceed the amount price paid for the Software, if any. The \n" +
            "foregoing limitations will apply even if the above stated remedy \n" +
            "fails of its essential purpose.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2>Some \n" +
            "jurisdictions do not allow the limitation of liability for personal \n" +
            "injury, or of incidental or consequential damages, so this limitation \n" +
            "may not apply to you.</FONT></P>\n" +
            "<P STYLE=\"margin-top: 0.07in; margin-bottom: 0.07in\"><FONT SIZE=2><B>4.\n" +
            "Indemnification By You.</B></FONT><FONT SIZE=2> You agree to \n" +
            "indemnify and hold CaptureDoc, its subsidiaries, and affiliates, and \n" +
            "their respective officers, agents, partners and employees, harmless \n" +
            "from any loss, liability, claim or demand, including reasonable \n" +
            "attorney&rsquo;s fees, made by any third party due to or arising out \n" +
            "of your use of the Software in violation of this Agreement, and in \n" +
            "the event that any content accessed or created by you causes \n" +
            "CaptureDoc to be liable to another.</FONT></P>\n" +
            "</BODY>\n" +
            "</HTML>";

    wbv.loadData(html, "text/html", "UTF-8");

activity_main:

 <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <WebView android:id="@+id/wbview" android:layout_width="match_parent" android:layout_height="match_parent" /> </androidx.constraintlayout.widget.ConstraintLayout>

@dmak2709 Answer is likely to work. However it does not answer the question why WebLayout does not display correctly. It is because of

"<FONT COLOR=\"#0000ff\"><FONT SIZE=2><U>www.capturedoc.com</U></FONT></FONT></A><FONT SIZE=2>.</FONT></P>\n" 

To be more specific it is caused by just this symbol # in #0000ff . Here is explanation in detail https://developer.android.com/reference/android/webkit/WebView.html#loadData(java.lang.String,%20java.lang.String,%20java.lang.String)

The gist of it is this: he encoding parameter specifies whether the data is base64 or URL encoded. If the data is base64 encoded, the value of the encoding parameter must be "base64". HTML can be encoded with Base64.encodeToString(byte[], int) like so:

    String unencodedHtml =
     "<html><body>'%28' is the code for '('</body></html>";
 String encodedHtml = Base64.encodeToString(unencodedHtml.getBytes(), Base64.NO_PADDING);
 webView.loadData(encodedHtml, "text/html", "base64");

For all other values of encoding (including null) it is assumed that the data uses ASCII encoding for octets inside the range of safe URL characters and use the standard %xx hex encoding of URLs for octets outside that range. See RFC 3986 for more information. Applications targeting Build.VERSION_CODES.Q or later must either use base64 or encode any # characters in the content as %23, otherwise they will be treated as the end of the content and the remaining text used as a document fragment identifier.

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