Visual Programming User Guide : Using Common Parts : Adding portable container parts : Adding a Container Icon List part : Creating the visual part
Creating the visual part
1. In the Organizer, select your CardGameApp and create a new visual part called BlackJackGameView. The Composition Editor opens on BlackJackGameView.
2. Change the window title to Black Jack.
3. Add a Container Icon List part to the Window part.
4. Add a PlayingCardDeck part to the free-form surface and change its name to Deal Deck.
5. Connect the container's items attribute to the Deal Deck part's deck attribute.
Open the container's settings and attach each edge of the container to the corresponding edge of the parent as follows:
1. Select the framingSpec property in the Name column and the ... button in the Value column.
2. In the Framing Spec window, select the Top radio button.
a. Select XmATTACHFORM for Attachment type.
b. Enter 0 for Offset.
Repeat these two steps, specifying XmATTACHFORM and 0 for the Bottom, Left, and Right radio buttons.
3. Select OK.
In the container's settings, select the defaultItemIconDescriptor property in the Name column and the ... button in the Value column. In the Graphics Descriptor window, specify an icon as follows:
1. Select the Icon radio button.
2. Enter abtico50 for the module name and 2 for the icon ID. This identifies the default icon that the container will use when displaying each item in the list.
3. Select OK.
For the attributeName property, enter faceValue for the attribute to be displayed and close the settings. Then do the following:
1. Add a toggle button to the free-form surface.
2. Change its label text to Refresh.
3. Open its settings and specify true for the selection property. Close the settings.
4. Connect the toggle button's selection attribute to the container's refreshEntireListOnChange attribute. This connection forces the container to repaint itself whenever its contents change.
Testing the visual part
Save your visual part and then select Test iconto test it. You should see a container with icons to the left and text to the right. All the items should be arranged vertically.
Last modified date: 06/11/2018