Enyo Developer Guide Bootplate: with Enyo in 5 Minutes · Planning and Structuring Your App · Tutorial: Building a Moonstone App. Enyo Essentials. As an Enyo developer, you have a great deal of freedom in choosing the platform . If you haven’t already done so, read through the Moonstone App Tutorial. This tutorial is geared for those already know the basic . Hope this tutorial helps in setting up the environment right for enyo development.

Author: Visar Zulura
Country: France
Language: English (Spanish)
Genre: Education
Published (Last): 6 December 2013
Pages: 229
PDF File Size: 12.17 Mb
ePub File Size: 8.98 Mb
ISBN: 251-8-66741-689-1
Downloads: 74589
Price: Free* [*Free Regsitration Required]
Uploader: Shakagami

Other reason enter details.

User Menu Login Register. The next immediate change to be made is to convert all the normal buttons to Onyx buttons and also replace the “img” tag with an “enyo.

In the above code ‘this. The above code has a published property called ‘rotation’ which is initially set to ‘0’ and will store the rotation applied to the image in the component. Below is the code for the ‘rotationChanged’ method. Inaccurate emyo wrong information. The first thing user has to do for using the ‘Onyx’ components is to add the “onyx” class to the application. In this application “layoutKind” property of a control is used to apply proper layout to the application.

Components can also be enyi together to create more complex components. This article demonstrates the usage of Enyo framework. Now divide the “Rotate” button into two, one for clockwise rotation and the other for counter clockwise rotation.

Sample App using Enyo framework | Tizen Developers

After adding the ‘rotationChanged’ function to the code, the image will rotate through 90 degrees when user clicks on “Rotate” button. Onyx extends and improves the library tuotrial components available for Enyo by adding additional features and styling. This effectively makes the component itself the app. Replace the content of ‘index.


This article explains a tutoroal application that can ‘rotate’ and ‘skew’ an image. This can then be reused across multiple applications or within the same application. Too difficult to understand. FittableColumns allows user to place content in columns. The advantage of this is that now Enyo can notify the component when a value is changed via the setter. Below is the final code with proper layout enyo.

Tktorial use this sample in application user has to know how to setup an enyo framework. Enyo will create ‘getters’ and ‘setters’ for the properties defined in “Published” section of the code.

Apply proper layout to the app. So in the above case, Enyo will automatically create the methods ‘setRotation’ and ‘getRotation’ on the object. Now create a method called “rotationChanged”, and Enyo will automatically call it when ‘rotation’ value is changed via ‘setRotation’. Here the “onclick” property is set to ‘rotate’, which is eyo name of a method.

The basic unit of an Enyo application is a “component”, and these “components” can combines and wired together in different ways to create an application. Now the enyo framework is ready to use. As a simple example, user may combine a text area, a submit button and a clear button into a search component.

Enyo also offers a library of components tutlrial layout. Enyo setup First download “enyo” from enyo website and extract the zip folder. In this case it will be able to find out when the rotation is changed, and update the component accordingly. The Onyx component set is designed with mobiles and tablets in mind. Enyo provides a number of ways to define the layout of applications, two important components for layouts are FittableRows and FittableColumns.


Tizen Tizen Tizen 3. Please let us know what you think. Published Property Enyo will create ‘getters’ and ‘setters’ for the properties defined in “Published” section of the code.

To know how the image will rotate, user has to know about Published property. It is object-oriented and uses object-oriented concepts such as encapsulation tutorrial create reusable code.

Sample App using Enyo framework

Was this document helpful? In this method this. The applyStyle method applies a CSS style to the particular component. Sample Application This article explains a sample application that can ‘rotate’ and ‘skew’ an image. After extracting, copy “enyo”, “lib”, “source” rutorial into “Tizen workspace”. Why was this document not helpful?

We value your feedback. FittableRows allows user to place content in rows, on one of these rows user can set the fit property to true which will give it a variable height that will expand as the page is resized.

These two combined can be used to create complex flexible layouts for applications. The advantage of this is that it disables the ability to drag the image, which is important for touch interfaces.