Does Android support SVG (natively)?
I found old answers here or on the web, but I don't understand the current situation.
Please give a reference if possibile.
Does Android support SVG (natively)?
That depends on what you mean by "Android", "SVG", and "natively".
Android is a mobile operating system. It has multiple versions.
SVG is a standard. It has multiple versions.
"Natively" could mean anything from "I can decode SVG through some Java classes" to "the stock Android Web browser can render SVG".
I can tell you that the stock Android Web browser renders this Web page fine on Android 3.2 and Android 4.0, but fails on Android 2.3.
I can tell you that there is no SVG parser set of Java classes, and that ImageView and similar widgets have no ability to work with SVG directly. You may be able to use WebView to display some SVG, given that the stock browser seems to support it on newer Android versions, though it's conceivable that the SVG support is via some plugin that is not automatically available to WebView.
I cannot tell you what version of SVG is supported by the browser, as that does not appear to be documented. You would need to run some tests and see if it supports the particular SVG structures that you wish to use.
http://caniuse.com/#search=svg The android browser column shows the android version whose default browser will have SVG support. All versions 3.0 and above have basic SVG support.
You can see a comprehensive advanced feature breakdown on the same page.
Related
I am working on a Android application which is using webview as the main UI. (I don't use Cordova in this project.) The problem of the webview is that it gives different behaviors on running on different android devices. Some devices don't support latest features of javascript or css. In order to unify them I am looking for a solution to embed a webview inside my android application. I see crosswalk may be a good solution for me to choose. But I am not sure whether it is the best one. Is there any other frameworks support the same solution? My requirement is described below:
The current android project is created under Android Studio and use gradle to build the application. I want to keep that when using embed webview.
the solution should not require a lot of structure changes on my android application.
It could run on most of android devices. Ideally support android 4.4 and above.
The embed webview can be easily enabled/disabled.
This is not my first hybrid app (I've published apps on both Google Play Store and Apple Store). My target platform is Android. I'm not sure which versions will be supported, I will determine that later if I decide to publish this idea at all.. I'm using Phonegap Build.
I'm having some trouble getting the HTML Download attribute of the A element to work. Here's what I have:
<a download href="http://static.guim.co.uk/sys-images/Guardian/Pix/pictures/2014/4/11/1397210130748/Spring-Lamb.-Image-shot-2-011.jpg">Lamb</a>
If I remove the download attribute, the image opens in my phonegap app (Android). With it, nothing happens though. Works fine in at least Chrome, too. Any ideas?
#Robbert,
I answer alot of Cordova/Phonegap questions like alot of volunteers on this forum. As such, you might find this FAQ useful.
Top Mistakes by Developers new to Cordova/Phonegap
From this FAQ, you want to be aware of #5 - Phonegap is not a webserver or a webbrowser. This is common mistake. It is true you can use your webbrowser to test you pages, but don't be fooled into thinking that all webbrowsers are the same. As Paul Irish likes to remind use "Not all webbrowser are equal". His article Webkit for Developers is a good read.
I quote
Different ports can have different focuses. The Mac port’s focus is split between Browser and OS, and introduces Obj-C and C++ bindings to embed the renderer into native applications. Chromium’s focus is purely on the browser. QtWebKit offers its port for applications to use as a runtime or rendering engine within its cross-platform GUI application architecture.
To be clear, Phonegap uses a library called webview (with Android, and similar on other platforms). The current incarnation is based on Chromium's "webkit", but previously it was based on an old version of Android "webview" - which was around for years. However, even with the attribute you are looking for may not be available.
The best was place to start is caniuse.com. A search for download shows that download is mostly supported, but missing is IE, Safari, and Opera. Otherwise, it appears it is available, but only for Android after 4.4. Looking at my notes this appears to coincide with Android starting to use Chromium's webkit, and not the dated webview library — as i stated before.
Possible Solutions
As #jcesarmobile alluded to you can use
cordova-plugin-file-transfer
_OR_
You can try another webview library that might have the attribute you are looking for
- like crosswalk.
At this time, crosswalk only supports Android, but there are also a few beta version you can also try that are in the repository. And, if your target platform is iOS, then use WKWebview instead.
NOTE the standard webview library is already on your mobile device, crosswalk is separate and will add at least 20megabytes to your app.
For our Android app, we would like to embed our own browser/rendering engine. The most likely candidate for this, is Webkit/Chromium. We are looking for something similar to WebView, essentially, but backed by a browser (version) that we control.
Background
Significant parts of our app consist of web page fragments embedded in the view (served by the app itself). We try to do this as transparently as possible (from a visual/user experience standpoint). So far, we have been using WebView for this and that works for the most part. Except when it doesn't.
Some phone vendors have unfortunately decided to tweak the standard Android browser here and there. In some cases, this breaks our app or makes the fact the we embed a web page more noticeable.
Our Idea
We'd like to have a component similar to WebView but where we control what version of Webkit/Chromium (or some other rendering engine) is being used. It wouldn't necessarily have to be the latest and greatest version. It is more important that we can get our app to work consistently across as many Android devices as possible.
So far
Our research so far has not turned up anything useful. We have found three dead attempts to port Webkit to NDK (the bare Webkit for Android port uses functionality not available in the NDK and thus not to app developers):
Webkit Android port by Company 100 (no updates for over two years)
mogo-browser (their last revision was to delete all source code)
NDK Webkit (officially abandoned by its author)
Looking on StackOverflow, we have also found a number of similar questions, most of which being solved by pointing to WebView (we already do that, and it's not good enough)
Webkit component for Android
Embed basic WebKit + V8 in my app
Embedding a newer version of WebKit with Android app
We are currently investigating whether Chromium for Android (or parts of it) can be turned into a library that our app could use. Has anyone else done this?
Update
After having a look at the chromeview project on GitHub (accepted answer), we decided that we'd rather wait for Google to release a Chrome-based WebView on future Android devices. The Chromium rendering engine turns out to be fairly large (~40MB), which doesn't leave much space for the actual app :(
pwnall/chromeview · GitHub
https://github.com/pwnall/chromeview
ChromeView works like Android's WebView, but is backed by the latest Chromium code.
You should all check out the Crosswalk project. Sponsored by Intel, and in active development. They pull the Chromium sources and promise to make all new Chromium features available in Crosswalk within 6 weeks.
Crosswalk is a web runtime for ambitious HTML5 applications. It provides all the features of a modern browser, combined with deep device integration and an API for adding native extensions. It is especially suited to mobile devices.
Crosswalk supports Android 4.0 and newer, on ARM and Intel architectures.
Within in one hour of finding this project, I had my Cordova/Phonegap app running on an Android phone with Crosswalk. I'm glad I don't have to adjust my Javascript code to respect the shortcomings of the (pre-4.4) android.webkit.WebView.
https://crosswalk-project.org
Without WebKit there is a GeckoView. Sure it adds over 20Mb of libs to the project.
Nowadays, GeckoView seems an alternative to consider
I tried to use lastest code version of Chromium to build a custom WebView and it's successful.
I will give my approach but not the source code here right now.
Eventually, the size of custom WebView library is about 30MB, quite big for some small app. But it's wonderful because can support perfectly from Android 4.0.
This below is my method:
fetch source code of chromium and build web_view_apk (AndroidWebView test shell) follow this instruction https://www.chromium.org/developers/how-tos/android-build-instructions
use apktool to decompile the apk file of Aw Shell above. https://ibotpeaches.github.io/Apktool/
create your project with res, lib folder as same as decompiled project.
Manifest file is located in /src/android_webview/test/src/org/chromium/shell
src folder: you find the classes in chromium project source code which are respective the files in smali folder of decompiled project.
I will update my code later, but you can try my guide now if don't want to wait.
I would consider Chrome custom tabs:
https://developer.chrome.com/multidevice/android/customtabs
For Internet Explorer, you can use conditional comments (or even hacks) to target specific versions of IE. Is there something similar for targeting different versions of iOs.
I have a website that works perfectly on iOS 4.2+ but it breaks on older versions. I can make it work on older versions by changing the CSS to hide some elements, but then it breaks for new versions.
I would just like to send my old iOS style sheet to older versions and have it ignored by newer versions.
There are lots resources for target different versions of iOs when developing an app, but there doesn't seem to be anything for websites.
As a bonus question, I would also like to know how to target different versions of android as well.
Your detection of the device, browser, OS .etc. must be done using the User Agent string sent from the browser. It is the typical way to identify your user's environment. But I can understand that you're only serving HTML/CSS/Js so you have no back end code to do this.
My suggestion is that you conditionally download the correct CSS and JS file(s) using JavaScript.
you can get the user agent string by navigator.userAgent from Javascript, then you can download the correct files you want depending on the browser/OS/device you're running on.
See more info at
http://www.w3schools.com/jsref/prop_nav_useragent.asp
as per detecting Android versions. OS version 'should' be in the UA string as well... Checkout this site for Android user agents.
http://www.gtrifonov.com/2011/04/15/google-android-user-agent-strings-2/
What are the situations a developer need to use HTML5 in android.
I am bit confused about when to use HTML5 in android.
I need to develop an application like a report viewer from web server.
In this case i also need to use some Android specific features like service, preferences, receivers, charts (with the help of third party library).
So i am little confused about what are the good situations to HTML in android apps...
Please help me by your suggestions or direct me a better article about this...
Please read this pdf . You can get better idea where to use html or where to use native android apps.
Android is to date the platform with many variants of using different browsers: WebKit-based Android browser, Opera Mini, Opera Mobile, Firefox, UCWeb, Google Chrome Android browser.
The default Android browser has some problems with HTML5. And the Chrome for Android is designed to solve it. It has almost perfectly latest HTML5 support: such as new elements, video –H.264 and WebM support- and audio tags, geolocation, hardware accelerated canvas (2D drawing), and all the CSS3 stuff, such as selectors, effects, media queries, transforms, transitions and animations, ect.
But while it's still not very popular because this new browser isn't available yet for Android 2.x and 3.x version, just for 4.x.