Asial Blog

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!