Am implementing one movie app. So take embeded youtube using iframe. It's working in large devices but in mobile devices it showing black screen after streaming? Please help me
this.webview.getSettings().setJavaScriptEnabled(true);
this.webview.getSettings().setBuiltInZoomControls(true);
this.webview.getSettings().setJavaScriptCanOpenWindowsAutomatically(false);
this.webview.getSettings().setPluginState(WebSettings.PluginState.ON);
this.webview.getSettings().setSupportMultipleWindows(false);
this.webview.getSettings().setSupportZoom(false);
this.webview.setVerticalScrollBarEnabled(false);
this.webview.setHorizontalScrollBarEnabled(false);
final String mimeType = "text/html";
final String encoding = "UTF-8";
String html = getHTML();
webview.loadDataWithBaseURL("", html, mimeType, encoding, "");
and:
public String getHTML1() {
Log.d("trailer_2 HTML", "ok");
String html1 = "<html><head><meta name=\"viewport=target-densitydpi=device-dpi\" content=\"width=320"
+ this.frame_width
+ ", height"
+ this.frame_height
+ ",initial-scale=1.0, minimum-scale=1.0,user-scalable=no\"/>"
+ "</head>"
+ "<body style=\" background:transparent; margin: 0; padding: 0\">"
+ "<iframe class=\"youtube-player\" style=\"border:0; width: 100%; height:100%; padding:0px; margin:0px\" id=\"ytplayer\" type=\"application/x-shockwave-flash\"allowscriptaccess=\"always\" allowfullscreen=\"true\" src=\"http://www.youtube.com/embed/"
+ "H7Ht-m2QMDY"
+ "?fs=0\" frameborder=\"0\">\n"
+ "</iframe>\n";
return html1;
}
In manifest i have mention android:hardwareAccelerated="true" and <uses-permission android:name="android.permission.INTERNET" />
..thanks in advance
ur phone need flash player support. And if u have flash player also it
will not display first time,u need to double tap on player then it will work. Instead of that
u can use android native YouTube player APi. Its in beta version now ,but its working
awesome.
Related
How to get this audio player in webview,if we play a audio link in chrome or any browser,
it gives something like above by default,Can we get exactly like in android webview.
I tried to get html elements,but UI was looking very odd-
Attempt 1-
var iframeURL = string.Format("<video width=\"{0}\" height=\"{1}\" controls=\"\" autoplay=\"\" name=\"media\"><source src=\"{2}\" type=\"audio/mpeg\"></video>",
width, height, embedUrl);
string finalUrl = string.Format("<html><body>{0}</body></html>", iframeURL);
and this final url is my web source
Attempt 2-
var iframeURL = string.Format("<iframe style=\"position:fixed; top: 50%; left: 50%;" +
" width:" + " {1}px; height: {2}px; margin-left: {3}px; margin-top: {4}px;\"" + " src =\"{0}\" frameborder=\"0\" " + "allow=\"accelerometer;" +
" autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen></iframe>",
embedUrl, width, height, -width / 2, -height / 2);
string finalUrl = string.Format("<html><body>{0}</body></html>", iframeURL);
return finalUrl;
This should be do it,
var html = string.Format("<!DOCTYPE html><html><head><meta name=\"viewport\"
content=\"width=device-width, initial-scale=1.0\"></head><body><audio controls
autoplay name=\"media\"><source src=\"{0}\" type=\"audio/mpeg\"></audio>
</body></html>",embedUrl);
webView.Source = new HtmlWebViewSource
{
Html = html,
};
XAML:
<WebView x:Name="webView" VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"></WebView>
Result:
My problem is how to a show video from the admin backend into my android app. When I and adding the iframe from TinyMCE Editor, it looks like this:
But in my android app I get this:
I cannot understand what exactly is happening and I'm sharing you a section of my code of what I'm doing in the fragment.
if (item.getContent().length() != 0) {
mWebView.setVisibility(View.VISIBLE);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setLoadWithOverviewMode(true);
mWebView.getSettings().setUseWideViewPort(true);
mWebView.getSettings().setMinimumFontSize(14);
String htmlContent = "<?xml version=\"1.0\" encoding=\"UTF-8\" ?>"
+ "<head>"
+ "<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\" />"
+ "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"/>"
+ "<style type=\"text/css\">body{color: #525252;} img {max-width: 100%; height: auto}</style>"
+ "</head>"
+ item.getContent()
+ "";
mWebView.loadData(htmlContent, "text/html; charset=utf-8", "UTF-8");
} else {
mWebView.setVisibility(View.GONE);
}
if (item.getImgUrl().length() > 0) {
imageLoader.get(item.getImgUrl(), ImageLoader.getImageListener(mItemImg, R.drawable.img_loading, R.drawable.img_loading));
mItemImg.setVisibility(View.VISIBLE);
mItemImgSeparatorLine.setVisibility(View.VISIBLE);
} else {
mItemImg.setVisibility(View.GONE);
mItemImgSeparatorLine.setVisibility(View.GONE);
}
mPostTopSeparatorLine.setVisibility(View.GONE);
mPostMessage.setVisibility(View.GONE);
if (item.getAllowComments() == 0 && App.getInstance().getId() != 0) {
mPostTopSeparatorLine.setVisibility(View.VISIBLE);
mPostMessage.setVisibility(View.VISIBLE);
mPostMessage.setText(getString(R.string.msg_comments_disabled));
}
if (App.getInstance().getId() == 0) {
mPostTopSeparatorLine.setVisibility(View.VISIBLE);
mPostMessage.setVisibility(View.VISIBLE);
mPostMessage.setText(getString(R.string.msg_auth_prompt_comment));
}
}
For my Android App I'm working with a WebView as you can see in the above code. Do you have any idea why is it not working as expected? Thanks for your help.
You are trying to load an iFrame in WebView. To do so, use first create a string with the HTML.
String html = "<iframe width=\"560\" height=\"315\" src=\"your_src\" frameborder=\"0\" allowfullscreen></iframe>";
Now call loadData.
mWebview.loadData(html, "text/html", null);
Hello i am working on android application in which i want to play vimeo videos , i am getting response from Api in json and playing video using webview and it is playing good , but the webview is displaying very small and the playing video is also small my problems are
I want playing video width to be according to android device width. I can get it from Displaymetrics but how to set to iframe ?
I want to inflate custom view of media controller for playing videos.
Custom controller like play pause icon
I am getting this kind of url response from api
<iframe src="https://player.vimeo.com/video/video_id" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
at video_id i am getting the video id
Below is the code which i used
webView.setWebChromeClient(new WebChromeClient());
webView.getSettings().setAllowFileAccess(true);
webView.getSettings().setPluginState(WebSettings.PluginState.ON);
webView.getSettings().setPluginState(WebSettings.PluginState.ON_DEMAND);
webView.setWebViewClient(new WebViewClient());
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setLoadWithOverviewMode(true);
webView.getSettings().setUseWideViewPort(true);
String data_html=getexplore_list.get(pos).getVideo_url();
webView.loadDataWithBaseURL("http://vimeo.com", data_html, "text/html", "UTF-8", null);
Please Provide any solution or link will be grateful
use style in html,
String url = "<iframe src=\"" + videoUrl + "\" style=\"border: 0; width: 100%; height: 95%; padding:0px; margin:0px\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>";
mViewHolder.webView.getSettings().setJavaScriptEnabled(true);
String yourData = "<div id='made-in-ny'></div>\n" +
"\n" +
"<script src='https://player.vimeo.com/api/player.js'></script>\n" +
"<script>\n" +
" var options = {\n" +
" id: 59777392,\n" +
" width: 540,\n" +
" loop: true\n" +
" };\n" +
"\n" +
" var player = new Vimeo.Player('made-in-ny', options);\n" +
"\n" +
" player.setVolume(0);\n" +
"\n" +
" player.on('play', function() {\n" +
" console.log('played the video!');\n" +
" });\n" +
"</script>";
mViewHolder.webView.loadData(yourData, "text/html; charset=utf-8", "UTF-8");
change id and width. it is working.
I'm working on an Android project with webview. Everything works fine but I can't set text to a textarea. I have a bunch of pages that have a memo-writing option. I'm loading the code for the memo to a page with jQuery:
$('#memoContainer').load("memo.html");
memo.html textarea:
<div class="sisalto">
<textarea id="memo" style="width: 100%"> </textarea>
</div>
The textarea works, I can write in it and I can get the contents and save it in Android with jQuery:
function save(){
var newContent = $('#memo').val();
AndroidFunction.saveFile(newContent);
}
I'm trying to get the saved contents and set it in the textarea:
var setMemo = $('#memo');
setMemo.innerText("DOESNT WORK");
setMemo.val('NOPE');
I've tried googling and browsing here for hours but can't seem to find anything useful. Many suggest the .val('smth'); option but it just doesn't work.
The memo is loaded before trying to set the content and everything is OK in my opinion. What is the problem here and any idea on how can I get this done?
Okay, the problem was the load-function. It loads the memo.html and shows it on the page but the actual code isn't injected to the page. Hence I can't set text to the textarea because it isn't actually there.
You should use a 'complete' function callback
$('#memoContainer').load('memo.html', function() {
var setMemo = $('#memo');
setMemo.val('hello');
});
Are you enabling javascript with the WebView? You need this to enable javascript:
WebView webView = ...
webView.getSettings().setJavaScriptEnabled(true);
Be sure jQuery is correctly loaded, can you post your code?
Here a working example (need internet permission since it uses CDN to load jquery):
import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
String html = "<html>\n" +
"<body>\n" +
"<textarea id=\"area\"></textarea>\n" +
"\n" +
"<script src=\"http://code.jquery.com/jquery-1.10.0.min.js\"></script>\n" +
"<script src=\"http://code.jquery.com/jquery-migrate-1.2.1.min.js\"></script>\n" +
"\n" +
"<script type=\"text/javascript\">\n" +
" $(document).ready(function() {\n" +
" var area = $('#area');\n" +
" area.val('Hello');\n" +
" });\n" +
"</script>\n" +
"\n" +
"</body>\n" +
"</html>";
String mime = "text/html";
String encoding = "utf-8";
setContentView(R.layout.activity_main);
WebView web = (WebView) this.findViewById(R.id.web);
web.getSettings().setJavaScriptEnabled(true);
web.loadDataWithBaseURL(null, html, mime, encoding, null);
}
}
I'm new in android developer. I have 2 questions :
How to make full screen video immediately after tapping play sign?
When the video in normal size and user want to scroll the page which is having header and in static mode, the video will cover the header. It should be below the header when user scroll it until the header. How to make the video below the header when user scroll the page until header position?
This is my Code :
String widthAndHeight = "width='220' height='200'";
String videoURL = "http://www.youtube.com/v/AyeJyctGhSc&feature=youtube_gdata";
String temp = "<object "+widthAndHeight+">" +
"<param name='allowFullScreen' value='false'>" +
"</param><param name='allowscriptaccess' value='always'>" +
"</param><embed src='"+ videoURL +"'" +
" type='application/x-shockwave-flash' allowscriptaccess='always' allowfullscreen='true'" + widthAndHeight +
"></embed></object>";
video.getSettings().setPluginState(PluginState.ON);
video.getSettings().setJavaScriptEnabled(true);
video.getSettings().setJavaScriptCanOpenWindowsAutomatically(false);
video.getSettings().setPluginsEnabled(true);
video.getSettings().setSupportMultipleWindows(false);
video.getSettings().setSupportZoom(false);
video.setVerticalScrollBarEnabled(false);
video.setHorizontalScrollBarEnabled(false);
video.loadData(temp,"text/html", "utf-8");
Use this source to play Youtube Video
String video = "<iframe class=\"youtube-player\" style=\"border: 0; width: 100%; height: 100%; padding:0px; margin:0px\" id=\"ytplayer\" type=\"text/html\" src=\"http://www.youtube.com/embed/"
+ youtubeId +
"?autoplay=1"
+ "&fs=0\" frameborder=\"0\">\n"
+ "</iframe>\n";
mWebview.getSettings().setPluginState(PluginState.ON);
mWebview.setWebChromeClient(new WebChromeClient());
mWebview.getSettings().setJavaScriptEnabled(true);
mWebview.setHorizontalScrollBarEnabled(false);
mWebview.setVerticalScrollBarEnabled(false);
mWebview.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
mWebview.getSettings().setBuiltInZoomControls(false);
mWebview.getSettings().setAppCacheEnabled(true);
mWebview.setInitialScale(0);
mWebview.getSettings().setLoadWithOverviewMode(true);
mWebview.getSettings().setUseWideViewPort(true);
mWebview.loadData(video,"text/html","UTF-8");
Add below code in your Activity :
WebView.setWebChromeClient(new WebChromeClient()
#Override
public void onShowCustomView(View view, CustomViewCallback callback) {
customComponenet.addView(view);
mWebView.setVisibility(View.INVISIBLE);
}
#Override
public void onHideCustomView() {
if (customComponenet == null)
return;
// Hide the custom view.
customComponenet.setVisibility(View.GONE);
mWebView.setVisibility(View.VISIBLE);
}
});
where customComponent is your FrameLayout.
To play a youtube video
you have to parse the url and play the video in videoview