Create Fragments¶
Fragments are light-weight UI parts (UI sub-trees) which is expected to have broad reuse. The Fragments
folder contains the metadata definitions for your application's fragments. After you have created your new Mobile Development Kit project, an empty Fragments
folder is automatically created under your project.
Prerequisites¶
You must have a valid Mobile Development Kit project.
Procedure¶
-
Under your newly created project, right-click the Fragments folder and click
MDK: New Fragment
. -
Provide a name for the fragment and click
Finish
. A new blank fragment is created under theFragments
folder. -
To start working with a fragment, double-click it or right-click and choose
Open With
and then selectMDK Fragment Editor
orCode Editor
.
Note
Changes made in the fragment editor simultaneously appear in the code editor.
Fragment Editor¶
The Fragment Editor
view contains the Controls
and Outline
tabs on the left-hand side, where you can see the controls applicable for your app. You can simply drag and drop UI elements from the Controls
tab directly into the Fragment Editor
of the fragment you created. After dragging the first control into the Fragment Editor
, the controls in Controls
tab will be updated and unused controls will be filtered out.
The Outline tab shows the control hierarchy of the fragment you are designing. When you add a control, it is displayed under the Outline tab. Also, you can easily choose nested controls from this view.
On the right-hand side of the Fragment Editor
, you can see the Properties
and Events
tabs, which contain the properties of the currently selected control and the events that you can associate with the selected controls.
Use Fragment in Page Editor¶
Open a page with page editor, all the fragments present in the Fragments
folder are displayed in the Fragments
section of the control panel. You can simply drag and drop any fragment into this page.
Note
For a compound control in a section page, you can drag a fragment containing one corresponding item control into it, the fragment will replace the corresponding part of this compound control.
You can override the properties of a fragment by modifying its properties in the property pane.
Here are some limitations with fragment editor:
- Inserting a control or a fragment in a fragment control in the page editor, and nesting of fragments in the fragment editor are not supported.
- Moving a sub control up/down in a fragment control in the page editor, and nesting of fragments in the fragment editor are not supported.
- Some controls rendered in fragment are not the same as in page editor, for example: grid row item, data table column, etc.
- Overriding the properties of a fragment in page editor is not supported.
To make changes, you can switch to the code editor by right-clicking on fragment, choose Open With
and then select Text Editor
.
For more information about fragments, see Fragments.
Code Editor¶
The Code Editor
view displays the codes for your metadata elements. As you add or modify contents in the Fragment Editor
, the changes simultaneously reflect in the Code Editor
.