How Can I Create Custom Containers

I started learning ignition perspective recently, and so far I see no way to achieve this. I'm trying to make reusable view, so that you can take a view, embed it, and place components or other views inside of this embedded view, similar to what you can do with containers. I want to do this so that a single item in a menu can contain an icon, or a row container with icons in it, or maybe a label, etc.

Is there any way to achieve this?

Sounds like you'd need a custom module (via the SDK).

You can make any Perspective view reusable. By assigning parameters in the view's properties you can pass in values and the components on the view can be bound to the parameters.

Have a look at Perspective - Embedding Palette | Ignition User Manual and, in particular, the Embedded View component and the Flex Repeater component. If there are video links on those pages then I recommend watching those too.

If I'm not mistaken, I can make a reusable view that supports embedding other views with these components by passing in a url parameter for the view I want to use, but using embedded views etc. won't allow me to use a component (like a row or icon) as an input. I would instead have to create a new view, place the components I want in it, and use that new view as an input url for an embedded view, which isn't ideal. Please let me know if I'm wrong here.

Mock up a picture of what you're trying to do. You're not passing a URL, you're passing an Ignition project viewpath. (The whole project will run in the same web page with Ignition swapping in and out the views as required.)

.... won't allow me to use a component (like a row or icon) as an input.

A row isn't a component so I'm not clear what you are proposing here.
You can't pass an icon into a view but you can pass the icon path as a view parameter and then bind the icon path on an existing icon on that view to the view parameter.

I would instead have to create a new view, place the components I want in it, and use that new view as an input url for an embedded view, ...

If you have multiple views with very similar layouts you should be able to get away with just one sub-view that can be used in a Flex Repeater. If certain components are not required in some instances of the view then use a visibility parameter and bind that component's visibility property to the view parameter. Then you just enable / disable that component inside each instance of the Flex Repeater view.

2 Likes


I'm only have my phone for this at the moment, so I sketched a basic example. Sorry it's a bit rough

As you can see here there are 2 "views" with similar elements. They both consist of a column with a border, text in the bottom of the column with a border on top of it, and something in the top section of the column. I want to choose what goes into the top of the view, which in this case is an icon in the first view, and a row with 2 icons inside of it in the second view.

Thank you for your suggestion involving the sub-view and repeater, it's a good idea! Not exactly what I was imagining, but if all else fails it may be a good fallback plan.

So, create one reusable view. Add the following parameters to it (and give it some initial values to assist during the design phase):
caption : Caption goes here
iconPath1 : material/wb_sunny
iconVisibility1 : true
iconPath2 : material/bedtime
iconVisibility2 : true

Drop two icons and a label onto the view and bind the relevant properties to the view parameters.

  • Now create a new view and add a Flex Repeater component.-
    Set the path property to the name of the previous view.
  • Create an instance of the view using the + button.
  • There's another + button beside instances.0. Hit it, select Parameters → Sync Parameters.
  • Right click on instances.0 and select Duplicate.
  • Edit the parameters on instances.1 to see it working. Change the caption and set instances.0.iconVisibility2 : false. That should make it disappear.

Have fun.

If you want to place an arbitrary number of arbitrary components within your custom container, you aren't wrong. You need to use the SDK to produce a custom container to achieve that.

1 Like

That is my goal, thank you for confirming I'll need a custom solution for this.