This lesson is part of the Perspective Pages, Views, and Containers course. You can browse the rest of the lessons below.

LESSON LIST

Autoplay Off

LESSON

Parameterized Popup Views

Description

In this lesson, we demonstrate how to take a value, and pass it to a popup view.

Transcript

(open in window)

[00:00] In this lesson, I will cover how to pass parameters to a popup view. In a previous lesson, we showed how a button can be configured with a component event to open a view as a popup. But what if in addition to opening the popup, we want to pass the popup some information as it is being opened? This is where popup parameter passing comes in handy. I am currently in my designer and I have a main window with a text field component and a button component. I also have a popup view with a slightly different background color and a label component. I will be configuring the button in my main view to take whatever I type in my text-field component, and pass it to the popup view. I will then display this text-field's value in the popup views label. The idea here is that when I pass a parameter to a view, whatever I am passing, will be available in the view through the view parameter.

[01:00] This view parameter can then be used throughout the view. Usually, in indirect tag-bindings or something similar. For this popup view to be able to accept the parameter, we must first configure a view parameter. To do this, I go over to my project browser, and I select my popup view by left-clicking on it. On the right hand side of the designer, we see the perspective property editor showing all the properties of my selected view. At the bottom, we see a param section. I will click on the "add view parameter" plus button, to add a view parameter. I want my parameter to be a value so I select value. In this example, I will name the parameter "display." And I will save my parameter's value to "Hello World" Since I want my label on my popup to show the value I am passing to my popup's display parameter, I need to bind my labels text property to my display parameter. To do this, I select my label, then I click on the binding icon next to the labels text property on the perspective property editor.

[02:03] This will bring up the binding editor window. Under binding type, I select property, and I head over to the property browser and drill down to "view", "Params", I select "display," since display is my view parameter, and click "OK." Once I click OK on the binding editor window, we see that the label now says: "Hello World!" This is because the label's text property is now bound to the view parameter display. Which means that anything I pass into the view's display parameter will be shown on my label. Now I have to configure the navigation action. To do so, let's go back to the main view. I then select and right-click on the button, select "configure events" to open the event configuration window, and from the events tree, I select "onActionPerformed" and add a popup action. Under the select view dropdown, you will see a list of all the available views in your project. I want to open my popup view, so I select "popup."

[03:01] Since we want to pass a parameter to the popup view, I will click on the plus sign next to the parameters table. Notice how we have a display option. This is because, since we selected the popup view, ignition automatically knows what view parameters are available to us in the popup view we selected. Since we only have a display parameter, I select it, and it gets added to the parameter's table for the parameter value, I double-click on the property browser icon and drill down to "view," "root," "textfeild," "props," I then select "text" and click "OK" What I have done is configured the text-field's text property to be passed to the popup view's display parameter as it is being opened. To finish the setup, I simply click "OK" to finish the event configuration and I save my changes. To test this, we simply launch a session, by pressing the "F10" shortcut key, and once my session opens, the button and text field in my main view will appear. If I type something in the text field and press the button, I see that the popup view opens and what I type gets displayed on the popups label. We can do this again by closing the popup, typing something else in the text-field, and pressing the button once more.

You are editing this transcript.

Make any corrections to improve this transcript. We'll review any changes before posting them.