FT Optix Custom Made Buttons

Home / FactoryTalk Optix / Optix for HMI

Description
Creating your own custom made buttons with multistate images in FactoryTalk Optix.

Sample code can be found here:
https://github.com/xavierflorensa/FT_OPTIX_CUSTOM_BUTTON

Contributed by Xavier Florensa – YouTubeLinkedInGitHub


Transcript
(00:01) Hi everyone. In this video, I will show you how to make your own custommade buttons in factory talk optics. Uh when you use images, bit maps for your buttons like here in this example. Imagine this button. Each time you click it, you can make a change in value and you have a different image for each state. Even you could use different images here.
(00:36) Let’s see how to achieve this. First of all, you have to have a design on the bit maps, different bit maps. For instance, you could you can cut different images independently. One for on, one for off. And you place uh let’s create a folder where you place your custom buttons. You create a multi-state image for both.
(01:16) And then with this area you can also let’s take this one. You can also uh insert an embedded button and set the opacity property of the button to zero instead of 100. The button can have the same size of the image. So with this property it will be not visible but you will have all the properties of a button. Then on the multi-stage image you have to set up the different values state one state two value zero and one. This is a boolean.
(02:10) And then the path the path to the image you can have the images stored in your project like here on button off etc. This is located in your project file. You can have the place the PNG images here for instance. And well, you point the browse to the direction of the image and you have it. Then on the button properties, well, it’s important to note this value state.
(03:03) that will control the index of the image. Then on the button events, you can insert a new mouse click event to toggle a bit. Just toggle bit and then as an input arguments the variable to change. This is the state value corresponding to this multi-state image and then the bit index zero. Well, with this you will have this object and you can place on your screens so many objects as you want as you want.
(03:51) For instance, this way new. Then you can make to the custom buttons folder and your multistate image. And this is all with this. You will have your custommade buttons. So this is all I hope you enjoy. Thank you very much.