I was creating an app with Cordova that contains a CSS Grid Layout. The problem is that it shows on some devices and on the others, the elements are on top of each other. I think the problem comes from webkit versions that don't support Grid Layout. So my question is, can I force the use of a certain version of webkit so this works? I also would like to know which version I should force for it to work. Here's an example of a CSS Grid Layout
Your help would be greatly appreciated!
Cordova uses the webview app that is installed in the device by default. If you wish to use another webview, you need to embed it in your app. Something like Crosswalk can assure you to use only the webview you provide.
Related
I want to have a scrollabeView (pagingControl) exactly like this image, where I can show 2 pages at the same time or more and swipe between them on Ios And Android.
In iOS you can have a look at the property clipViews. For Android it is currently not possible without adjusting the SDK. Have a look at this ticket: https://jira.appcelerator.org/browse/TIMOB-25635. It is a feature request to have this kind of layout. Also it features some links that explain how to add it to the sdk.
I fixed this problem by creating this widget com.developatic.pagingControl. I hope that will be useful.
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 want to know if it's possible to design my android app UI with HTML5 and CSS3.
If it's possible, is there any performance issue?
Android has WebView which can render HTML content, but it doesn't provide the same user experience as native apps so its use is generally discouraged.
Yes it possible. As rhoadster91 stated, you can use a normal Android WebView which loads your "index.html". All your HTML files should be in the "assets/www" directory. But you'll find plenty tutorials out there which explain everything step by step. Have a look at Googles developer site.
A second possibility would be Phonegap. It is a little tool which helps you to deploy your app for various devices (Android, iOS, WP,...) while coding your app only once in HTML.
I experimented with jquery mobile, native application and phonegap. Building a web application at first seemed very attractive at first as the coding is a lot easier compared to native applications. Here is my opinion based on my research:
Using phonegap slows your application responses, it loads slowly and together with jquery mobile the response and load time increases. So I didnot use it.
Using jquery alone was no different in Gingerbread mobile and on emulator you can clearly see the lag in switching between one div to another div. I didnot use it either.
What I did was use android Webview. I wrote my own javascript and css and placed them on the head section of my page. Used div for changing pages on button click. This approach worked really good giving nearly native performance.
I'm developing an application for Android (and iOS) using PhoneGap, and have come across a problem where as a result of some -webkit-transform: translate3d(x,y,z); calls, my text input boxes that are created by Android are no longer lined up with the element on the page.
The issue that I'm experiencing is the same as this one, however I wish to hide the boxes that Android creates and instead use the ones that are present within my application's DOM. Is this possible?
There is a specific article about Android form bugs in our documentation, check it out. Unfortunately there is no full solution for this problem, but at least the newer Kendo UI Mobile versions implement a partial workaround for this issue (which btw was finally fixed in Jelly Bean). Since the workaround has several negative effects, consider if you want to use it at all.
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