In today's article I cover how to use images, including those found in the Symbol Factory library, on Buttons in FactoryTalk View Studio Machine Edition.


Step 1) Open a View Studio Machine Edition Project, then a Graphic Display, and then add a Button.

NOTE: In our example below we add a “Maintained” button to the “Low Level Tag Read Write” display found in the sample project “Objects 5 Screen Demo:”

the-automation-minute-s03-e02ab

Step 2) Now double click on your new button to bring up its properties, then change the “Border Style” to “None” and “Back Style” to “Transparent”

the-automation-minute-s03-e02b

Step 3) Next click on the “States” tab, then select a state and click on the Image ellipses (…) to browse for an image:

the-automation-minute-s03-e02c

Step 4) Here you can browse for an existing BMP, JPG, or PNG image using the “Add from File” button:

the-automation-minute-s03-e02d



NOTE: You can support our site and receive an “ad free” copy of this article for just 99¢ HERE, or become a “Premium Supporter” for as little as $3 a month and receive $5 worth of articles and $5 worth of code downloads free each month!

Step 5) However in this example we aren't going to use a file but instead chose an image from the “Symbol Factory” library by first clicking on the “Launch Library” button, and then selecting an image in the library, and then clicking on the “Copy” button:

the-automation-minute-s03-e02e

 Step 6) Next, click on “Paste from Library,” then “OK” to accept the image's name,then click on “OK” to close the Image Browser, and finally click on “Apply” to preview the image on the button:

the-automation-minute-s03-e02g

Step 7) Above you can see the button will need to be resize in order for the entire image to be visible. Alternatively, you can check the “Image Scaled” checkbox shown below to scale the image to fit the button's current size:

the-automation-minute-s03-e02h

 Step 8) Once done with your first state, select the next state that will have an image and then add an image to it by repeating Steps 3 – 7. When you're done adding images to your button's states, click on “OK” to close the button object's properties, and then save your graphic display.


Watch me demonstrate the above procedure live in Episode 2 of The Automation Minute Season 3:

tam-s3-e2-fi


Have a question or comment? Please feel free to leave them with us by clicking on the “post a comment or question” link at the very bottom of this page.

Sincerely,

Shawn Tierney
Automation Instructor and Blogger

If you enjoyed my article, you may like my courses at TheAutomationSchool.com
Eliminate Ads and get Free Downloads by becoming a Patron here
Have a news tip? Share it with us here

Shawn Tierney

Shawn began sharing automation news and know-how online in 1996 when he launched his first BBS. Then in 1999 he moved to the internet launching ShawnMichael.com, which he later renamed ShawnMTierney.com. In 2013 he moved his automation efforts to a new website, TheAutomationBlog.com, which has since become the most popular independent industrial automation blog on the web.
Avatar


Click HERE to scroll down to view or leave comments