Button.Image Property (ExButton)

Use the Image property to assign a picture to your button. Use the Images property to add icons to the control. If you have multiple icons added to the Images collection you can use long expression to change the index of icon being displayed. The ImageSize property defines the size (width/height) of the icons within the control's Images collection. Use the ImageAlignment property to align the image in the button. Use the ImageVAlignment property to align vertically the image in the button. Use the Caption property to assign a caption to the button. Use the Style or Skin property to change the visual appearance for your button. Use the <img> HTML tag to insert icons inside the button's caption.

The following sample loads the picture from a file:

With Button1
    .Image = "D:\temp\icons\settings.gif"
End With

The following sample assigns the first icon from an ImageList control:

With Button1
    .Images ImageList1.hImageList
    .Image = 1
End With

The following sample assigns a Picture objects:

With Button1
    .Image = Picture1.Picture
End With

The following sample loads the picture from an BASE64 encoded string ( Use the eximages tool to save your picture as base64 encoded format )

With Button1
    Dim s As String
    s = "gBHJJGHA5MIwAEIe4AAAFhwbiAliQwig7ixFjBQjRbjhljxwkB7kSFkiQkyblCllSwli7lzFmDQmTbmjlmzwnD7nQBnk9n0/oFBoVDolFo1HpFJpVLplNp1PqFRqVTqlVq1XrFZrVbrldr1YhgAEL5AgBhj/AAssMJthABFof4JDhIWCgYKDBATFT8M6hUIFAQAEQCCDwYF/QoWDZCRBgOKgIYHCQXMisKBAEQAAgOBZaSgQhjERANKQiZhIWamYyIBQ6FzcNKxQLJT4ADA4RjwObAAidBYdHwABQgUxMQYZEI0cD4OgnYKaKyzIRFNQx2YCKoFHScYD0ADXQwUAgwLoLQDqaCWBJoNQ9NBxFJTVQORgiarqSABbamGwtDAwBUWhQmqYALnOFQvGYPA4m6AwKhkZxKj2PBWC0SZCgmVY6CwIJgieBAniubRKHgaYgiwQwGiCfxGDWbBRmGZYIi2VwGnAexxGUSwUFiaR+hQPbBgOCoLCIHh4DAARCmQG4AlgNxuhwWgpFAEQUhuOxOk0NrhAaQoBmgPYdFSIZPjYGYbn+HhgEoAA7HMBIOjUM51AoPojHkEwVlET5slgWZtAEUBdjeSoeF6X5/rQRRSi+QB6GychsEAfZshKYABGQZorlAOgMBqEgAjYHB2jqSoigmYBLk+QZnBqGhggAEwImgbojgoIwSE+MxUHiS4REQCQWluD48B+JJoL+YQikuaI9AALgLmsJQfnSdAvDkCJEhIIIBgOegLEiPBqCyCA"
    s = s + "AjcCwgAAIJBhQBQkHGL4gDaNBokkZQMiwUAuioJQiCAQYsHMcwwEIeoigAYIogsGIwFKIYICIWguEoPgQhsawBASGgwCuJwLH8K4LigAIaDwbxMAOKxbisPwfASQATFASoagIEYwgcSoKGiAA/mEdIuiGPxCmObIlhMIJNHONxFH8EpPCGeB+noEpBBSSRjCsPZEiyKhgjAH5whSdLEjwDxjC8TxVEMFRzFWJJZBUSI0gQEQLBOM4VHkIg1D0CAJDQNg/p4AAdoC"
    
    .Image = s
End With

The following sample displays the first icon in the Images collection:

