Skip to content

2.5.0

Compare
Choose a tag to compare
@tbuschto tbuschto released this 23 May 08:48
· 727 commits to master since this release

New Popover dialog

A new Popover popup has been introduced. It allows to cover the app UI in a modal fashion with a custom UI. On large screen devices the Popover will be shown in a window style appearance while on small devices it covers the entire screen.

let popover = new Popover();
popover.contentView.append(new TextView({text: 'Hello Popover'}));
popover.open();

New navigationAction property on NavigationView

The navigationAction can be used to replace the menu action on the NavigtationView. This can be useful to e.g. create a custom "close" action.

Support for linear gradients

The background property on a Widget now supports linear gradients. The gradient syntax follows the same notation as the W3C linear-gradient specification.

new Composite({
  left: 0, right: 0, top: 0, bottom: 0,
  background: 'linear-gradient(to right top, red, green 50%, aqua 150%)',
}).appendTo(tabris.ui.contentView);

Child selectors

All methods that accept selector a string can now also handle child selectors in the CSS-like syntax of 'selectorA > selectorB. For example:

widget.apply({'.columnLayout > *': {left: 0, top: 'prev() 10', right: 0});

This will apply the given properties to all widgets who's parent has columnLayout in its class attribute.

:host selector

The widget find and apply methods now also support the selector :host, inspired by the Web Component API. It always refers to the widget instance of the method that is called. Used with the apply method it allows a widget to refer to itself or descendants of a specific relationship to itself. Example:

widget.apply({
 ':host': {left: 0, top: 0, right: 0, bottom: 0},
 ':host > Composite': {left: 0, top: 'prev() 10', right: 0}
});

Previously this would have required either assigning specific id/class attributes to the targets or separate children/set calls.

New tap event on StatusBar

The StatusBar supports a new tap event on iOS. It can be used to e.g. trigger a "scroll-to-top" when the main content of the app consists of a scrolling container.

New name property on Device

The new name property on Device returns the user provided name of a device, e.g. "Joe's iPhone". The property is supported on iOS only.

Added support for printing images

The printing capabilities have been extended to print images. An images will be printed fullscreen in the center of the page. To support this new output type a property contentType has been added to the print options. It has to be either image/<format> or application/pdf.

printer.print(data, {jobName: 'image.jpg', contentType: 'image/jpg'}))
  .then(event => console.log('Printing finished', event))
  .catch(err => console.error(err));