Categories
Related

Working with Toolbars and CUI

Skyler Crossman
Working with Toolbars and CUI

Configurable User Interface forms a remarkably complete package for customizing the layout of Aras Innovator, and in this article we’ll take a look at working with toolbars using CUI. The toolbars are present at the top of many pages and forms, providing functions and drop down menus from an accessible location.

This article assumes you’re logged in as an administrator, and that you have a familiarity with Aras Innovator. Screenshots and directions will use version 12, service pack 10.

Add a Button

Starting with a basic example, lets say we wish to add a button to the Part item’s toolbar, one every user can access. 

  1. Open the Part ItemType and select the Client Style relationship tab.
  2. Right click the entry in the grid and select Open to open the Presentation Configuration for the Part ItemType.
  3. Click the Edit button.
  4. Click the New button in the Command Bar Section grid to create a new section with the following properties:
    1. Classification: Data Model
    2. Name: Part_Custom_Buttons
    3. Location: ItemView.ItemCommandBar
    4. Sort Order: 256
    5. For Identity: World
  5. Click the Save button.
  6. Right click the new Command Bar Section and select Open.
  7. Click the Edit button.
  8. Click the New button in the Command Bar Item grid, then select Button > OK in the dialog to create a new button with the following properties:
    1. Name: My_Button
    2. Sort Order: 2000
    3. Action: Add
    4. For Identity: World
  9. Click Save.
  10. Right click the new Button and select Open.
  11. Click the Edit button.
  12. Set the following properties on the item form:
    1. Label: enter the label you want to appear on the button
    2. Click Method: choose a Method you want to execute when the button is clicked
    3. Image: choose an icon to display in the button
  13. Click Save.

To see our work, open a Part item. You should see your new button in the toolbar up top, right as you see below.

That’s the basic change to a toolbar, adding the options you need. What if you have the opposite issue, and want to remove something?

Remove a Button

Sometimes, a user or group of users don’t need some option. It overcomplicates their layout, requires explanation that wastes time, and invites misclicks. In this example, we’ll hide the Share button on the Part BOM relationship toolbar- but only for certain users, the ones who are members of an identity called All Suppliers.

  1. Open the Part BOM ItemType and click the Edit button.
  2. In the Client Style relationship tab, click the New button to create a new Presentation Configuration with the following properties:
    1. Name: Part_BOM
  3. Click the Save button.
  4. Right click the new Presentation Configuration and select Open.
  5. Click the Edit button.
  6. Click the New button in the Command Bar Section grid to create a new section with the following properties:
    1. Classification: Data Model
    2. Name: Part_BOM_Custom
    3. Location: ItemView.RelationshipsCommandBar
    4. Sort Order: 128
    5. For Identity: All Suppliers
  7. Click the Save button.
  8. Right click the new Command Bar Section and select Open.
  9. Click the Edit button.
  10. Click the Add button in the Command Bar Item grid, then search for the commonitems.commandbar.sharemenu item. Click OK in the search dialog to add the item to the Command Bar Items grid.
  11. Set the following properties for the Command Bar Item:
    1. Action: Remove
    2. For Identity: All Suppliers
  12. Click Save.

To test this, you’ll want to log out of Aras Innovator or open a new browser. Either way, log in as a member of the All Suppliers identity. Open a Part item to see that the Share button no longer appears in the Part BOM relationship toolbar.

Now we can add, and we can remove. What if we want to take a quick shortcut and replace something, rather than going through adding it and taking it away?

Replace a Button

This is really just a fast way to swap a button in the toolbar with a new button of your own design. As an example, we'll replace the default New button with a custom button on the Part Search toolbar.

  1. Open the Part ItemType and select the Client Style relationship tab.
  2. Right click the entry in the grid and select Open to open the Presentation Configuration for the Part ItemType.
  3. Click the Edit button.
  4. Click the New button in the Command Bar Section grid to create a new section with the following properties:
    1. Classification: Data Model
    2. Name: Part_Search_Custom_Buttons
    3. Location: SearchView.CommandBar
    4. Sort Order: 512
    5. For Identity: World
  5. Click the Save button.
  6. Right click the new Command Bar Section and select Open.
  7. Click the Edit button.
  8. Click the Add button in the Command Bar Item grid, then search for the searchview.commandbar.default.new item. Click OK in the search dialog to add the item to the Command Bar Items grid.
  9. Set the following properties for the Command Bar Item:
    1. Sort Order: 2000
    2. Action: Replace
    3. For Identity: World
  10. Click Save.
  11. Right click the Button and select Open.
  12. Click the “…” button in the toolbar and select Create New Button to create a new Button with the following properties:
    1. Name: My_New_Button
    2. Label: New
    3. Tooltip Template: New {0}
    4. Init Method: cui_svcb_new_init
    5. Click Method: cui_ivicb_more_new_click
    6. Image: choose an icon to display in the button
  13. Click Save.
  14. Navigate back to the Part_Search_Custom_Buttons Command Bar Section tab.
  15. In the Alternate property of the searchview.commandbar.default.new Command Bar Item relationship, enter My_New_Button.
  16. Click Save.

To see your change, open the Table of Contents then navigate to Design -> Parts to see the custom “New” button in the search toolbar. You should see it sitting proudly changed, easily altered and present for all future use. Toolbars are, in the end, a vehicle for the tools we put in them. Adjusting your toolbelt to the task at hand shouldn’t be hard, and in Aras Innovator, it isn’t. You can even add shark repellant!

Conclusions and Congratulations

Now you can add, remove, and swap things from your toolbars without needing to write your own interfaces. Reuse methods or functionality from elsewhere, or provide a prominent place for your own custom code. This just reinforces what we already know: CUI is a powerful, flexible tool to have in your arsenal. Everything can be connected, adjusted and customized to fit your needs.

What’s the most used toolbar option in your organization? What’s something else you wish you had right next to it? Let us know that as well as what you’re using CUI for in the comments!