Component Creation

1. Click the New button in the Component of Presentation Layer.
   

2. Choose Component Type. (Step1)

   

   [Component Type Table]

   No	Name	Description
   1	List	Display List Data on the screen
   2	Form	Display Form Data on the screen
   3	Toolbar	A component containing buttons or other elements positioned at the top of a Form or List
   4	ToolbarList	A Toolbar Component is added at the top of the List Component
   5	ToolbarForm	A Toolbar Component is added at the top of the Form Component
   6	Tab	Separate the arranged components using tabs
   7	Steps	Display the progress steps
   8	Comment	Display as the format of commments
   9	Box	Display data as a single item
   10	DetailHeader	Display only the key information at the top (Mobile-only)
   11	SearchList	A list that is used with search conditions (Mobile-only)
   12	Tree	A component that represents hierarchical structures such as menus
   13	Timeline	Display data in a timeline format represented by dots and lines
   14	Kanban	A component that displays data in a Kanban format
   15	IFrame	Display external websites or Java registered in CALS (Web-only)
   16	WebView	Display external website or Java screens registered in CALS (Mobile-Only)
   17	Schedule	Display data in a calendar format
   18	Grid	Display the large amounts of data in a list format
   19	ToolbarGrid	Add a Toolbar Component at the top of the Grid Component
   20	CustomForm	Display the name of the logged-in user at the top (Mobile-only)
   21	WebComponent	Display a screen implemented with Vue.js in CALS (Extension)
   22	Carousel	Display multiple images or content

3. After entering Component Name, choose Business Object(Step3).
   (The connection between Business Objects and Component elements os established using the created Business Object can be searched by name for connection.)

4. Select the fields from the Business Object Field that will be displayed in the Component, then move to the Component usage field and Click Next (Step4)

   

5. Select button that will be used in the component.Buttons can be selected multiple times. (Step5)

   

6. Verify the setting made to create the component.

7. Newly registered component can be searched by its name and once the name of the Component is double clicked, it will redirect to the Component Detail Page.In the detailed screen, select a control, then right-click and choose View Attributes to display the properties of each control in the right panel of the screen. You can then dgsn modify them accordingly. Use the items in the View Attributes panel to edit the detailed properties of the selected control.