BBjControl::getStyle

Description

In BBj 18.00 and higher, this method returns the value of a CSS property explicitly set on the BBjControl.

Syntax

Return Value Method

string

getStyle(string property)

Parameters

Parameter Description
property Specifies the CSS property to be queried on the control.

Return Value

Returns the value of the specified CSS property that's explicitly set on this control. To return the resolved value in effect on the control, use BBjControl::getComputedStyle.

Remarks

CSS settings have no effect on the GUI client.

For more details, see CSS API.

Example

rem ' CSS sampler

sysgui = unt
open (sysgui)"X0"
sysgui! = bbjapi().getSysGui()
window! = sysgui!.addWindow(50,50,325,500,"CSS Sampler",$00090003$)
window!.setCallback(window!.ON_CLOSE,"eoj")
text$ = "The quick brown fox jumps over the lazy dog."
edit! = window!.addEditBox(100,25,25,275,50,text$,$$)
border! = window!.addCheckBox(101,25,100,275,25,"borderStyle",$$)
border!.setCallback(border!.ON_CHECK_ON,"addStyle")
border!.setCallback(border!.ON_CHECK_OFF,"removeStyle")
shadow! = window!.addCheckBox(102,25,125,275,25,"shadowStyle",$$)
shadow!.setCallback(shadow!.ON_CHECK_ON,"addStyle")
shadow!.setCallback(shadow!.ON_CHECK_OFF,"removeStyle")
background! = window!.addCheckBox(103,25,150,275,25,"backgroundStyle",$$)
background!.setCallback(background!.ON_CHECK_ON,"addStyle")
background!.setCallback(background!.ON_CHECK_OFF,"removeStyle")
another! = window!.addCheckBox(104,25,175,275,25,"anotherStyle",$$)
another!.setCallback(another!.ON_CHECK_ON,"addStyle")
another!.setCallback(another!.ON_CHECK_OFF,"removeStyle")
important! = window!.addCheckBox(105,25,200,275,25,"importantStyle",$$)
important!.setCallback(important!.ON_CHECK_ON,"addStyle")
important!.setCallback(important!.ON_CHECK_OFF,"removeStyle")
windowStyle! = window!.addCheckBox(106,25,225,275,25,"windowStyle",$$)
windowStyle!.setCallback(windowStyle!.ON_CHECK_ON,"addWindowStyle")
windowStyle!.setCallback(windowStyle!.ON_CHECK_OFF,"removeWindowStyle")
titlebarStyle! = window!.addCheckBox(107,25,250,275,25,"titleStyle",$$)
titlebarStyle!.setCallback(titlebarStyle!.ON_CHECK_ON,"addTitleBarStyle")
titlebarStyle!.setCallback(titlebarStyle!.ON_CHECK_OFF,"removeTitleBarStyle")
getStyles! = window!.addButton(1,25,300,125,25,"getStyles",$$)
getStyles!.setCallback(getStyles!.ON_BUTTON_PUSH,"getStyles")
clearStyles! = window!.addButton(2,175,300,125,25,"clearStyles",$$)
clearStyles!.setCallback(clearStyles!.ON_BUTTON_PUSH,"clearStyles")
window!.addStaticText(108,5,355,50,25,"Style:",$8000$)
style! = window!.addEditBox(109,60,350,240,25,"",$$)
window!.addStaticText(110,5,405,50,25,"Value:",$8000$)
value! = window!.addEditBox(111,60,400,240,25,"",$$)
getStyle! = window!.addButton(3,5,450,80,25,"Get Style",$$)
getStyle!.setCallback(getStyle!.ON_BUTTON_PUSH,"getStyle")
getComputedStyle! = window!.addButton(4,90,450,145,25,"Get Computed Style",$$)
getComputedStyle!.setCallback(getComputedStyle!.ON_BUTTON_PUSH,"getComputedStyle")
setStyle! = window!.addButton(5,240,450,80,25,"Set Style",$$)
setStyle!.setCallback(setStyle!.ON_BUTTON_PUSH,"setStyle")
process_events

