Asial Blog

The list of 'HTML5'

Onsen UI Developer Preview 2 Release

Category :
Frontend(HTML5)
Tags :
onsenui
theme
HTML5
Monaca

Today we are excited to release developer preview 2 of Onsen UI.
The main focus of this release is support for themes and Font Awesome integration.



Themes



Our designer have cooked up 6 themes specially for Onsen UI--Blue, Green, Orange, Pink, Purple, and Yellow. Here are some screenshots of how they look like.


Blue



1.Blue1.Blue_controls



Orange




1.Orange1.Orange_controls



Purple




1.Purple1.Purple_controls



How to use


1. Go to Plugins Settings


Open Onsen UI project and go to plugins setting as shown in the figure below:

2.go_to_plugins



2. Choose your favorite theme


Scroll down to Onsen UI plugin and choose a theme you like.

3.plugin_settings



3. That's it!


Preview your project and see your app shines!



Font Awesome Integration



Onsen UI supports Font Awesome out of the box. Here are examples on how to use it.




In Navigator


  1. <ons-navigator left-button-icon="fa fa-bars"/>
Navigaor_font_awesome


Inside Button


  1. <ons-button>
  2.     <i class="fa fa-thumbs-up"></i> Like
  3. </ons-button>
Like button


Conclusion


We love to hear feedback from you. Do not hesitate to drop us feedback by writing in the comment box below or raise issue on GitHub. Relax!

Easily create Master/Detail pages in Onsen UI

Category :
Frontend(HTML5)
Tags :
onsenui
Angular
HTML5
UI
Service
1_project.png
Most mobile app needs a way to transition from one page to another and have the data shared between those pages. Onsen UI makes it easy to do so.

Without further ado, will we create an app that looks like this:

OnsenUI: How to Create Flickr Public Photos App in 5min

Category :
Frontend(HTML5)
Tags :
onsenui
angularjs
flickr
Animation
HTML5
new_project
In this blog, I will walk through how to make an App that fetch photos from Flickr public photos api using Onsen UI. Plus how to use Button's spinner animation to make the App looks alive.

Using Leap Motion and PhoneGap (Cordova)

Category :
Monaca
Tags :
Monaca
Tech
JavaScript
社長BLOG
HTML5
Monaca IDE
Hi there. Today I want to introduce one of my new digital gadget, Leap Motion. Maybe many of the gadget-lovers already know, Leap Motion is a small stick-size device that captures your hands motion and send it to the host computer. This article explains how you use this device from PhoneGap app.

Monaca's New Features Release!

Category :
Monaca
Tags :
Monaca
HTML5
Monaca's New Feature Release!

【Monaca】New feature release!

Category :
Monaca
Tags :
Monaca
JavaScript
Android
iPhone
HTML5
Windows1
Monaca Debugger Windows8 Edition
Theme Configuration
Autocomplete

have been released!