I have a web app that includes an animated SVG that builds up a set of faces, adding a new face every second or so. You start with one face and end up with 12 say, all in the same SVG file. The web app works fine when opened in a desktop browser.
When I run the web app in a browser on an Android device, or in a WebView which is where I ultimately want to run it, the animation goes weird. The first face is presented then a second later all the rest appear, there is no face-by-face build up.
I know from other readings that Android Studio is not great with animated SVG. Here for example is an similar question that is unanswered and 7 years old.
Because the SVG is embedded in HTML I do not have the option of VectorDrawable, and WebView should handle HTML+CSS+JavaScript+SVG correctly anyway.
I am hoping things have improved and someone has some suggestions on where to start. Specifically is there some markup I can add to AndroidManifest.xml or some code I can add to MainActivity.java that will make WebView render animated SVG correctly?
Related
I'm trying to build an android app that allows -
Automatically scroll page by page.
Take screenshot after each scroll (and ideally merge all screenshots into one image, if possible) and save the resulting image(s) in an album.
For example - the user opens a very long webpage in the browser, then triggers the app which screenshots the entire webpage automatically by scrolling down and taking screenshots until it reaches the bottom.
There seem to be many libraries to do the screenshot part for React Native but I can't seem to find any for ReactJS. Is it even possible with ReactJS or do I need to learn some other android specific technology to make it happen? I'm a ReactJS and mobile app dev newbie, so I might be missing something obvious.
If I understand well, your Android app is just a webview rendering the React app.
If this is the case, you cannot do anything at React layer. you have to code the logic at native layer (in the native android application).
you can use this package to take screenshot from any pages
"use-react-screenshot"
but this package have some problems. it works by react hooks
or in take screenshot, svg codes not exist in image
I have an app running on AngularJS and Ionic and I have a problem with state transition with Android devices but not on iPhone/iOS.
One page is quite large and when I navigate from the home screen to this page the header gets loaded first and after 2-3 seconds the actual view changes.
I tried adding ng-cloak to the ion-view but this doesn't solve the problem.
What do you mean by that your view is getting changed? Also in which versions of Android are you facing this problem?
Unfortunately it seems a problem very device oriented. You could try to change some elements to enhance perfomance like changing your ng-repeat for collection-repeat.
The best way you could try to improve your performance in Android comes to the cost of weight in your App. You could try using Crosswalk Webview Plugin. This not only provides you the great webview capabilities where your native webview lacks the performance but also it is providing feature constancy across Android 4.0+ Platforms.
See this:
http://blog.ionic.io/crosswalk-comes-to-ionic/
https://github.com/crosswalk-project/cordova-plugin-crosswalk-webview
I'm currently working on an Android app that displays a simple html-document with some css. However, the html changes based on the day, once I've gotten that implemented at least, so there will some days where it will have more elements than it did previously. Now, where the problem lies, is that when there are a many elements, the bottom ones won't show. They are hidden outside the screen, and there is no scrolling.
How would I go about making the page scrollable? This is only for android. I can't use iScroll, seeing that it requires a list-structure in the html, which I don't have and it would be a pain to rewrite the script that makes the html file :/
Thanks
I have a working app built in jQuery Mobile and Phonegap (using Eclipse on Mac OSX)
Everything is working OK, except when the Ajax loading message pops up, the animated gif does not animate, it simply stick on the first frame.
Viewing the app in a web browser (as it is basically a mobile site) the gif animates no problem.
I have read that showing animated gifs on Android is tricky without using the web browser. Is there a way to get it to work? Maybe replace it with something in CSS3?
Although the comments explain why it doesn't work, this might get you started on finding a workable replacement: https://stackoverflow.com/a/2767556/878602
I have developed a Phonegap application, and am now trying to run it in the android emulator. My problem is that the application doesn't scroll in the emulator or device, but it works well in a normal browser like mozilla or chrome. Butwhen I test in the emulator or device then it doesn't scroll.
Here is my html file http://pastie.org/3981916
And here is my css file http://pastie.org/3981918
I am not able to find a solution to this problem, can any one help me out please?
well you cant get the normal html scroll behavior when trying to create a app using phonegap on android.
you cant get the overflow:scroll effect for any of the html elements.
you'll need to make use of third party libraries such as jquerymobile, iscroll4, etcfor getting the native look and feel.
or also you can construct your own logic