0

IMP: ZK support to IPhone features

asked 2012-10-05 06:49:26 +0800

bhagyashree gravatar image bhagyashree
78

Hi,
I am working on a project for which I have preferred to choose ZK as the framework. But I want the mobile related features to be used in the project.
Please Answer my questions:
1.Can the inbuilt mobile camera be used in my ZK iphone application and click an image which will be accessed in the application?
2.Can I use the GPS feature of the Iphone through my ZK app. ?
3.Can I access the Addressbook / contacts list in my phone through the ZK app?
4.Can I upload attachments ( images specifically from gallery stored on my iphone) to the ZK app. ?

I have been through the existing documentation on mobile related features but could not get a confirmatory answer to the above questions.

This is a very important issue on which my application's framwork is depended. I want to use ZK for my project but if there is no ZK support for the above features then probably i will have go for something else ,which i don't prefer.

Please HELP me ASAP.
Thankyou.

delete flag offensive retag edit

11 Replies

Sort by ยป oldest newest

answered 2013-01-02 08:21:35 +0800

jeanher gravatar image jeanher
1774 2 6
ZK Team

We do have a task force exploring & evaluating how we can leverage native mobile features. Stay tuned.

- jean

link publish delete flag offensive edit

answered 2012-10-31 12:16:33 +0800

vinayakshukre gravatar image vinayakshukre
36

I could make it work with this iFrame idea but I am not sure is it a good idea to use in any real world commercial application.
It will be great to have some OOTB feature of ZK.

ZK developers...do you have any plan to support this ?

link publish delete flag offensive edit

answered 2012-10-22 11:48:39 +0800

vinayakshukre gravatar image vinayakshukre
36

Its really great to share this kind of idea.....you know why ? Somehow the same idea came to my mind....believe me and I am trying this. Will let you know my findings soon.

link publish delete flag offensive edit

answered 2012-10-22 06:27:53 +0800

windeyu gravatar image windeyu flag of United States
288 3

Hello vinayakshukre, thanks for sharing your thoughts on my idea. If what you said were correct, my idea would've been too naive. However, I have another idea to make it work.

The key to the new idea is the iframe and the cross-window messaging with postMessage(). Over the weekend in my spare time, I tried this out and seemed promising.
The pseudo-code is like this

<!--  This is the index.html to be compiled by PhoneGap to produce native mobile program -->
<html>
  <script>
    <!--
        Here you write javascript to send and receive messages to the DOM window in the iframe.
        Your listener here also invokes PhoneGap api to access phone's features such as gps, contacts, etc
     -->
  </script>
  <body>
	<iframe id="content" src="http://xxxx/your_ZK_application.zul"></iframe>
  </body>
</html>

In your ZK web application, your write your custom component. Inside your client-side widget, you register message event listener to capture the event from the parent of the iframe, and post message back. Below are some references on how this communication works across the iframe. Your javascript in PhoenGap index.html and your javascript in your custom widget communicate data to each other. This way, your ZK web application doesn't need to be compiled by the PhoneGap.

http://javascript.info/tutorial/cross-window-messaging-with-postmessage
http://viget.com/extend/using-javascript-postmessage-to-talk-to-iframes
https://groups.google.com/forum/#!msg/phonegap/ZhOgsCbnDqw/CXgmz6kxf-cJ

I verified this cross-iframe messaging with a sample phoneGap app running on my Galaxy S3 and a iframe html page running from my ZK web application deployed on a tomcat. I was able to send messages back and forth across the iframe. However, I have trouble porting the javascript in my html page deployed in the ZK app to a custom ZK widget. I am not an expert with zk client-side programming. However, I do see this idea promising to get it work eventually.

Hope this information help.
Best regards.

link publish delete flag offensive edit

answered 2012-10-18 09:03:49 +0800

vinayakshukre gravatar image vinayakshukre
36

windeyu, thanks for the information. I have few thoughts to add to this.

Phonegap basically provides the JS APIs to access native functionality like camera or addressbook. So developer has to write the javascript either in separate file or in HTML file to call those phonegap JS APIs. Phonegap also provides one jar file which probably has the native code to access native functionality which is called from phonegap JS APIs.

When mobile application is built from these JS and HTML files into a .APK file for android or something else for iPhone, it somehow identifies the JS calls for native functions and replaces/compiles them with native code.

In case of ZK, javascript is generated runtime and even if you write ZK page which generates the JS which calls the phonegap API , it does not go through the process of compiling/replacing call with native code. So those calls do not work.

So using phonegap and ZK to build mobile application which can access native feature seems impossible to me. But you can always call ZK URL (explained by windeyu above) and see ZK pages launched from within the application. So you can take the advantage of ZK widgets in mobile app but can not have native features.

Even ZK team can not fix this as it is beyond their control. ( In reality I would want to hear from them that this is possible. I would be happy in that case as that will solve my problem.)

Anybody from ZK team, please reply.

link publish delete flag offensive edit

answered 2012-10-10 04:46:17 +0800

windeyu gravatar image windeyu flag of United States
288 3

updated 2012-10-10 04:47:50 +0800

I did this long ago, but I think it still works in the same way. Please see the the sample Hello World app in this tutorial:

http://docs.phonegap.com/en/2.1.0/guide_getting-started_android_index.md.html#Getting%20Started%20with%20Android

The PhoneGap code is very simple. It calls

    super.loadUrl("file:///android_asset/www.index.html");

I somehow managed to load the URL that pointed back to a zul page in my backend server. I don't remember the details, but I found a link below that may explain in concrete code. I didn't go further beyond ths point. At least it showed me that PhoneGap worked fine with the ZK client-side library. (It was ZK 5 and an earlier version of PhoneGap I tested.) You have to try out yourself from here. Good luck.

http://comments.gmane.org/gmane.comp.handhelds.phonegap/23680

link publish delete flag offensive edit

answered 2012-10-09 06:28:22 +0800

gekkio gravatar image gekkio flag of Finland
899 1
http://gekkio.fi/blog

Hmm, using Phonegap is a very interesting approach. My guess is that the PhoneGap app will basically redirect to a ZK app running elsewhere (= you don't package ZK stuff in the Phonegap native app). This article about Vaadin and PhoneGap might give you some ideas. Vaadin and ZK are very similar, so some basic principles of the integration apply to both frameworks.

link publish delete flag offensive edit

answered 2012-10-09 05:30:49 +0800

bhagyashree gravatar image bhagyashree
78

Okay.
As much as i searched , i could not explore how to use phone gap for my zk app. Since phongap supports html/java/css only then how did you wrap your zk application(with zul files) with phone gap? I am not understanding how to do that, your suggestions will be of great help.

link publish delete flag offensive edit

answered 2012-10-05 17:44:17 +0800

windeyu gravatar image windeyu flag of United States
288 3

Long ago I experimented with our ZK web application being wrapped by PhoneGap to produce a native program on Android. It ran fine on an Android emulator. (PhoneGap also supports iPhone.) In a nutshell, the produced native mobile program is like a mini-browser loading your web page, and providing access to native features like camera, gps to your client-side javascript. I imagine you can write your own custom ZK component and its client-side widget. Inside your client-side widget, you can load PhoneGap javascript library to access the native camera, gps, contacts, etc, and pass on the info back to your server component. I haven't completed this whole path, but I think it should be fun to give it a try.

link publish delete flag offensive edit

answered 2012-10-05 11:09:55 +0800

bhagyashree gravatar image bhagyashree
78

okay. Thankyou

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2012-10-05 06:49:26 +0800

Seen: 370 times

Last updated: Jan 02 '13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More