With the new iBooks Author tool, you can create e-books for the iPad. The format allows you to embed HTML widgets created with Dashcode. The resulting files can be distributed outside of the app store, similar, but probably easier (because it is just one file in a format Apple fully supports), than offline HTML5 web apps (which you have to install via Safari).
What features of HTML5 can be used in those Dashcode widgets? Is there for example DOM storage? Canvas? Location?
Regarding storage, tests made in preview mode on the iPad suggest that localStorage works. It is per book. You can save data in one HTML widget and read them in another HTML widget.
Regarding location, this blog post on "Location with iBooks Author" suggests that it is functional
I just built a test widget that uses flot to draw graphs into a canvas element, and then I inserted the widget into an iBook. When previewing the iBook on my iPad 1, the graph doesn't appear in the in-layout thumbnail, but when expanded to full screen, the graph displays beautifully.
So as far as canvas is concerned: it appears to be available, but apparently only when in full-screen interactive mode.
Update: Apparently the in-layout thumbnail is just an image of the widget, not the widget itself, which is why the graph (which requires executing code) does not display.
CSS Animations can be inserted into iBooks via the iBooks author widget support. Here is an example of us using Sencha Animator to add animations to iBooks Author.
I didn't get Canvas Code to execute on an iPad 1.
Update: no success on iPad 2 either.
(Edit: I was using the Processing.js library)
There is a github repo with a few demonstration HTML widgets that show how to use the interactive features.
Related
I'm developing an hybrid app for iOS using ionic/cordova. This app implements some typical webrtc features such as video calls and file transfers between two peers.
For this purpose I'm using cordova-plugin-iosrtc which exposes all W3C WebRTC APIs.
While RTCPeerConnection, getUserMedia and other Javascript WebRTC APIs implementations are pretty good, otherwise the video element to which streams are attached is substituted by a native UIView layer (see Usage).
This way you can't completely control via JS the pseudo-video element (that is UIView). For example it's not possible to resize the video, position it, change all its CSS properties and so on. UIView size and position are set at initial value of HTML video element.
Is there a workaround or an alternative to this limitation (opened as an issue) of iosrtc cordova plugin?
Yes, the video element is not an actual HTML DOM element displays the video, however the library mimics the CSS of the video element to the best of its ability (for dimensions and positioning).
You can still manipulate the video element using JavaScript, but you must call an iosrtc method to update the UIView afterwards Using:
iosrtc.refreshVideos()
More information can be found here: https://github.com/eface2face/cordova-plugin-iosrtc/blob/master/docs/iosrtc.md#iosrtcrefreshvideos
cordova plugin iosrtc is updated and fixed the issue according to https://github.com/eface2face/cordova-plugin-iosrtc/pull/179.
Update the plugin and it will solve the issue.
I have browsed and searched a lot for this but couldn't find any relevant answers/posts. I am looking for a framework/library with the help of which I can convert ppt slides into images and then render them on iOS device. Any other way/procedure which will display ppt page-wise with giving control on page transition will also be great.
Thanks in advance
If you just want to view the Office files, have a look at:
Document Interaction Programming Topics for iOS: Quick Look Framework.
Quick Look Framework Reference
Quick Look Framework supports a lot of file formats as you can see in the links above. It is available in iOS 4.0 and later.
You can also use UIWebView to display them. See Using UIWebView to display select document types.
just new in mobile development.
I am starting to use/learn Flash Builder 4.6 and try to do my first test app for iOS
I would like to create a simple app which works like a simple catalogue. Basically a list of images that can be showed and switch between images just moving the fingers. Move from left to right will show next image, move from right to left will show previous image.
Basically the same way that you can see your pictures on your Iphone / Ipad
Do I need to create a view per image?
Thanks!
This Flex mobile demo app may overlap your example.
Demo application from Finnkino Movies
Source Code (FXP)
Source Code (ZIP)
You may also want to create a Flex mobile app in Flash Builder using a default template to experiment with transitions of ViewNavigator.
References:
Demo application from Finnkino Movies
Define views in a mobile application
Define transitions in a mobile application
I have couple of questions:
1) I am creating apps using Trigger.io and trying to make a search form that loads listview and shows data. However the UI is very distorted when i tried on android simulator and i also tested on my android tablet.
All the rounded borders and icons in list view looks very messed up. Does anyone have any solution to this?
2) How can i add ads in my apps? Can i use admob?
3) How can i scale YouTube video according to screen size?
1) Is your HTML displaying properly in browsers? Unfortunately, we don't control the HTML rendering, so you'll need to write your markup in a webkit-compatible way.
2) We have an AdMob integration in our medium-term plans
3) If you want full-screen video playback, see forge.media. For inline video, we should behave in the same way as the stock browser - if not, let me know!
1) Android 2.x has f'ugly rendering of CSS rounded corners, combined with older 2.x handsets having lower res displays leads to some really freaky looking borders, shadows and bevels. Also slows down the page a lot - I would avoid these css effects if possible if you want to target these devices.
While creating a website for iPad Mobile Safari, I have a few questions;
Does the orientation happen automatically or do we have to write code for that ?
What is the best approach in terms of CSS/JS..I mean create separate copy of the web CSS for iPad and just update for iPad specific. Also what about JS?
What is the best way to detect for iPad (CSS/JS) and how?
Any online references which specifically covers iPad Mobile Safari development will also be great.
Thank you.
The orientation happens automatically, but you can write code to intercept the event and do things.
I highly recommend using an existing JS library such as Sencha Touch to handle the UI for you; they automatically detect the client and will display the appropriate scale of the app.
I just added a few meta tags to my current project, based on this page - http://www.nczonline.net/blog/2010/04/06/ipad-web-development-tips/
It made a huge difference. The orientation media queries work great. I madea simple example by setting the body background colour different based on orientation.