While building a SNS hybrid application, I noticed that the webview gets scrolled nearly twice the distance than the actual gesture distance. This does not happen always, but I could not figure out the condition for this issue. The content of the webview gets extended as I scroll down, so I am suspecting that it is happening when I interact with the webview while the webview itself is loading and the content of the webview is getting extended. The below is the settings of my webview.
ps. once this issue occurs, it does not go away even if you navigate to another page.
iWebViewClient = new IWebViewClient(onActivity);
iWebChromeClient = new IWebChromeClient(onActivity, mContainer, webView, pbar);
webView.setWebViewClient(iWebViewClient);
webView.setWebChromeClient(iWebChromeClient);
webView.setVerticalScrollBarEnabled(false);
// javascript interface
webView.addJavascriptInterface(new WebViewInterface(onActivity), "ApplicationInterface");
WebSettings webSettings = webView.getSettings();
// enable javascript and storage
webSettings.setJavaScriptEnabled(true);
webSettings.setDomStorageEnabled(true);
webSettings.setAllowFileAccess(true);
webSettings.setJavaScriptCanOpenWindowsAutomatically(true); // allow new window to open
webSettings.setSupportMultipleWindows(true);
webSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
// enable css
WebView.setWebContentsDebuggingEnabled(true);
webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);
// disable cache
webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);
// set useragent
String device = "Android " + Build.VERSION.RELEASE;
String appVersion = " " + BuildConfig.APPLICATION_ID + "/" + BuildConfig.VERSION_NAME;
String agentNew = webSettings.getUserAgentString() + appVersion + " (" + device + ")";
webSettings.setUserAgentString(agentNew);
if(initUrl != null){
webView.loadUrl(initUrl);
}else{
webView.loadUrl(HostUrls.webSite);
}
Turns out this only happens when my device is connected to chrome remote device inspection tool.
Once I connected my device to chrome inspection, the scroll speed doubled immediately and vice versa.
Related
I am building an Android app which contains a few videos from YouTube. When I try to use WebView with the appropriate iframe string, the video player does not fit the WebView dimensions (awkward extra white spaces, sometimes with a scroll bar). I want the video to match the webview dimensions exactly.
This is what I have tried so far.
WebView webView = new WebView(this);
RelativeLayout rel = findViewById(R.id.test_layout);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);
webView.setWebChromeClient(new WebChromeClient());
String html2 = "<html><head>"+
"<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n" +
"</head>\n" +
"<body>\n"+
"<iframe width=\"500\" height=\"250\" src=\"https://www.youtube.com/embed/LOuAOZWJ9RA?feature=oembed&autoplay=true\" title=\"YouTube video player\" frameborder=\"0\"\n" +
"allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>\n" +
"</body>\n" +
"</html>";
RelativeLayout.LayoutParams params= new RelativeLayout.LayoutParams(500,250);
params.leftMargin = 36;
params.topMargin = 426;
rel.addView(webView,params);
webView.loadData(html2, "text/html", "utf-8");
Image of output
PS: I am extremely new to Android dev. Any kind of help will be much appreciated
I have a Jquery Mobile 1.4 with Jquery 2.0 webpage which I serve in an Android Webview (Android 4+). All worked fine until I started to use SSE. The App periodically crashes due to a Signal 11 on the WebViewCoreThread.
This happens only when navigating from and to pages, and then randomly.
There is no stacktrace, just the Signal 11 at 0x00000000.
This is the javascript code:
if ( typeof (EventSource) !== "undefined") {
// sse
//console.log("sse");
chatnotificationsource = new EventSource("php/process_get_chat_notification.php");
chatnotificationsource.onmessage = function(event) {
var message = event.data;
console.log("got message " + message);
$("#chatnotification").show();
};
}
When I switch off the SSE code there is no problem, so it has clearly to do with the SSE call. I am using the following WebView initialisation.
#SuppressLint("SetJavaScriptEnabled")
protected void createWebView(int webViewId) {
webView = (WebView) findViewById(webViewId);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setPluginState(WebSettings.PluginState.ON);
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setRenderPriority(RenderPriority.HIGH);
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setAppCacheMaxSize(20 * 1024 * 1024); // 20MB
webView.getSettings().setAppCachePath(
getApplicationContext().getCacheDir().getAbsolutePath());
webView.getSettings().setAllowFileAccess(true);
webView.getSettings().setAppCacheEnabled(true);
// load online by default
webView.getSettings().setCacheMode(WebSettings.LOAD_DEFAULT);
webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
if (!connectionDetector.isConnectingToInternet()) {
// loading offline
webView.getSettings().setCacheMode(
WebSettings.LOAD_CACHE_ELSE_NETWORK);
}
// clients
webView.setWebViewClient(customWebViewClient);
webView.setWebChromeClient(customWebChromeClient);
}
I expect is has something to do with Android navigating to another page while the SSE call is running or "processing".
Thanks for your help,
Coenos
Moving away from SSE in combination with Android WebView fixes the issue. There is no WebView patch/update or workaround for this (yet).
I am new to android. I am developing epub reader for android devices. webview shows text in left alignment. i want it to be justify. i am not sure this is text alignment problem.
This is my webview settings:
final WebView mainWebView = (WebView) findViewById(R.id.webView1);
WebSettings webSettings = mainWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setUseWideViewPort(true);
webSettings.setLoadWithOverviewMode(true);
mainWebView.setWebViewClient(new MyCustomWebViewClient());
mainWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
mainWebView.loadUrl("my html page");// loding my html pages here
mainWebView.getSettings().setUseWideViewPort(true);
i used this code for text alignment
mainWebView.loadUrl("javascript:(function addCSSRule(selector, newRule) { " +
"var mySheet = document.styleSheets[0];"+
"if (mySheet.addRule) { " +
"mySheet.addRule(selector, newRule);" +
"} else {"+
"ruleIndex = mySheet.cssRules.length;"+
"mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex);" +
"}"+
"})addCSSRule(selector, newRule)");
mainWebView.loadUrl("javascript:addCSSRule('p', 'text-align: justify;');");
if i remove mainWebView.getSettings().setUseWideViewPort(true); means i am getting justify text.
Screenshot of webview:
i want it to be like this:
i don't know whats wrong in my code. mainWebView.getSettings().setUseWideViewPort(true); allows to zoom. don't know why it kills text alignment. please help me to overcome this issue.
Thanks in advance.
It doesn't seem like you're applying your webSettings to the web view. I'm looking for something along the lines of
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl(url);
so perhaps your javascript isn't firing because it's not on... ?
I am having a lot of trouble trying to play some youtube videos inside an Android Webview. I search everywhere but cannot find a solution that works.
I am using the following code:
WebView mWebView = (WebView) findViewById(R.id.webView1);
//Setup Webview
WebChromeClient client= new WebChromeClient();
mWebView.setWebChromeClient(client);
mWebView.getSettings().setPluginsEnabled(true);
mWebView.getSettings().setSupportZoom(false);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setRenderPriority(RenderPriority.HIGH);
mWebView.getSettings().setAllowFileAccess(true);
mWebView.loadDataWithBaseURL("www.youtube.com", "<iframe class=\"youtube-player\" type=\"text/html\" width=\"640\" height=\"385\" src=\"http://www.youtube.com/embed/JEkbk-xDmZE?html5=1\" frameborder=\"0\">\n</iframe>", "text/html", "UTF-8", "");
The problem seems to be only with certain streams like this one: http://www.youtube.com/watch?v=JEkbk-xDmZE
The sound is great but the video is very slow, like 1 frame per second. unwatchable.
But if I use this stream: http://www.youtube.com/watch?v=GDFIYKmNw9Q
It works perfectly fine.
What is the difference between these live streams and how do I get the first one to play properly?
Also I should mention that sometimes the first one DOES play just fine. I am not able to figure out why it sometimes plays and other times doesn't. I've tried creating a new project with pretty much just a Webview and a Factory Reset device to eliminate any settings that may be effecting this but I still get the problem.
I've struggled with YouTube in general, trying to get it to work on android. Why certain videos lag is beyond me, but it might be different quality settings and limited bandwidth thus its buffering.
Hopefully one of the options below might help if it's not a buffering issue.
Currently, with WebView you use either use an IFrame or the YouTube API. Otherwise you can use the GData API to get the RSTP link to the video for use in a VideoView. Finally you can use an Intent to launch the YouTube app.
In the future there is a new API for Android for YouTube. But it has not been released. Theme again neither has Fragment support for Google Maps that was announced in Dec 2011. - http://www.youtube.com/watch?v=3WFsx-u-q3Y
Pros/Cons below (Examples are all making the WebView fill 100% of screen height and width)
WebView - IFrame - Limited configuration available. Runs in the WebView and works on nearly all platforms. Don't get me wrong, sometimes different options do not work, and you get a grey background when you try to play the video. Use the following site to create the IFrame code and try different options until it works for you - https://developers.google.com/youtube/youtube_player_demo (Do note several of the allowed configuration options do not work, such as hide controls has no effect). As mentioned there are lots of different options so trial and error is involved. Whilst several don't work, some look quite different. Looking at your question, i've never used the html5=1 option before, or set youtube.com as the base url.
webView = new WebView(this);
webView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT));
webView.getSettings().setPluginState(PluginState.ON);
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setAppCacheEnabled(true);
webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
webView.getSettings().setJavaScriptEnabled(true);
// Prevent scrolling of the webview
webView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
webView.setHorizontalScrollBarEnabled(false);
webView.setVerticalScrollBarEnabled(false);
webView.setWebChromeClient(new WebChromeClient()); //Blank webview to prevent null pointer plugin issues
webView.setWebViewClient(new WebViewClient()
{
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url)
{
view.loadUrl(url);
return true;
}
});
String data = "<html>"+
"<head>"+
"</head>"+
"<body style=\"margin: 0; padding: 0\">"+
"<iframe " +
"type=\"text/html\" "+
"class=\"youtube-player\" "+
"width=\"100%25\" "+
"height=\"100%25\" "+
"src=\"http://www.youtube.com/v/" + uri +
"?controls=0&showinfo=0&showsearch=0&modestbranding=1&fs=0\" "+
"frameborder=\"0\"></iframe>" +
"</body>"+
"</html>";
webView.loadData(data, "text/html", "utf-8");
WebView - YouTube API - Much better, but requires flash. Therefore "Nexus 7" and any future devices released with JellyBean (4.1 and above) will not work. As the WebView on those devices uses a cut down version of Chrome rather than a cut down version of WebBrowser. Therefore as I found out yesterday, going forward this can't be used on our apps.
webView = new WebView(this);
webView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT));
webView.getSettings().setPluginState(PluginState.ON);
webView.getSettings().setLoadsImagesAutomatically(true);
webView.getSettings().setAppCacheEnabled(true);
webView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
webView.getSettings().setJavaScriptEnabled(true);
// Prevent scrolling of the webview
webView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
webView.setHorizontalScrollBarEnabled(false);
webView.setVerticalScrollBarEnabled(false);
webView.setWebChromeClient(new WebChromeClient()); //Blank webview to prevent null pointer plugin issues
webView.setWebViewClient(new WebViewClient()
{
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url)
{
view.loadUrl(url);
return true;
}
});
String data = "<!DOCTYPE HTML>" + "<html>" + "<body style=\"margin: 0; padding: 0\">"
+ "<div id=\"player\"></div>"
+ "<script>"
+
// Load player api asynchronously.
"var tag = document.createElement('script');" + "tag.src = \"http://www.youtube.com/player_api\";"
+ "var firstScriptTag = document.getElementsByTagName('script')[0];" + "firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);"
+ "var done = false;" + "var player;" + "function onYouTubePlayerAPIReady() {" + "player = new YT.Player('player', {" + "height: '100%25',"
+ "width: '100%25'," + "videoId: '"
+ uri
+ "',"
+ "playerVars: { 'controls': "
+ controls
+ ", 'showinfo': 0, 'fs':0, 'modestbranding':1 },"
+ "events: {"
+ "'onReady': onPlayerReady," + "'onStateChange': onPlayerStateChange" + "}" + "});" + "}" + "function onPlayerReady(evt) {" +
// Autoplay
"evt.target.playVideo();" + "}" + "function onPlayerStateChange(evt) {" +
"}" + "function stopVideo() {" + "player.stopVideo();" + "}" + "</script>" + "</body>" + "</html>";
webView.loadData(data, "text/html", "utf-8");
VideoView - YouTube Data API - Can get access to information and importantly links to the video streams for use in a VideoView. The draw back is the free API is limited to low quaility 3GP videos not the MP4 (high quality/HD) streams. - https://developers.google.com/youtube/getting_started#data_api
Intent - Launch YouTube - Open the YouTube app with the video you want to play. Drawback is that another app is opened, thus not embedded into your app, and that some devices don't have YouTube installed.
if (AppChecker.isAppInstalled("com.google.android.youtube", this) == true)
{
Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse("vnd.youtube:" + uri));
startActivity(intent);
}
else
{
//Show youtube not installed
}
//Code to check if YouTube is installed.
public class AppChecker
{
public static boolean isAppInstalled(String uri, Activity activity)
{
PackageManager pm = activity.getApplicationContext().getPackageManager();
boolean app_installed = false;
try
{
pm.getPackageInfo(uri, PackageManager.GET_ACTIVITIES);
app_installed = true;
}
catch (PackageManager.NameNotFoundException e)
{
app_installed = false;
}
return app_installed;
}
}
I want to create very simple application with 2 view:
-> list with some tags
-> single view with movie
every tag is connected to a flash movie. The movie will be on my own server in web. I want to play in my app this movie with a some player. But not via web browser but inside my application. is that possible ? What do I need to do to achive that ? I mean how to play the movie. Building list etc is easy
Use web view with the following settings:
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setAllowFileAccess(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setPluginState(WebSettings.PluginState.ON);
webSettings.setPluginsEnabled(true);
To make sure flash is installed use:
public boolean isFlashAvailable() {
try {
String mVersion = mContext.getPackageManager().getPackageInfo(ADOBE_FLASH_PLAYER_PACKAGE_NAME, 0).versionName;
//Log.d("Flash", "Installed: " + mVersion);
return true;
} catch (NameNotFoundException e) {
//Log.d("Flash", "Not installed");
return false;
}
}
Perhaps you could WebView to play some HTML which uses a flash.