Android - local image in online page - android

I am working on a fullscreen webapp to androidPage Not Found We couldn't find the page you requested. I have everything done but can I possible add all the images offline in the app and the html online?
I am using:We did, webView.loadUrl("http://site.com/Sd34DsX.html");
And I wonder if i could host the images in the HTML file like this:
#fotball
background-image: url('file:///android_asset/fotball.png');
background-repeat:no-repeat;
float: left;
position:fixed

almost, but no, because you can't write to the asset folder from within the app. you only use that to store resources which your app will use after compiling.
what you can do is get the entire HTML as a string, and do a string search for all of the image paths. You can then retrieve those images in their own http requests, and save them to a folder in external storage.
you can then modify your html string to replace all of the image paths with local paths.
your webview can use string data as a webpage.

Instead of:
background-image: url('file:///android_asset/fotball.png');
try a data url, which has no cross-domain restriction:
background-image: url('data:image/format;base64,IMAGEDATA');

Related

Phonegap/Cordova: img tag not displaying images from SDcard

I'm new to Phonegap/Cordova and building an app using MaterializeCSS and JQuery on Android OS 5.1. I have a problem that no images in the IMG tag seem to be loading, but the file paths seem to be correct.
I have my app scripted so that images are downloaded from my server to
"file:///storage/emulated/0/Android/data//files/images/".
I have a static index page with a content DIV, modified using jquery:
$("#rBody").html('<div class="row"><div class="col s12">'+jxml+"</div></div>");
Therefore, content is dynamically loaded. the IMG tag src path property is modified as per platform:
jxml=jxml.replace("images", app.getStorageLocation()+"files/images");
However, the image placeholders just have a blank square instead as if image is not found.
Is there any reason for this to occur? Is there a permissions property somewhere I need to enable?
Thank you for any advice!
You will need both file permissions and the File API plugin for Cordova.
With these you should be able to read the image in and add it to the tags.

How to refer to files in asset folder from outside html

This problem seems familiar but it's not! I have a webpage on a web server and a webview in Android application that loads the webpage. And instead of loading some font from the Internet (or website), i want to load fonts directly from asset folder of Android device (to save data and faster). What i have done is to embed this code in the website with the hope it can use the font in Android asset folder instead:
#font-face {
font-family: 'DejaVuSans';
src: url('file:///android_asset/fonts/DejaVuSans.ttf'); /* but this does not work*/
}
body {
font-family: 'DejaVuSans';
color: red;
}
(link Change WebView font using CSS; font file in asset folder. (problem))
I currently test with android 4.+. Can anyone have the solution? Thanks
file: urls retrieve files from within one's own computer. For websites you should use relative or absolute urls. Here's a relative url example:
src: url('android_asset/fonts/DejaVuSans.ttf');
Here's a absolute url example:
src: url('http://www.example.com/android_asset/fonts/DejaVuSans.ttf');

Load image from sdcard into html

Hi I have implemented an android web server and I am serving html pages on the fly, based on the uri requested.
When I try to include images from my sdcard they are not showing up on the html page. I have the requisite permissions in the manifest. I have tried looking around but, most of the examples involve images within webview. I am using the following code to get path to the .png files on the sdcard.
String file_icon=Environment.getExternalStorageDirectory().getAbsolutePath()+"/file_icon.png";
String folder_icon=Environment.getExternalStorageDirectory().getAbsolutePath()+"/folder_icon.png";
and I am writing to the outputstream using the following
writer.write("<tr><td><input type=\"checkbox\" name=\""+files.toString()+"\" value=\"file\"/></td><td><img src=\""+file_icon+"\"/>"+files.toString()+"</tr>");
writer.write("<tr><td><input type=\"checkbox\" name=\""+files.toString()+"\" value=\"file\"/></td><td><img src=\""+folder_icon+"\"/>"+files.toString()+"</tr>");
When I fire up the emulator and visit the page I see no images.
screen http://img820.imageshack.us/img820/7973/capturekuw.png
Any ideas or pointers in the right direction would be greatly appreciated.Thanks.
After looking around I found out that I needed to implement a ContentProvider and override the openFile() method.
http://www.techjini.com/blog/2009/01/10/android-tip-1-contentprovider-accessing-local-file-system-from-webview-showing-image-in-webview-using-content/

named anchor not working webview android

In my little app i have a webview, i only have one html file in the assets folder. I'm trying to use a named anchor to make a Jump Link but it doesn't work. It only says Web page not available I don't know where i'm wrong. Is it trying to load a html file with the name tag i provided?
WebView mWebView = (WebView) findViewById(R.id.mywebview);
mWebView.loadUrl("file:///android_asset/topics.html");
EDIT:
here's my html
<html>
<body>
<a href=”#tip”>Go somewhere</a>
//a lot of <br/>...
Somewhere
<a name=”tip”></a>
</body>
</html>
And yes the topics.html is under assets/
Where does your program fail - with the loading or when you click the anchor? It sounds like the problem is with your HTML file, so you should probably show the code from that instead. :) Also, the full LogCat output is handy too. The more info the merrier.
I recently implemented a WebView, the HTML code is extremely straight-forward (since I know close to no HTML and just wanted an easy way to display documentation). A simple anchor is just this for example:
Navigating the application
...
<a name="q1"></a>
<p><b>Navigating the application</b></p>
<p>...sliding motion (to the left or to the right) with your finger...</p>
If your program is failing at the actual loading part, then ensure that you have placed the topics.html file correctly in the /assets/ folder in your project folder. It has to be at the very root of your project folder - ie. workspace\<projectname>\assets\topics.html
Your code for loading the webpage looks fine.

Android:How to refer css file within html in following situation

hi
In my application i need to display a html page in webview and that html page should refer to sdcard location for .css file (Using link href="...." tag).
I placed 2 files (i.e) html and css ) in sdcard->mibook.
I tried by giving absolute path as link href="/mnt/sdcard/mibook/0.css"
how can i specify path name android?
Edited:
Above problem solved : by using this- link href="file:///sdcard/mibook/0.css"
But i have following requirement,
i need to handle around 50+ html file every time ,
I placed all files as follows,
mibook->book1->pg90.sqlite
mibook->book1->links->o.css and 1.css
The sqlite file contains html pages. each html page has css reference as link href="/links/0.css"
These css file should be refer by html. how can i do this?
Try
link href="file:///sdcard/mibook/0.css"
Assuming Android >= 2.1

Categories

Resources