Differences between revisions 5 and 10 (spanning 5 versions)
Revision 5 as of 2016-01-11 05:01:47
Size: 2553
Editor: clifford
Comment:
Revision 10 as of 2016-01-11 05:12:16
Size: 2996
Editor: clifford
Comment:
Deletions are marked like this. Additions are marked like this.
Line 4: Line 4:
=== a, basic format directive following by declearations. === === a, basic format directive following by declearations, directive is the ClassName of the widgets. ===
Line 6: Line 6:
/* CCLabel is the directive ,the text in the {} pair are the declearation*/ /* CCLabel is the directive also the ClassName ,the text in the {} pair are the declearation*/
Line 75: Line 75:
= Examples = === f, when selecting only widgets belong to an other widget can use ">"

{{{
/*only affect QPushButton which is a child of CCTouchScreen*/
CCTouchScreen > QPushButton {
    border-style: inset;
    }
}}}
= Examples of currently implemented directives =
Line 81: Line 89:
{{attachment:qsssieat_labeled.png}} {{attachment:qsssieat2_labeled.png}} {{attachment:qsssieat3_labeled.png}} {{attachment:qsssieat4_labeled.png}} {{attachment:qsssieat_labeled.png}} {{attachment:qsssieat2_labeled.png}} {{attachment:qsssieat3_labeled.png}} {{attachment:qsssieat4_labeled.png}} {{attachment:menu_labeled.png}}
Line 85: Line 93:

= Advanced =
for more detail can run "assistant" on sam and search "stylesheet" for full doco.

QSS on control explained

1, Basic concept introduction

a, basic format directive following by declearations, directive is the ClassName of the widgets.

/* CCLabel is the directive also the ClassName ,the text in the {} pair are the declearation*/
CCLabel {
    font-size: 16pt;
    }

b, more than one directives can be jointed for a declearation

/*CCListView, QListView, QComboBox, QPushButton, QMessageBox all have 16 pt font-size*/
CCListView, QListView, QComboBox, QPushButton,QMessageBox {
    font-size: 16pt;
    }

c, for some widget they have state can use ":" to indicate state.

/*enabled, pressed and disabled CCDDPushButton will look different*/
CCDDPushButton::enabled {
    border-style: outset;
    border-width: 3px;
    border-radius: 10px;
    border-color: #948E8C;
    background: qlineargradient(
       x1:0, y1:0, x2:0, y2:1,
       stop:0 #ffe0cd,
       stop: 0.4 #ffb587,
       stop: 0.5 #ff904b,
       stop:1 #ff6200
       );
    }

CCDDPushButton:pressed {
    border-style: inset;
    }

CCDDPushButton:disabled {
    border-style: inset;
    border-width: 3px;
    border-radius: 10px;
    border-color: #949494;
    }

d, can also select a widget by one of its attribute using "[" and "]".

/*only CCBox with attribute CCColour equal "q" will affected by this declearation*/
CCBox[CCColour="g"] {
    border-style: inset;
    background-color: #DCEDE4;
    }

e, when a property of a widget was not found in a more specific directive, the lest specific directive will be used.

/*all CCDDPushButton will have font-size 11pt*/
CCDDPushButton {
    font-size: 11pt;
    }
/*only the enabled CCDDPushButton will have the back stylish border and background*/
CCDDPushButton::enabled {
    border-style: outset;
    border-width: 3px;
    border-radius: 10px;
    border-color: #948E8C;
    background: qlineargradient(
       x1:0, y1:0, x2:0, y2:1,
       stop:0 #ffe0cd,
       stop: 0.4 #ffb587,
       stop: 0.5 #ff904b,
       stop:1 #ff6200
       );
    }

=== f, when selecting only widgets belong to an other widget can use ">"

/*only affect QPushButton which is a child of CCTouchScreen*/
CCTouchScreen > QPushButton {
    border-style: inset;
    }

Examples of currently implemented directives

All the Red Text indicate the Directive with link to their Widget.

1, ccmenubar, ccexplore -- the menu programs.

ccmenubar_labeled.png

2, starndard control programs

qsssieat_labeled.png qsssieat2_labeled.png qsssieat3_labeled.png qsssieat4_labeled.png [ATTACH]

3, guiaad programs

qssstaad_labeled.png qssstaad2_labeled.png

Advanced

for more detail can run "assistant" on sam and search "stylesheet" for full doco.

CONTROL/Software/Development/QSS (last edited 2017-04-13 07:44:18 by thog)