Skip to content

2.0.0 RC 2

Pre-release
Pre-release
Compare
Choose a tag to compare
@ralfstx ralfstx released this 13 Jun 17:25
· 983 commits to master since this release

Support for declarative UI using JSX

Widgets can now be created using JSX syntax. When using TypeScript this requires no extra dependencies, simply generate a new TypeScript project using tabris init and create a file with the .tsx file extension. Example:

import {ui} from 'tabris';

ui.contentView.append(
  <tabFolder left={0} top={0} right={0} bottom={0}>
    <tab title='First tab'>
      <textView text='Hello World' />
    </tab>
  </tabFolder>
);

JSX can be much more expressive than pure JavaScript/TypeScript. Compare the "input" example in JavaScript vs. TypeScript/JSX.

New basic filesystem API

We started to implement a basic filesystem API in Tabris.js. This first version can only read, write, and delete binary files. The API will be extended over time.

The new fs object provides two properties filesDir and cacheDir that point to the base paths for the app. Only files in these directories can be accessed.

The methods writeFile(path, data), readFile(path), and removeFile(path) are all asynchronous and return a promise.

Example:

let data = new Uint8Array([1, 2, 3]).buffer;

fs.writeFile(fs.fileDir + '/test.data', data)
  .then(() => console.log( data.byteLength + ' bytes written'))
  .catch(err => console.error(err));

See the documentation for the details.

New data property on Widget

To attach custom data to a Widget without the risk of clashes with widget internals, you can now use the data property. This property holds an empty object that is not used by the framework and can be freely used by the application code. Manipulations on this object will not affect the widget itself. Example:

widget.data.myItem = 23;

New load() method on CollectionView

We introduced a new method load() in CollectionView that replaces the current items with a new ones. To load new data into a CollectionView, use this method instead of setting the itemCount property.

Support for selectors in NavigationView.pages()

The pages() method on NavigationView now accepts a selector argument similar to children() to filter the list of pages. Example:

navigationView.pages('.temporary').dispose();

Introduce tintColor on Slider and ProgressBar

The color of the indicator in Slider and ProgressBar widgets can now be controlled by the new property tintColor. This had been possible with textColor, which is no longer supported on these widgets.

Windows support for existing (pre-RC2) Tabris.js APIs:

  • Support for tabris.app events background, foreground, pause and resume. terminate will not be supported in the foreseeable future.
  • Support for tabris.app properties appID, version and versionID.
  • Support for tabris.CollectionView property cellType, and support for automatic itemHeight.
  • Support for tabris.CollectionView method reveal
  • Support for tabris.AlertDialog. The neutral button is not yet supported.
  • Support for WebSocket.

Windows changes on TabFolder

  • Property background is now applied only to the tab bar, as on Android.
  • Property textColor will not be supported in the foreseeable future.
  • New property win_tabBarTheme allows setting the windows dark/light theme on the tab bar only.

Build service uses Tabris CLI

When you build your Tabris 2.0 app with the online build service at tabrisjs.com, this build will now use the Tabris CLI. As a notable difference to 1.x, apps that built in debug mode won't be wrapped in a developer app anymore. You can load a remote app using the new URL field in the developer console. Also note that the developer console must be enabled explicitly in your config.xml, e.g.:

<preference name="EnableDeveloperConsole" value="$IS_DEBUG" />