Creating Object Masters using the Object Master Maintenance

In this part we will design a Form containing components like a Grid and Browser. We will also extend the Form and create a Tab Folder with tab pages inside. Using the Object Master Designer to design repository based screen provides more flexibility to the developer.

When the Open Object Master window appears we can filter using Object Name, Object Type and Module fields. To create a new object we can press cancel. To edit an existing screen, the developer can select an object master from the list.

As we are going to start with a new screen now, please press cancel in the Open Object Master dialog.

Master - contains the general information of the Object Master.

  • Object Name

  • Object Type

  • Customization Result

  • Module

  • Description

  • Object Package

  • Extension

  • Deployment Type

  • Design Time Data Source

Pages – Pages for the form, components like viewers and grids can be part of a page (e.g.: Customers/Orders/Items tabs)

Instances – Every form, viewer and grid can have a number of contained instances (e.g.: buttons, fields, grids or viewers etc.)

Design – this is a Visual Designer for your form, viewer or grid. For viewers this will utilize the design canvas that Microsoft provides for Visual Studio. For Grids, we are rendering an Infragistics Grid supporting to add columns and change column attributes. For the Form this presents a logical design preview.

Links – Maintenance of links between your objects and data sources.

Where used – All the places where this object master is being used inside containers (e.g. Forms using a Viewer or Viewers using a certain Data Field)

Creating a Form master

Click on Add record from the toolbar. Let’s begin by naming our object – MyObjectContainer.

Leave the Customization Result field empty.

For Object Type, click on the three dots at the end of the field, and search for “MetaForm” then select Object Type MetaForm.

 

For Module choose Demo. Leave the rest of the fields empty and click on Save Changes button located in the toolbar ribbon.

 

 

Adding a Viewer to the Form

If we would Launch our form right now – we will see an empty form. By accessing the Design tab, we can verify that we do not have any Instances in our form yet.

We can add a viewer inside our form followed by a toolbar and a grid.

Please go to Instances tab and then Add record.

This will add an empty record. On the right side of the window we can fill in the details.

Object Sequence should be 1.

For Object Master we will select MyCustomerViewer. By clicking into instance name, automatically it will be filled with the same name as the Object Master, so the instance will also be named “MyCustomerViewer” by default.

Leave Page with the default value of “Container”.

Parent Instance should be “<Container>”.

On Layout Position we select where we want the instance to be placed in the form, select A1. This will place the viewer on the top-left side of the screen.

Please save your changes by clicking on the “Save changes” button in the ribbon.

We can Launch the form by selecting the “Launch Form” option from the ribbon. The result should look similar to this.

 

 

The fields do not have any data as we have yet to create a Data Link between our CustomerViewer and a DataSource.

First we will need an instance of the MyCustomerDataSource object.

Adding a DataSource instance to the Form

On the instances tab, click on Add Record. Please set the following values for this object instance:

  • Object Sequence: 2 (The default value)

  • Object Master: Click the three dots and select MyCustomerDataSource

  • Instance Name: MyCustomerDataSource

  • Page: Container (Default value)

  • Parent Instance: <Container>

Leave the rest of the fields empty. Save changes.

Linking the DataSource to the CustomerViewer

Next, please navigate to the “Links” tab.

Click on “Add record” in the ribbon.

With the new empty record, we will be filling the following values:

  • Link Type: Data

  • Link Name: CustomerData

  • Source: MyCustomerDataSource

  • Target: MyCustomerViewer

Save changes, let’s take a look at our form by launching it.

Now that we have the data source instance created, we can also add a grid and toolbar to our form to see other records than the first one, and then link those to the data source instance.

We will go back to the “Instances” tab and start adding our Grid and Toolbar.

Adding the Grid instance to the Form

Start by adding a new record:

  • Object Master: MyCustomerGrid

  • Instance Name: MyCustomerGrid

  • Parent Instance: <Container>

  • Layout Position: A2

Save changes.

Adding a Toolbar instance to the Form.

