Operator View is intended to give you an opportunity to design a simple UI for your line operators, where they can view the camera with an evaluation of the current image and optionally see other information or be able to enter/choose inputs, which can then be processed in Code.

Editor

Editor is the place where you can design, how the Operator View should look - determine what elements it should contain and customize its position, style, and function.

You can get to it from the Camera tab by selecting Operator View > Edit.

Elements

The Root, Camera, and counter elements are always present in the Operator View, but you have the option to add and customize other elements like Label, Input, Select, Slider, Image, or other counters. The default counters are used for counting the number of bad, good, and all images, but they can be deleted or changed.

Position of element can be changed not only by entering specific X and Y number in its settings, but also by clicking on the element and dragging it around the view.

Visibility by key

This is a parameter for optional elements, which allows you to determine that a certain element will be visible only if the specified key in Context is True. You can then set this key in Code based on your own rules.

E.g. this simple code sets visibility to True if an image is evaluated as NG and to False if an image is OK:

def main(context):
    context['visibility_key'] = not(context['result'])

Root

Root is the main element in which all the other elements are contained. You are able to choose the background color of the root element.

Camera

The camera element shows the current view from the camera - the same as you would see in the Camera tab. To see the evaluated view, evaluation needs to be enabled in any module and the Process option enabled in the Camera tab.

You can customize the position and size of the area where the camera should be shown and also turn Rectangles on and off.

Label

The label is an element that allows you to show text to the operator.

The basic settings you can choose are position, background color, text color, offset from the edge of the label-rectangle, and also font size and visibility by key.

The source type parameter determines whether your text will be static (not changing) or dynamic (changing based on some variable in context).

If you choose static source type, you can enter your desired text in the Text field. This option where text is not changing can be useful to show some instructions, descriptions, etc.

If you choose dynamic source type you get the option to choose the context key which will contain the text to be displayed.

Then, you can change the specified context key in the Code module for each processed image and the value the key currently has will be shown in the Label in Operator View.

E.g. if you enter this simple code in the Code module, it will show the text ‘True’ in the label if an image is evaluated as OK and ‘False’ if an image is evaluated as NOK:

def main(context):
    context['label_key'] = str(context['result'])

Input

The input element allows the operator to write any input text into a field, which can then be processed in Code.

The basic settings you can choose are position, background color, text color, width, font size, and visibility by key.

You can also set the Label text for this input, which can describe what the operator should input in this field, e.g. product type, etc.

Enable Max Length option lets you limit the number of characters the operator is allowed to input into this field.

Target Key is the key in Context which will contain the value which was entered in this field at the time the image was processed. You can then work with this value in Code where you access it with (if the target key is set to ‘input1’):

context['operatorInput']['input1']

If you want to have multiple inputs (or selects/sliders - explained below) in the operator view, you have to set different target key for each of them, so e.g. set one to ‘input1’ and the other to ‘input2’.

Select

Select element allows the operator to select one of the defined options and the chosen option can then be processed in Code.

The basic settings you can choose are position, background color, text color, width, font size, and visibility by key.

You can also set the Label text for this select, which can describe what the operator should select in this field, e.g. product type, etc.

Slider

The slider element allows the operator to select a number from a given range set with min and max. Either by using the slider itself or the text field next to it (if enabled by Show text field).

The Label can be used to describe what kind of value is set by the slider. Apart from the position, you can also adjust the slider width and set visibility by key.

Disabling the text field can be used e.g. when trying to make an “on/off switch” between 0 and 1, otherwise, the text field is needed for showing the set value.

Target Key is the key in Context which will contain the value which was selected in this field at the time the image was processed. You can then work with this value in Code where you access it with (if the target key is set to ‘input2’):

context['operatorInput']['input2']

If you want to have multiple inputs/selects/sliders in the operator view, you have to set different target key for each of them, so e.g. set one to ‘input1’ and the other to ‘input2’.

Open Operator View

When you finish configuring your operator view in Editor, click on Save and go back to the Camera tab and select Operator View > Open, then a window like this will open (with elements as you defined them in Editor) and the operator can start interacting with it:

For images you saved (when you had ‘Save images’ enabled or you ‘Captured' the image while the Operator View was running) you can see the operator inputs at that time in the Inspection tab under 'operatorInput’ key, which is a dictionary containing key-value pairs for all your inputs/selects/sliders.

If you set some dynamic label, you can see the value of its context key (if you set its value in code) at that time under the context key name you selected, so e.g. 'label_key' in this example.

If you set visibility by key for some element and you set its value in code, you will see it here too under the name you selected for the key so e.g. ‘visibility_key’ in this example.