I am making small circle divs with a 7px diameter
I applied the hardware accelerated = true in my config and I have added
-webkit-transform: translate3d(0, 0, 0);
-webkit-transform: translateZ(0px);
to the css class of my div element. Why does it still display it in this "low quality"-style?
On other mobile devices I have tested on they where rendered smoother. I am aware that it does depend on the hardware of the device but could someone please elaborate how to correctly apply the above, so it at least "would" work if the hardware requirements are met?
Thanks in advance.
The Cordova WebView is the system webview and thus, it is different depending on the Android OS version you run your app on. Could you tell us what version of Android is the device you are testing on?
Also, when you mean "on other mobile devices I have tested on" which are those? Other Android devices with other Android OS versions or iOS devices? Please, provide some more feedback.
Anyway, the problem could be that the webview does not support hardware acceleration CSS 3D transformations. I would recommend you to check a solution like WebView+ from CocoonJS or Crosswalk from Intel. The WebView+ is a webview based on Chromium for Android 4.0+ devices, so no more fragmentation on Android (the same environment no matter what Android OS version you execute your app on) and all the power of Chrome executing your app. It is very easy to test using the CocoonJS Launcher: https://play.google.com/store/apps/details?id=com.ideateca.cocoonjslauncher&hl=en
Go to Your App and point to the URL where your app is to be able to test it (similar to a web browser). Then you can compile the final app using the CocoonJS Cordova Command Line: http://support.ludei.com/hc/en-us/articles/202568973-First-steps-with-CocoonJS-CLI or the CocoonJS Cloud compiler for Cordova apps.
They also provide the WKWebView for iOS 8 with the WebView+ (just in case you are also interested in iOS with improved performance): http://blog.ludei.com/build-phonegap-cordova-apps-using-the-wkwebview-right-now/
You can also test it using the CocoonJS Launcher for iOS: https://itunes.apple.com/us/app/cocoonjs-by-ludei/id519623307?mt=8
Hope this helps.
Related
I recently started testing my Gluon Mobile app on my iOS device, but sometimes when I open my app, this popup occurs. Is there any way to fix or avoid this?
The default architecture when deploying on iOS with JavaFXPorts is thumbv7, as you can see here.
This means the app is created in 32 bits mode.
Since iOS 10.1, Apple is trying to push developers to update their apps to 64 bits mode.
While creating 32-bits apps doesn't mean they have less performance, if you want to avoid the message you need to create the app in 64 bits mode.
For that you can change the arch parameter:
command line:
./gradlew -Probovm.arch=arm64 launchIOSDevice
or on your build.gradle file:
jfxmobile {
ios {
arch = "arm64"
...
}
}
I'm learning to use the Meteor framework and since few days I have this problem.
I want to use some functions of the built-in Math library, like: Math.trunc().
It's work when I launch my program in Chrome or Firefox on Linux or Windows.
It also works on Chrome on Android.
But... It doesn't work when I launch on an Android device using meteor run meteor-device.
The application is well installed on my device, I can launch it, but all my variables that use Math.trunc() don't appear.
Also I got a message in the console which says that the object Math doesn't have a trunc function or method.
MDN says about Math.trunc:
This is a new technology, part of the ECMAScript 2015 (ES6) standard.
This technology's specification has been finalized, but check the
compatibility table for usage and implementation status in various
browsers.
So your webview is probably just not yet implementing it. Keep in mind that the webview android uses is not always the same as the latest chrome you have installed. Probably your best option is to just implement the functionality yourself using floor together with an if condition if you really don't want to floor negative values but truncate the decimals instead.
The new 9.1 simulator with Xcode 7.1 has the feature to simulate a force touch like the iPhone 6s / 6s+ but the option is greyed / disabled.
iOS Simulator > Hardware > Force Touch Pressure [disabled]
Screenshot for reference
Anybody know how to enable this option?.
Note: Im testing this on a iPhone 6s simulator
Simulator does not support interaction with iOS Devices using 3D Touch prior to Xcode 7.3. The menu item that you are referencing relates only to Apple Watch devices.
select simulator(watch) --> Hardware --> Force Touch Pressure --> Deep Press, and then click and hold on simulator, menu will be popup. you don't need to real device to test context menu.
On the Apple Developer website, it says:
NOTE
With Xcode 7.1 you must develop on a device that supports 3D Touch. Simulator in Xcode 7.1 does not support 3D Touch.
Apparently, the new Simulator 9.1 does not support 3D Touch. You can actually implement such a behavior but (unfortunately) you have to test it on real a device that supports 3D Touch.
I guess we all have to wait for the next issue of Xcode.
See here for similar discussion and way to test force touch only for quick actions (on the app icon).
It is true that by far (Xcode 10.1) iOS simulator still does not support 3D touch if your Mac doesn't have touchpad with this capability.
However, there are a few libraries like this that swizzle system's touch event handling and inject 3D touch feature. Of course, you don't want this code to be included in your production code to avoid being rejected on app's review, but you can certainly use this for development!
The library I mentioned works great for my Swift 4.1 project.
i am facing issue like one of my samsung device display correct css and another samsung device does not.
in right side of images(android version 4.1.2) and left side (android version 4.4.2) the problem in 4.1.2 device.
any solution for this or any BUG in android version.
i apply ( .platform-android4_1{} ) css also but can't effect.
example(Header and buttons are smaller,badges are small)
help me please .
thank you
Most of ionic android developers face this issue because of different verions of web-views environment on different devices. Solution of this is to add crosswalk plugin to your project.This makes your Cordova / Ionic application use the Crosswalk WebView instead of the System WebView. It patches own browser with application so it runs in that having same specific environment on each device. So application behavior will be same on each device.
add this plugin using following command:
ionic plugin add cordova-plugin-crosswalk-webview
More about Crosswalk, see link : https://crosswalk-project.org
Read this blog post by ionic to understand how it helps you stablize and improve behavior of hybrid applications across all versions of android.
I have a phongap app with a sqlite plugin that runs in both android and iphone. When I try to run it in Ripple i get several errors depending on the inclusion of the cordova version and device I use. Non of them are working at all. In some comments in stackoverflow i've seen people running sqlite in phonegap under ripple.
I'm using the PG-SQLitePlugin-Android plugin in my project, which it acually only supports Phonegap 2.7.0+.
I've found that i can force Ripple to use 2.7.0 by calling it :
file://localhost/Users/----/----/----/www/index.html?enableripple=cordova-2.7.0
Ripple actually loads great after enabling access to file system through chrome.
When i include cordova-2.7.0.js in my script
The index.html pops me a pop up with the following text :
gap:["Device","getDeviceInfo","Device119187522"]
that i can accept or cancel, then 2 more dialogs appeare, if I accept it gets hanged.
the js console shows that cordova 2.7.0 is really running :
Falling back on PROMPT mode since _cordovaNative is missing. Expected for Android 3.2 and lower only. cordova-2.7.0.js:906
deviceready is not fired
When i include cordova-2.9.0.js in my script
It happens the same as 2.7
Falling back on PROMPT mode since _cordovaNative is missing. Expected for Android 3.2 and lower only. cordova-2.7.0.js:906
but this time I get this other errors
Failed to load resource file://localhost/Users/laullobetpayas/-------/---/------/www/cordova/cordova_plugins.json
Failed to load resource file://localhost/Users/-------/---/------/www/cordova/cordova_plugins.js
deviceready is not fired
When I don't include any cordova.js in my script
SQLitePlugin.js:31
Uncaught ReferenceError: cordova is not defined SQLitePlugin.js:34
Am I using the proper plugin ?
which is the propper version of cordova / device tu run with the plugin and ripple ?
Do i have to include the cordova.js in my project
Hel will be very apreciated, it's for a long time that I'm trying to solve this.
Thank you in advanced.
Phonegap plugins won't work with Ripple because the idea of a Phonegap plugin is that it provides a Javascript interface in order to execute native code. That means, in the case of Android, the Javascript will invoke native Java code and in the case of iOS, the Javascript will invoke native Objective-C.
Ripple is purely Javascript-based, so the Javascript part of the plugin has nothing to interface with.
In the case of the SQLitePlugin, for example, calling SQLitePlugin.close() results in the call:
cordova.exec(null, null, "SQLitePlugin", "close", [this.dbname]);
where SQLitePlugin is the native class name and close is the native function name.
If you want to use the same storage API across Android, iOS and Ripple, maybe consider using lawnchair with appropriate adapters.
As for the issues with Ripple and Phonegap 2.7.0/2.9.0, Ripple has not quite caught up with Phonegap, so you will get these popups and error messages in the console, but that will not stop your Phonegap app (without native plugins) running in Ripple. You can convince yourself of this with a simple test case like:
document.addEventListener("deviceready", function(){
alert("I'm alive");
});
But the answer is, yes, you do need to include cordova.js in order for it to work at all in Ripple.
The Cordova-SQLitePlugin is a drop-in replacement for the HTML5 SQL API, so when running inside Ripple you don't need to call the Cordova layer you can just replace calls to sqlitePlugin.openDatabase() with window.openDatabase(). I've not yet tested this with Ripple but it should work. There are some database size limitations but this is probably all you need for testing.
There several ways to test if your inside Cordova. You could create a shim for the openDatabase() method based on testing for Cordova on app startup.
Since your primary goal is really to do rapid testing of SQLite with Cordova (rather than specifically to use Ripple) I'd like to suggest another new alternative to using Ripple.
I wrote an app call Sencha Touch Live that can be used for rapid development of Cordova / HTML5 apps by allowing you to Live Edit and Debug the HTML/JS/CSS code on your mobile device simply by updating files on your development computer - so you can skip most recompile/redeploy/restart debugger time costs. It has tons of other cool features. I'm using it myself for SQLite app testing instead of Ripple or Weinre
Detailed overview and Step by Step Guides
Installation Guide
It's based on the code from Adobe's PhoneGap Developer App so core code is well tested. It's been extensively adapted and tuned for Sench Touch framework though it should also work for jQuery Mobile or any framework that places HTML5 code under the phonegap/www or cordova/www folder. Just start up the server in you PhoneGap or Cordova project folder.
For testing your SQL and controller logic, I recommend using Geny Motion emulator with a version of Android 4.4.x KitKat. Start up an recent version of Chrome on your desktop and once you get your app working on the emulator or real device open chrome://inspect and now you can use the full Chrome debugger on your remote device app. You can also use a recent version of Safari for OSX/iPhone Simulator testing.
You can watch a demo here (starts at the 5 min. mark). Yes! It needs a more polished video with less echoes but you'll get the idea:
https://www.youtube.com/watch?v=94J4HBB0f7I