I'm trying to create a list of videos that a user may view. This needs to be dynamic because the list is going to update based on new entries being added to the database I'm drawing the videos from.
For my project, I access a list of videos from vimeo through its simple API. The current approach I'm using to display all the info is through a webview object that gets its info from a StringBuilder object, htmlString.
My XML for the view is the following:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<WebView
android:id="#+id/videoMenu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
</RelativeLayout>
The snippet of code that I use to build my list dynamically is the following. It returns to a function "onPostExecute(String result)" which displays the webview with the html created from the for loop.
for (VideoDataParser.Entry video : videos)
{
htmlString.append("<p>");
htmlString.append("<a href=\"" + video.url + "\">");
htmlString.append("<img align=\"left\" src=\"" + video.thumbnail_url + "\">");
htmlString.append(video.title + "<br>");
htmlString.append(video.description);
htmlString.append("</p>");
}
return htmlString.toString();
The main problem I have now is that the images aren't loading. I suppose that's because it requires another HTTP request to get the image. Is there another way to fix that?
Also, I feel like this method of creating a menu might not be the best. When the user clicks the link, the flow of control goes outside of my activities and goes to a web browser where it will play the video. I want the activity to go to my own video player instead of using the internet upon clicking one of my options. There is most likely a better way of doing this, but I'm unsure.
Any input would be awesome.
If you are using a WebView to create your playlist, then I would recommend using JavaScript interfaces inside the WebView so you can send information between your activity and the WebView, so when the user clicks a thumbnail you can send the activity the "id" of the thumbnail the user clicked.
Tips:
To add an interface you do it this way
WebView web = new WebView();
web.addJavascriptInterface(new classWhereTheMethodsAre(), "nameOfTheInterface");
To call the method from inside HTML
nameOfTheInterface.nameOfTheMethod(Parameters);
I hope this tips can help you, if you have another question please post it here, and I will try to solve it or maybe give you an snippet.
UPDATE:
If your images come from the "internet" (HTTP or something like that), then you can just put the URL in the HTML code like you would normally do so, or you can download them to the SD CARD (with your asynctask class) and then have a listener to advise you when the image is completely downloaded so you can "lazy load" the part of the code where you "insert" the image to the HTML page. The lazy load can be achieved with the code provided in the link and to call it you can do a YourWebView.loadUrl("javascript:functionThatCallsTheLazyLoad(Parameters)")
I hope this update can help you with your problem.
Related
Case: User should be able to view and print pdf
My solution: I am opening PDF inside Webview with the help of docs.google.com/gview. Below is my code
Set up Webview
string url = "http://www.africau.edu/images/default/sample.pdf";
string gview = $"https://docs.google.com/gview?embedded=true&url={url}";
mWebView.LoadUrl(gview);
Print PDF
var printMgr = (PrintManager)GetSystemService(PrintService);
printMgr.Print("print", mWebView.CreatePrintDocumentAdapter("print"), null);
Below is the screenshot. As you can see PDF loads just fine
Problem
When I want to print PDF, all the PDF pages are printed in one paper which you can see below
I would appreciate any suggestion, including different library for displaying/printing pdf or suggestion in Java or Kotlin, I can convert them to C#.
I would not print the web page but print the PDF directly as when printing the web page it just sees it as a longer web page and knows nothing about the content.
Use a custom print adapter instead, but instead of drawing a PDF to print you can just use the existing PDF you already have.
See for details https://developer.android.com/training/printing/custom-docs.html
Any one knows how to detect click event of play button of iframe/video in HTML which is loaded in web-view.
in HTML Page contains like
<p><iframe width="100%" src="youtube.com/embed/uxpDa-c-4Mc"></iframe></p>
and i need to detect click event of Playvideo button in android webview.
Give the element an id, do the following in Javascript (I am assuming you have JQuery, your question itself is lacking details in many ways as I write this right now, you should really try to give more information in order to get answers).
EDIT: My solution to the iframe/jquery issue would be to use a video element instead of an iframe. Here is how: Show Youtube video source into HTML5 video tag?
We would then continue to use the below JS/JQuery
Example JQuery:
$('play').on("click", function() {
//Do something
});
Example with shortcut implemented:
$('play').click(function() {
//Do something
});
I have a situation where I am trying to display user-generated HTML in a webview using loadData. My code is something like this:
String content = "<?xml version=\"1.0\" encoding=\"UTF-8\" ?>" +
"<html><head>" +
"<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\" />" +
"</head><body>";
content += htmlStr + "</body></html>";
wv.loadData(content, "text/html", "UTF-8");
It works pretty well in most cases, but I am having trouble getting certain types of images to display. In most of my testing, inserting <img src="..."/> tags worked fine, but I found that links to images on Photobucket would not display at all; I get a little box with question mark in it instead of the image.
Clicking on a link to an image on Photobucket tends to take you to the page on which that image is viewable on their website, rather than just the raw image itself. I have a feeling that the issue is related to this. I suspect that it may be a "Referer" issue, or perhaps user-agent, or something of that nature, but I cannot for the life of me get this to display properly.
I have tried switching to loadDataWithBaseURL and providing a BaseURL (as I believe this will be used as the referer url) but that made no difference. I have also tried using loadUrl("http://photobucket..." instead and providing a HashMap with the Referer header manually set, but that did not work either. Actually, switching to loadUrl made it immediately redirect to the device's browser to load the Photobucket page. I attempted to provide a custom WebViewClient and override shouldOverrideUrlLoading, but the best I got it to do was to display the full Photobucket page inside the WebView.
I am sure this is not a specific issue with Photobucket, that just happens to be the site that I discovered this problem with while I was testing.
I would really like to figure some way to deal with this situation so that this can work correctly, but I have been as yet unable to find any helpful direction on SO or the internet at large. Does anyone have any ideas?
I would wait until Photobucket finishes their recent updates before further testing...while you stated you are sure it is not a specific issue with Photobucket the internet is now awash with posters not able to view Photobucket linked to images with android based devices. If your code works with all other images not hosted on photobucket your code is good.
I take the response from an HTTP connection in the form of string and show that to webview like this:
WebView engine = (WebView)findViewById(R.id.webview);
engine.loadData(endResult, "text/html", "UTF-8"); /*endresult is string*/
I actually get a response that contains the google page (google search result direct from google.com).
The loadData method works well i.e it shows the web page but when I click on one of the links on that page it shows "page not available" and said that "xyz link might be temporarily down or it may have moved to permanently to a new web address".
this happens for all links accept the first present link on that page. i.e it shows correct page from first link on that page but fails for others..
I noticed that OSes prior to 2.3 failed to follow links if setHorizontalScrollBarEnabled and setVerticalScrollBarEnabled are set to false.
try to use loadDataWithBaseURL of the WebView class
I would avoid using engine.loadData - it seems to cause all sorts of crazy problems.
Use engine.loadDataWithBaseURL instead, and pass the base URL of where the content exists. I would think that the content you are loading is using relative paths in it's HTML so it's looking inside your app resources. By specifying the base URL you get around this problem.
I am searching an ImageViewer library that opens an image in my application for a given URI (the image fetched by a webservice is already stored within my application in a secured place). I really like the "Samsung Galaxy S" ImageViewer-Activity because it uses pinch-zoom and "scrolling" vertical/horizontal. Also it scales the picture very fast on my samsung phone :)
I know that I can open an image with an intent like this:
Intent i = new Intent(Intent.ACTION_VIEW);
i.setDataAndType(uri, "image/*");
startActivity(i);
The best suitable viewer is being called, when none is found an ActivityNotFoundException is raised. So thats cool!
But the problem is that I am not allowed to open an image with an external intent (for security purposes). i.e: The user should not have the posibility to save the opened image via a menu option to his external sd-card or send this picture to another service (email/twitter or s.o.). So I have to write my own ImageViewer-Class (Activity) that can only be called within my application...
Unfortunately I am not very skilled transforming images, so is there any open source project (or library) that covers this use case?
I already asked google and found this one http://code.google.com/p/android-pinch/ but it didnt work very well (also it has no scroll-functionality).
Thanks for your tips :)
At this moment I'm too use WebView. But this is conceptually wrong, WebView is not for displaying images, it for displaying web content. WebView is bulky and cumbersome. You restricted in customizing it. For example, I need scaling, but I don't want to see zoom controls, or I want to move them in other place then default.
Therefore, I searched about this problem and found some solutions:
PhotoView widget from Chris Banes
Also, you can look at this tutorial from Sony Ericsson (sources available) and can implement your own widget: part1, part2, part3
And another one library ImageViewZoom at github
UPDATE
Chris Banes was created awesome library which supports gestures for zooming pictures, see first point above
The easiest way to handle images is using a WebView, if the image is stored local or somewhere online. WebView supports pinch to zoom and other functions.
Example Java:
String imageUrl = "file:///local/dir/image.jpg"; // http://example.com/image.jpg
WebView wv = (WebView) findViewById(R.id.yourwebview);
wv.getSettings().setBuiltInZoomControls(true);
wv.loadUrl(imageUrl);
XML source:
<WebView android:id="#+id/yourwebview"
android:layout_width="match_parent"
android:layout_height="match_parent" />