Menu hamburger icon

Onsen UI 1.1.2 released with gesture and back button support

We released Onsen UI 1.1.2 today, with full of small fixes and feature enhancements.

Ionicons support

In addition to Font Awesome, Ionicons icon collection is now supported. To use them, just use a ons-icon component as usual, but use ion- prefix.

Gesture detector

We introduced a new component to detect finger gesture. By using ons-gesture-detector, you can detect gesture events like pinch, drag, and swipe. For more details, please take a look at Detecting Finger Gestures - Onsen UI Guide.

Back button more customizable

Now Android back button events are more customizable. You can assign a specific back button handler on each page, or override the default component or application’s back button behavior. Take a look at Handling Back Button - Onsen UI Guide.

New ons-template tag

You can include multiple page definitions in a single HTML. To do so, you can now use a brand-new ons-template component. The usage is very straight forward, but may worth take a look at how to use the component.

List of all changes

You can also see all the change logs from our GitHub repo.

  • Added ‘ons-gesture-detector’ directive.
  • Added ‘ons-template’ directive.
  • core: Removed several memory leak possibilities.
  • core: Added minified scripts.
  • core: Changes ons.bootstrap() to accept dependency module names, e.g. ons.bootstrap([‘ngAnimate’]).
  • core: Added ons.findComponent(), ons.findParenComponentUntil() methods to retrieve components.
  • core: Added ons.setDefaultDeviceBackButtonListener(), ons.disableDeviceBackButtonHandler(), ons.enableDeviceBackButtonHandler() methods.
  • css-components: Updated border styles on some components for retina display.
  • css-components: Added ‘button–outline’ component.
  • css-components: Renamed ‘icon-button’ component to ‘toolbar-button’.
  • css-components: Added ‘toolbar-button–outline’ component.
  • ons-navigator: Fixed #165.
  • ons-navigator: Added navigator.getDeviceBackButtonHandler().
  • ons-tabbar: Added ‘animation’ attribute.
  • ons-page: Added page.getDeviceBackButtonHandler(), page.setDeviceBackButtonHandler().
  • ons-modal: Added modal.getDeviceBackButtonHandler().
  • ons-modal: Fixed #182.
  • ons-sliding-menu: Added slidingMenu.getDeviceBackButtonHandler().
  • ons-icon: Added ionicons.
  • ons-scroller: Fixed #184.
  • ons-switch: Fixed #185.
  • ons-tabbar: Added tabbar.loadPage(), tabbar.getActiveTabIndex().
  • ons-tabbar: Changed tab-change behaivior to be cancelable with event.cancel() method on ‘prechange’ events.
  • ons-tabbar: Added ‘animation’ attribute and TabbarView.registerAnimator() to use tabbar animation on loading.