Add another record on the Instances Tab as shown:

  • Go to Object Master field of the record and filter “Object Type Name” in the search query type “MetaToolbar” and select the Object Name “DefaultToolbar”.

  • Instance Name: MyDefaultToolbar

  • Parent Instance: <Container>

  • Layout Position: A3 NOTE: As long as it does not overlap with other Objects, the position for MetaToolbar Object Types IS NOT relevant because they will always be positioned in the ribbon of the form as in accordance to the Microsoft ribbon control standards.

Opening the form right now will yield similar results to what we had when we first created the viewer. The Grid will not have any data as we have not created its Data Link yet.

The same applies to the Toolbar. While visible, we cannot do anything with it until we have created a TableIO Link.

We will go to the Links tab and add another two records. First one is for the Grid.

 

  • Link Type: Data

  • Link Name: CustomerGridData

  • Source: MyCustomerDataSource

  • Target: MyCustomerGrid

For the toolbar we will use a different “Link Type”.

This time we will use “TableIO” Link Type, with the source being the MyDefaultToolbar and target MyCustomerViewer. The TableIO Link controls the update behavior of the Viewer using the buttons in the Ribbon.

  • Link Type: TableIO

  • Link Name: TableIO

  • Source: MyDefaultToolbar

  • Target: MyCustomerViewer

Save the changes and Launch the Form. We can now also use the Toolbar from the ribbon to Add, Copy, Update and Delete records.

Please also check the Design tab. Here you can preview your Layout position of every instance.

Adding pages to your form

Pages can be an important part of a screens design. You can have multiple pages in a single form and together with a component like a tab folder pages provide the ability to manage the visibility of components in the Form.

We will be adding some new Instances for the Order page, but first let us see how we will create a page for the Customer and then move the existing viewer instance to that page.

Start by going to the “Pages” tab, then click “Add record”.

In this new empty record, we will enter the following values:

  • Page Number: 1

  • Page Label: CustomerPage

  • Page Key: customer

  • Page Icon: any .PNG format file or navigate to Consultingwerk/SmartComponentsDemo/Web2/Images/businesspeople2.png

We now have to add a new Instance type, called TabFolder. The Form depends on the TabFolder to render the tab pages.

Please move back to Instance’s tab and create a new instance record for the TabFolder object master:

Then change the layout position of the MyCustomerGridInstance to A1

Then change the Page of the Customer Viewer instance to the “Customer” page you have previously created.

The result should look similar to this:

Adding an Order page with instances of the Order Grid and Order Data Source

Now that the screen is starting to look more serious, we will add another tab. But first, let’s create some repository masters for components required to short the list of Orders of the selected Customer.

Open a new session of Business Entity Designer and open an existing Order Business Entity Design.

Creating the DataSource for the Order table

Next, select the “Smart Repository” tab from the Ribbon and Create the DataSource, by clicking “Create DataSource” button.

Object Name: MyOrderDataSource

Make sure that in Configuration only eOrder table is checked.

Click OK.

Create the Order Grid

Click “Create Grid” from the ribbon

Object Name: MyOrderGrid

For the Data Source, choose the previous created one “MyOrderDataSource”, then select the fields you would like to see in the OrderGrid.

Click OK.

Adding the Order page

Please go back to the Object Master Maintenance, and select the Pages tab and add a new record:

  • Page Number: 2

  • Page Label: OrderPage

  • Page Key: order

  • Un-check “Enable on create” and “Enable on modify”

Save changes.

Creating the MyOrderGrid instance

Please switch back to the Instances tab and add a new record.

  • Object Master: MyOrderGrid

  • Instance Name: MyOrderGrid

  • Page: (2) OrderPage

  • Parent Instance: <Container>

  • Layout Position: A1

Creating The MyOrderDataSource instance

We will add a new DataSource Instance for the Order Grid and then link those two.

  • Object Master: MyOrderDataSource

  • Instance Name: MyOrderDataSource

  • Page: Container

Please switch to the Links tab and add a new record.

  • Link Type: Data

  • Link Name: OrderGridData

  • Source: MyOrderDataSource

  • Target: MyOrderGrid