I am loading some Html content using CSS in a WebView.
Everything works fine on every phone, but HTC has one x (version for Android 4.1.1).
In WebView, nothing is displayed on this phone.
The following is a snippet of code.
A function that gives me formatted WebView content:
public String getFormattedWebViewContents(String content) { String htmlString = "ul{" + "padding-left: 10px;" + "padding-bottom:7px;" + "color:#818181;" + "font-size: 10px;font-family: Verdana, Arial, Helvetica, sans-serif; }" + "ul .bdr { line-height: 16px;}" + ".flt-lt{float:left;}" + ".flt-rt{float:right;}" + "ul li{padding:10px 5px 10px 10px !important;}"+ "ul li h4 {height: 25px; border: 1px solid #DEDEDE; font-family:Calibri;font-size:18px;" + "margin-bottom:10px !important;font-weight:bold;text-align: left; vertical-align: middle;margin-left: -7px;" + "margin-right: 0px !important;" + "color: #7CA834;" + "font-family: Calibri;" + "font-size: 18px;" + "font-weight: bold;" + "height: 25px;" + "margin-bottom: 1px;" + "padding-left: 10px;" + "padding-top: 10px !important;" + "text-align: left;"+ "vertical-align: middle;"+ "background-color: #F2F2F2;color: #7CA834;}"+ ".bdr1 .sml-font{font-size:11px !important;padding-top:3px ;color: #7CA834 !important;font-family: Arial !important;font-weight: bold !important;}"+ "ul{margin-bottom:14px; margin-top:12px;background-color: #ffffff; padding-left:10px; padding-right:0px; padding-top:10px; }"+ "ul{padding-left: 10px;padding-top:8px;padding-bottom:7px;color: #818181;font-size:10px;font-family: Verdana, Arial, Helvetica, sans-serif;}"+ "#factstable td{ width:170px; height:18px;}"+ ".ext { float:right; }"+ ".factsdetaildiv{border: 1px solid #DEDEDE;padding-left: 10px;padding-bottom:7px;color:#818181;font-size: 10px;font-family: Verdana, Arial, Helvetica, sans-serif; }"+ "ul .bdr { line-height: 16px;}"+ "ul{color:#818181;font-size: 10px;font-family: Verdana, Arial, Helvetica, sans-serif; }"+ "ul{list-style-type:none;margin-right: 0px; padding:10px;}"+ "ul li{padding-bottom:7px; padding-top:10px !important;line-height:10PX; list-style-image:none;font-size:11px;font-family:Arial, Helvetica, sans-serif;}"+ "ul{ font-weight:bold;}"+ "ul p{ padding:0px 10px 0px 0px;line-height: 12px;color: #818181;font-size: 12px;font-family: Arial;}" + " li:first-child { margin-top:-38px !important; padding:10px 5px 10px 10px;}" ; return "<html>" + "<head>" + "<style type=\"text/css\"> " + "@font-face " + "{ " + "font-family: MyCustomFont; " + "src: url(\"file:///android_asset/font/" + mContext.getResources().getString(R.string.type_face_regular) + "\") " + "}" + "body " + "{ " + "font-family: MyCustomFont; " + "font-size: "+(Utility.isLargeScreen(mContext)? "22px; ": "18px; ") + "color: black" + "}" + htmlString + "</style>" + "</head><body style='margin: 10px'>" + content + "</body></html>"; }
My webview:
mDetailsContentsWebView.setBackgroundColor(getResources().getColor(R.color.color_product_details_webview_bg)); mDetailsContentsWebView.loadDataWithBaseURL("", Utility.getInstance(getActivity()).getFormattedWebViewContents(mCurrentProductDetails.mDescription), "text/html", "UTF-8", ""); mDetailsContentsWebView.getSettings().setSupportZoom(false); mDetailsContentsWebView.getSettings().setJavaScriptEnabled(true); mDetailsContentsWebView.setOnTouchListener(new View.OnTouchListener() { public boolean onTouch(View v, MotionEvent event) { switch(event.getAction()) { case MotionEvent.ACTION_DOWN: { } break; case MotionEvent.ACTION_MOVE: case MotionEvent.ACTION_CANCEL: case MotionEvent.ACTION_UP: { event.setLocation(event.getX(), event.getY()); } break; } return false; } });
Please someone let me know if this is a problem with the HTC phone or my code snippet. Thanks.
Amrut source share