eoj:
release

getStyles:
    i = msgbox(edit!.getStyles().toString(),0,"getStyles")
return

clearStyles:
    border!.setSelected(0)
    shadow!.setSelected(0)
    background!.setSelected(0)
    another!.setSelected(0)
    important!.setSelected(0)
    windowStyle!.setSelected(0)
    titlebarStyle!.setSelected(0)
    edit!.clearStyles()
    window!.clearStyles()
    window!.clearTitleBarStyles()
return

addStyle:
    event! = sysgui!.getLastEvent()
    control! = event!.getControl()
    style$ = control!.getText()
    edit!.addStyle(style$)
    print edit!.getStyles()
return

removeStyle:
    event! = sysgui!.getLastEvent()
    control! = event!.getControl()
    style$ = control!.getText()
    edit!.removeStyle(style$)
    print edit!.getStyles()
return

addWindowStyle:
    event! = sysgui!.getLastEvent()
    control! = event!.getControl()
    style$ = control!.getText()
    window!.addStyle(style$)
    print window!.getStyles()
return

removeWindowStyle:
    event! = sysgui!.getLastEvent()
    control! = event!.getControl()
    style$ = control!.getText()
    window!.removeStyle(style$)
    print window!.getStyles()
return

addTitleBarStyle:
    event! = sysgui!.getLastEvent()
    control! = event!.getControl()
    style$ = control!.getText()
    window!.addTitleBarStyle(style$)
    print window!.getTitleBarStyles()
return

removeTitleBarStyle:
    event! = sysgui!.getLastEvent()
    control! = event!.getControl()
    style$ = control!.getText()
    window!.removeTitleBarStyle(style$)
    print window!.getTitleBarStyles()
return

getStyle:
    value!.setText(edit!.getStyle(style!.getText()))
return

getComputedStyle:
    value!.setText(edit!.getComputedStyle(style!.getText()))
return

setStyle:
    edit!.setStyle(style!.getText(),value!.getText())
return

CSS Example

.backgroundStyle,.windowStyle
{
    background: rgb(242,245,246);
    background: -moz-linear-gradient(top,  rgba(242,245,246,1) 0%, rgba(227,234,237,1) 37%, rgba(200,215,220,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,245,246,1)), color-stop(37%,rgba(227,234,237,1)), color-stop(100%,rgba(200,215,220,1)));
    background: -webkit-linear-gradient(top,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
    background: -o-linear-gradient(top,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
    background: -ms-linear-gradient(top,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
    background: linear-gradient(to bottom,  rgba(242,245,246,1) 0%,rgba(227,234,237,1) 37%,rgba(200,215,220,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 );
}
.borderStyle
{
    border-radius: 15px;
    border-width: 2px;
}
.shadowStyle
{
    box-shadow: 7px 7px 5px rgba(50, 50, 50, 0.5);
}
.anotherStyle
{
    font-size:25px;
    color: #FFF;
    background: #000;
    text-align:center;
    opacity:0.6;
}
.importantStyle
{
    font-size:25px !important;
    color: #FFF;
    background: #000;
    text-align:center;
    opacity:0.6;
}
.Caption.BBjTopLevelWindow-titleBar.titleStyle
{
    background: #8195a9;
    background: -moz-linear-gradient(top, #889db3, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #889db3), color-stop(49%, #8195a9), color-stop(50%, #7a8da0), color-stop(98%, #738596), color-stop(100%, #8195a9));
    background: -webkit-linear-gradient(top, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: -o-linear-gradient(top, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: -ms-linear-gradient(top, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    background: linear-gradient(to bottom, #889db3 0%, #8195a9 49%, #7a8da0 50%, #738596 98%, #8195a9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@colorNew1', endColorstr='@colorNew5', GradientType=0);
    color: #f8fafc;
    text-shadow: 0 1px 4px #404040;
}

See Also

BBjAPI

BBjSysGui

BBjWindow

CSS API

See the BBj Object Diagram for an illustration of the relationship between BBj Objects.