Creating the reusable visual part

Visual Programming User Guide : Introduction to Visual Programming : Creating reusable parts : Creating a reusable visual part : Creating the reusable visual part

In the Organizer, create a new visual part named ReusableRoadRaceView. In the Composition Editor, delete the Window part, and add a Form part to the free-form surface.

Note:

Place the new visual part in the same Application as RoadRaceView

Select the Organizer window and open the Composition Editor for RoadRaceView. If they aren't set already, specify the settings for the Runner number and Finish Time Text parts as follows:

• For the Runner number Text part, set the maxLength property to 3 and set enabled to true. For the converter property, set its data type to String, its min to 1, and its defaultObjectFromEmptyString to 100.

• For the Start time and Finish time Text parts, set the converter property's data type to Time, its timeFormat to 24-hour, and its showSeconds to true.

• For the Start time Text part, its defaultObjectFromEmptyString to 10:00:00.

Next, copy parts from this visual part to your new ReusableRoadRaceView part. Select the parts as follows:

1. First select the Runner number Label part by clicking with mouse button 1.

2. While pressing and holding the Ctrl key, click on the Start time Label part, the Finish time Label part, and the Text parts for Runner number, Start time and Finish time.

3. From the Edit menu, select Copy.

All the selected parts and their attributes have now been copied to the clipboard. Close the Composition Editor for RoadRaceView.

In the Composition Editor for ReusableRoadRaceView:

4. Select Paste from the Edit menu.

5. Click mouse button 1 in the upper left corner of the form.

All the fields that were selected in RoadRaceView will now appear on the form in ReusableRoadRaceView. All the attributes of each part were also copied. You can confirm this by checking the settings for one or more of the Text parts. This method is a convenient way to copy portions of existing window parts into reusable forms.

Resize the form so all the subparts are visible. Your form should now look like the following:
Form

You now have a form that can be reused in other visual parts. Now, you will want to make the content of the Text parts available in the form's public interface. To make it easier to deal with the Text parts in the Public Interface Editor, let's rename them first.

Select Change Name from the Runner number Text part's pop-up menu and change its name to runnerNumberText.

Select Change Name from the Finish time Text part's pop-up menu and change its name to finishTimeText.

Select Save Part from the File menu.

Last modified date: 07/15/2020