Member variable XbpPushButton():visualStyle Foundation

Specifies the visual style to use for display.

Attribute: EXPORTED
Data type: Object (NIL)

The default representation used for creating the visual representation of an XbpPushButton object can be overridden using the :visualStyle instance variable. To do this, an instance of the XbpHTMLStyle() class must be assigned to :visualStyle, which is then used to draw the object.

HTML style objects use HTML markup and optional CSS style sheets to create the visual representation of a push button object. For this, the corresponding HTML markup must be specified as the caption of the button. In addition, if a CSS style sheet is to be used, the CSS must be supplied when instantiating the XbpHTMLStyle object.

The following code snippet shows the basic steps required for using a custom visual style with an XbpPushButton object.

// Define the representation of 
// the button via CSS. Note that 
// dedicated styling is defined 
// for the item's selected" 
// state. 
  div { 
     height: 100%; 
     border: 1px goldenrod solid; 
  #gradient-color { 
     background-color:navajowhite gold khaki lemonchiffon; 
  #gradient-color:hover { 
  #gradient-color:active { 
     background-color:navajowhite gold khaki lemonchiffon; 
     border: 2px red solid; 

// Create the HTML style object 
// and assign the styling defined 
// via CSS. 
oStyle := XbpHTMLStyle():New( cCSS ) 

// Create the push button object 
// and assign the HTML style 
oBtn:= XbpPushButton():New( oParent ) 
oBtn:VisualStyle := oStyle 
oBtn:Caption := '<div id="gradient-color">Button 2</div>' 
oBtn:Create( ,, {220,20}, {150,50} ) 


If you see anything in the documentation that is not correct, does not match your experience with the particular feature or requires further clarification, please use this form to report a documentation issue.