With Button1
    .Images "gBJJgBAICAAGAAEAAQhYAf8Pf4hh0QihCJo2AEZjQAjEZFEaIEaEEaAIAkcbk0olUrlktl0vmExmUzmk1m03nE5nU7nk9n0/oFBoVDolFo1HpFJpVLplNp1PqFRqVTqlVq1XrFZrVbrldr1fsFhsVjslls1ntFptVrtltt1vuFxuVzul1u13vF5vV7vl9v1/wGBwWDwDAwwAwzAssQACAx2EuuJxGHyWSqmMyWYymHxyAyFoyubxWhxWMxlMzMPib/yej0WtxuPz9ey0a0mw02q3Osoma0uqy2ejPC2+zrO1jPI2Gp1md1fP3c95nP4PJw+N62K41Y50b5XT6PO53RnHT82cx/V2HbqeS7u29Ge6fj3X11nKnG+6HA1/Y4bsti4T2Ka273wA6LGPEx7yJ3BD7P2+7XuLAaqNu+aNQdCLtJ++bHwUzz6NY/T8Qoq8Mv9FEGJ890Fwe8MPRbDUSrJE8SKFEMIQDHMcRmtUVKTH7ownHsiSLI0jyKiwfJXJaPJAkSSAAkqUSm/LVSQmiKI2eZ/n43iMnAf54B+jZwB+cAHu8B5wAO7wBzYjZAADOCNTkYE2o2AZgAGlE9T5OoDz3MtAz+jJ8TXQoAH8B54USf5PnzNMMNOjKAg="
    .Image = 1
End With

All of the properties and methods for all objects in the Exontrol's exButton can be assigned at design time using the WYSWYG Template /Layout editor. Open the control in design mode, and select Properties from its context menu. The Template language uses the x-script language ( very simple ), that can be used to initializes the properties and methods at design time.

The following sample initializes the control's image and caption at design mode, using the Template page:

' Specifies the control's caption
Caption = "Exontrol's exButton component is our answer to your GUI needs"
WordWrap = True

' https://www.exontrol.com/sg.jsp?content=support/faq#eximages
Image = "gBHJJGHA5MIwAEIe4AAAFhwbiAliQwig7ixFjBQjRbjhljxwkB7kSFkiQkyblCllSwli7lzFmDQmTbmjlmzwnD7nQBnk9n0/oFBoVDolFo1HpFJpVLplNp1PqFRqVTqlVq1XrFZrVbrldr1YhgAEL5AgBhj/AAssMJthABFof4JDhIWCgYKDBATFT8M6hUIFAQAEQCCDwYF/QoWDZCRBgOKgIYHCQXMisKBAEQAAgOBZaSgQhjERANKQiZhIWamYyIBQ6FzcNKxQLJT4ADA4RjwObAAidBYdHwABQgUxMQYZEI0cD4OgnYKaKyzIRFNQx2YCKoFHScYD0ADXQwUAgwLoLQDqaCWBJoNQ9NBxFJTVQORgiarqSABbamGwtDAwBUWhQmqYALnOFQvGYPA4m6AwKhkZxKj2PBWC0SZCgmVY6CwIJgieBAniubRKHgaYgiwQwGiCfxGDWbBRmGZYIi2VwGnAexxGUSwUFiaR+hQPbBgOCoLCIHh4DAARCmQG4AlgNxuhwWgpFAEQUhuOxOk0NrhAaQoBmgPYdFSIZPjYGYbn+HhgEoAA7HMBIOjUM51AoPojHkEwVlET5slgWZtAEUBdjeSoeF6X5/rQRRSi+QB6GychsEAfZshKYABGQZorlAOgMBqEgAjYHB2jqSoigmYBLk+QZnBqGhggAEwImgbojgoIwSE+MxUHiS4REQCQWluD48B+JJoL+YQikuaI9AALgLmsJQfnSdAvDkCJEhIIIBgOegLEiPBqCyCAAjcCwgAAIJBhQBQkHGL4gDaNBokkZQMiwUAuioJQiCAQYsHMcwwEIeoigAYIogsGIwFKIYICIWguEoPgQhsawBASGgwCuJwLH8K4LigAIaDwbxMAOKxbisPwfASQATFASoagIEYwgcSoKGiAA/mEdIuiGPxCmObIlhMIJNHONxFH8EpPCGeB+noEpBBSSRjCsPZEiyKhgjAH5whSdLEjwDxjC8TxVEMFRzFWJJZBUSI0gQEQLBOM4VHkIg1D0CAJDQNg/p4AAdoC"

The button's visual appearance in this case will be:

		Type	Description
		Variant	A long expression that indicates the index of icon being displayed, a string expression that specifies the path to a picture file, a Picture object being displayed, a string expression that indicates the BASE64 encoded string that holds a picture/image object. Use the eximages tool to save your picture as base64 encoded format., or a IPictureDisp object that holds the picture being displayed on the button.