Create Panel with User Controls based on template

In order to use them, you have to create a Panel and select any of the WorkWithPlus for Native Mobile templates that include these User controls.

e.g. You can use the Chart user control by selecting any template under the "Chart" category:


Other user controls also have their own tempalte:




Example 1 - Columns Chart

Create a Panel named 'Columns':


Then select the WorkWithPlus for Native Mobile template 'Columns' and press Select:


A wizard associated with that WorkWithPlus for Native Mobile template will appear so that you can define which attributes/SDT will be the one used for Category Attribute and Series attribute, and press 'Continue':


In this case, the Chart is available just for one Serie, that is why in the 'Series Attribute' field you will be able to select just one attribute (and in the Series Labels you should insert a single one. 

The Panel has been created, and if you select the Grid control and has many properties that can be customized:


At runtime this Panel will look like the following image:


Example 2 - Area Multiple Series Chart

Create a Panel and select that is based on 'Step area for multiple series Chart' and press Select:


In this case, the Category attribute will be just one attribute/SDT item (like in the other example), but the Series will be composed of more than an attribute and label (because the idea is that you use this WorkWithPlus for Native Mobile template when you want to create an SD Panel with an area chart with multiple series).

The order of the series attributes will be the same as the labels. In the example above, ProductVolume attribute serie referrs to 'Cantidad' label serie and so on.

In order to select the attributes, you have to press the '...' button that is next to the field and select all of them in the right order.

After pressing Continue you can visualize that the SD Panel has been created with the controls needed in order to generate the area chart with multiple series:


At runtime this Panel will look like the following image: