AD: Upgrade ArcaOS to NeoWPS level Install original PNG icons drawed by designer, specialized at OS/2 adornation. Install eSchemes 2019 to change colors and buttons on desktop.

TITLE: Perfect eComStation -- Skinning

DATE: 2008-04-11 17:35:45

AUTHOR: Eugene Evstigneev

Eugene Evstigneev .......... ............. ........... ........ ... ........ ..... eComStation.

1. .......

• [A1] .... ........ ..... ...... .... . ....... XML;
• [A2] .... ...... ......... ...... ............. .....; ... ................ ...... ............... ...... ...... ....;
• [A3] ... ........... ............ ........ ...... ......... ....... . .......... (. ...... .......... .. SOM) . ....... ...... ............. ...... ... ..... .......... ...........;
• [A4] ........ ........... .......... ... ............. . ......... .. ...... .... ........... .........;
• [A5] ........ ...... .... ............. .. ...... ........... ...... .... . ..... ... ............. ... .. ..... .......... ........, ... . . .................;
• [A6] ........ ...... ............... ........... ........... ..... ... ... ...... ......., ... . ... ........ ....... ....;
• [A7] ........ ............. .......... ... ..... .. ...... .... ............., . ...... ............ ...... ...... ........;
• [A8] ...... .... ........... ........... ...... ......... ........... ... ...... ......... ...... . .... .. ........;
• [A9] ..... ........ ........... .. ...... ........ ........... .. .......... ....... ..... ....... .. ......... . ........... ..........;
• [A10] . ........ ..... .. ...... ........... ...... . ...... ........., ................ .. ...... .........;
• [A11] .... ...... ......... ........... ................. .... . .......... ..... . ... ........... ....... . ......... ..........

2. ............. ......... . API - ........... ..........

........... .......... - ... .........., ............ . ......... ............. ..... ........... ..........:

• ........... .......... ..... ........... ......... . ........... . ........;
• ........... .......... ..... .... ............, ... ............ .............. .. ............. .... .. ......... . ........;
• . ........... .......... ......... ........, ............ ...... ...........

...... . ............ ........... ...... .... ........... ... ....... ........... ......., .. ........... . ........., .. ........... ... ......

... .......... ......... . ........... .......... ...... ......... ..... ......, ... ......... .... (....../.. ...... ... ......; ......./.. ....... ... ......; ...... .. ........./.. ... ......... . ....) ... [A8], ... . ... .......... ......... (....., .... . ....). ........... .......... ...... ............. ........ presparams. ... .................. ....... ........... drag-n-drop ...... . ....... .. ........ ([A9]) .......... .............. 3 ........... .......... ... ........ ......, ..... .... . ..... ......... ...... ....... .... .... ................ .......... ...... ............. . ............... ......... ....... ... .............. ...... . ....... .. ....... .......... (....), ...... ... .. ...... ...... ............... ......... .... ....... ....., .... . .... ......... ..............

.......... ...... .... ........ ... ............. . ........ ......

... ........ .......... . .............. ......... .... ...... .... ............. API ... ...... . ...... ........... .........., ........... ........ ... ........ ...... .... .... .......... ......... ........., ............ ..... ........./....... .... .... . ........... .. ........ .......... ..... ........, . ..... . .. ........ .......... .... ........ .....

3. ............. ......... . API - XML-......

...... ...... .... .......... . ............ . ............. XML 1.0 W3C. ...... ...... ............ ........ ...... . ....... ........ ....... ... ... ........... ......... ... ........... [A3].

............... ......... ...... .............. .. ........... ...... ... ............... ........ . ...........

4. ........... .........

........... ........ - ... ....... ....... ............ . ..... ......... - ... ........., ....... .. ...... ....... .......... ............ ......... ..... . ........ presentation space. . .......... ......... ...... .... .......... ......... "Paint", .............. ............... ......... . presentation space, ......... .. ....... ...... ............ . ........ ........ .......... . .......... ...... ..... .............. ......... ........ ............... .......... ... ........ ....... ......... ....... ...... ([A3]). ..... ....... .......... ...... ..............:

• x-.......... ....... .........;
• y-.......... ....... .........;
• ...... ....... .........;
• ...... ....... .........;
• ...... .. ...... .... ....... ......... (padding-left) (... [A10]);
• ...... .. ....... .... ....... ......... (padding-right) (... [A10]);
• ...... .. ....... .... ....... ......... (padding-bottom) (... [A10]);
• ...... .. ........ .... ....... ......... (padding-top) (... [A10]);
• ............ .. ...........;
• ............ .. .........;
• ...... .. .....;
• ...... .. ...........;
• .... ....;
• .... ......... .....;
• .............. ....;
• .....;
• .............. ........ (................, ULONG).

........ ........... ................. .......... ...... .......... ([A4]), .. ....... .......... ...... .............. ......... .. ...... ........, .......... .... "..."-"........" ... .... ...... .........., .. ........ . ..... ................, .. ......., ........, ............ . ........ ......

..... "Paint" ...... .............. ......... "ConfigDlg", ....... .......... ...... ... .......... ......... ........., ........... . ...... .......... ............ ......... .....

..... .......... ............ .......... ...... ..............:

• solid color;
• gradient;
• image;
• growable image;
• toned image;
• toned growable image;
• icon;
• text.

5. ........ .....

5.1. .......... .............

. .......... ......... .... ........ ...... .... . ....... XML ([A1]) . ............... ........... well-formed ......... . .. .... ......... .......... ("Standalone Document Declaration"), .... .......... ......... ...... .... ....:

  <?xml version="1.0" standalone="no"?>

5.2. .......... .............

5.2.1 ............

........ ......... ....... ........ ............ ................... ....., ........... ........... .......... ...... ........ ...... .... .......... ....:

 <primitive name="..">
    <parameter name=".." value=".." />
    ...
 </primitive>

..........:

 <primitive name="text">
    <parameter name="x" value="0" />
    <parameter name="y" value="0" />
    <parameter name="w" value="&cxv_w;" />
    <parameter name="h" value="&cxv_h;" />
    <parameter name="text" value="&cxv_text;" />
    <parameter name="color" value="&cxv_foregroundcolor;" />
    <parameter name="font" value="&cxv_font;" />
    <parameter name="x_shadow" value="1" />
    <parameter name="h_align" value="1" />
 </primitive>

..... ... "primitive" .......... ..... . ......... "paint" ........., ... ........ ............ ............ ......... "name". ......... ........ "parameter" .......... ..... ........, ............ . ........ ....... .........., ... ....... "name" .......... ... ........., . "value" - ......... . ............ . ..4, ................ ......... ...... ............ ............... . ...... .........., . ... ...... . .... ....... ......... ........ .......... ..... .... ...... . .... ........, ... . . .... ...... .. ........... .........., ............ . ............ . ........ ........ ......... ("entity") ............ XML.

...... ........ ....... ............. . .......... CCI, ......... ............ .......... ......... ........... . ... .............. . ........ .......... ............ ......... ......

5.2.2. .............

.............. ..... ........ .......... . ........... ...... .... ...... ............ ..... ........ ...... "class" . ............ ......... "name", ............ ..... .... ([A5]).

......:

 <class name="pushbutton">
    <primitive>...</primitive>
    ...
 </class>

..... ........... ....... ............ ... ...... ......., .......... ........... ........ ........... ... ........... ...., ............ ... ............... ([A6]). . ...... .......... ......... .. ............ ...... PM, ............... ..... .... ......, ............ .......... ...., . . SOM ... ..... .... ... ........ ...... ........ ... ........... .... ...... .... ......... .......:

 <window name="closebutton">
    <primitive>...</primitive>
    ...
 </window>

..... ....... "name" .... "window" .......... ............. ................ .....

....... ..... <class> . <window> ..... ......... ............... ... ...... ........, ..... ... ................ .... ....... ... ........ <window>, ... . <class>. . .... ...... ......... ...... ..... ........, ............ . .... <window>.

. ........ ..... .... ........ ..... ...... ......... .................. ..... <class> . <window>.

5.2.3. ........ ......

...... ..... ...... ......... ........ ............ ... ......... ......... ...... . .... .. ........ ([A8]). ..... ......... ...... ............ ............ ..........., ........ ....... ...... .............. . .......... ......... .. ..... .......

................ (...... ....... .. ........ .............), ... ........ ......... .....-.... ........... .......... ..... .... ............ ........... .... .......... ....:

 <if-eq name="" value="">
    ...
 </if-eq>

..... ....... "name" ........ ... (........) ........... .........., "value" - ......... ... .... .......... ............ ........ (. ...... ...... - .........).

.......... ........ (....) ..... ............ ... ... .......... .......... (...... ....../......), ... . .......... ............ (...... [..] ... ....., hover). ......... ........ ..... . ......... ........ ..... ......... ......... .......:

 <class name="pushbutton">
 <!-- ...... ...... -->
    <if-eq name="&pushed;" value="1">
       <primitive>..</primitive>
       ...
    </if-eq>
 <!-- ...... ...... -->
    <if-eq name="&pushed;" value="0">
 <!-- ...... ... ....... -->
       <if-eq name="&hover;" value="1">
          <primitive>..</primitive>
          ...
       </if-eq>
 <!-- ...... .. ... ....... -->
       <if-eq name="&hover;" value="0">
          <primitive>..</primitive>
          ...
       </if-eq>
    </if-eq>
 </class>

........ ........ - ........ ............. . ........... ........ . ........... .. ..... ......... ........... .........., ............ . ........ ........ ........, ... .... ........ .......... ..... .............. . ........ ......., ........... .... ... ......... ........ ..... ........... .......... ..... ........ . ............ ....... ...................

6. ........

........ ........... ................ ............. ...... .... ... .......... ... ................, ... ..... ................. .... . ..... .. ..... ........... ........ ........, ................ ...... ..... ...... (..... ......., ..... ... .................. .... ............. ......... . ....). . .... ...... ...... .......... ........, ............... ............ ...... . ........ ............. ........, ... ........ .......:

  Window
     Pushbutton
        MyPushbutton
        

........ ............ ....... ...... ... ...... "Pushbutton". ... ............ .... ...... "MyPushbutton" ...... .............. ........ ...... "Pushbutton", ... ........ ........ .. ........, ....... .........

7. ......... ........ ..........

...... ........ .......... ... ...... .............. .... ..... ......... ........ ........, ....... ..-....... ............... . ......... .. ........ ............. . ..... ......... ......... ...... ........., ...., ......, .......... . .... ... ....... ...... ..... ........ ... ........ ...... ............ ........ ......... ........ ........ . ........... ........... .... ....... - . ............ ...... ........ ....... ......... ... .......... ...... ...., ........ ....... ...... .............. . ......

.. ....... ...... ........., ... ........ .... ......... ......... (...... ....., ...... ...., ......) ..... ........ 4 ........... .......... - ...... ......, .......... ....... ......, .......... ......, ...... ....... ..... ......., ........ ............ ... ...... ........ ..... .. ......... .... .......:

 <!-- .... ...... -->
 <primitive name="solidcolor">
    <parameter name="x" value="0" />
    <parameter name="y" value="0" />
    <parameter name="w" value="&cxv_w;" />
    <parameter name="h" value="&cxv_h;" />
 </primitive>
 <!-- ...... .... -->
 <primitive name="solidcolor">
    <parameter name="x" value="0" />
    <parameter name="y" value="0" />
    <parameter name="w" value="&cxv_w;" />
 <!-- cxv_buttonh - .........., .......... ...... ...... -->
    <parameter name="h" value="&cxv_buttonh;" />
 </primitive>
 <!-- ...... ..... -->
 <primitive name="solidcolor">
    <parameter name="x" value="0" />
 <!-- cvx_buttony - .........., .......... y-.......... ...... "....." -->
    <parameter name="y" value="&cxv_buttony;" />
    <parameter name="w" value="&cxv_w;" />
 <!-- cvx_buttonh - .........., .......... ...... ...... -->
    <parameter name="h" value="&cxv_buttonh;" />
 </primitive>
 <!-- ...... -->
 <primitive name="solidcolor">
    <parameter name="x" value="0" />
 <!-- cvx_slidery - .........., .......... y-.......... ...... -->
    <parameter name="y" value="&cxv_slidery;" />
    <parameter name="w" value="&cxv_w;" />
 <!-- cvx_sliderh - .........., .......... ...... ...... -->
    <parameter name="h" value="&cxv_sliderh;" />
 </primitive>

.......... ...... - ... ............. ... ............ ........., ... .......... ........ ........ ..........., ........ .....

......... ...... ........ ....... . ......... .... .. ..... ....... ...... ... ..........., .. ....... ........ ....... ...., . ........ ....... ............ ...... ..... ........ .......... ..... ......... .......... ... ....... ....... ......... ........ - ........ .... ... ........ ........ ...... ... ................ ........... ........ .. ......, . .. ........ ... ... ........ ... ........ ...... - ........... ..... ....... ... ........ . ........ .... (........, ....).

.............. ....... ............ ....... . ..... ........ ............ ... ...... ........ ....... ... ... .......... ...... ...., .. ... ........... .......... ......... ... .... ......... .......... ........ ..... ........ .. .................. ....... . ......... ............ ... ...... ........ ....... . ............... .......... ........... .......... . ...... ........ . ............ . ........ ........ ......... ....... ............ .......... ...... ...., .............. . ......., .. .............. . ........ ...... .......... ....... - ... ...............

8. .....

.. ...... ...... . ....... ....... ........, ....... ............... ........ ......., . ....... ......... ....... ("WC_SPINBUTTON"). ... .. ............ ............ ... .......... ..... ...... ... .......... ..... ............... ........, ... ........ . ........ ..... ........., ............ ........ ......

9. ............. .........

............ ..... ............ ....... ............. . ............. ...... ............. ........... ..... ....., ...... . ...... ......... ..... .......... ... . .... ........, ... . . .... ...... .. ........... ........... ........, ... ...., . ....... ... .......... ......... ...... . .... ........, ..... ..... ........, ......... . ......... ..... . .. .. ....., ..... .. ...... ...... ... ......... . .... .........., ....... ..... ........... ... . .......... ........... ............, ... . . ........ .......... . ........ ........ ........ .......... ..... .......... . ..... .......... .. ....... ......., . ........ ..... .......... ............. .... (........, ......... ......), .......... ........ ......... . ..... .........., ......... ... ............. . ......... ..... ........ ...... .... ............. .. ............ ...... ... .............. ...., . ......... ... ........., .......... ... ............ ......... . ......... ..... ......... ...... .........:

• ............... ........ .......... (........, .. ...... ......);
• ... .......... (...., ........, ....., ....., ......., ...... . ....);
• ........ .. ..........

...... ............. ........ ..........:

 <!-- parameters.xml -->
 <sch:class name="pushbutton">
    <sch:name xml:lang="en">Push button</sch:name>
    <sch:name xml:lang="ru">......</sch:name>
    <sch:parameter value="cxv_backgroundcolor">
       <sch:name xml:lang="en">Button color</sch:name>
       <sch:name xml:lang="ru">.... ......</sch:name>
       <sch:type value="color" />
       <sch:value value="#808080" />
    </sch:parameter>
    <sch:parameter value="cxv_foregroundcolor">
       <sch:name xml:lang="en">Text color</sch:name>
       <sch:name xml:lang="ru">.... ......</sch:name>
       <sch:type value="color" />
       <sch:value value="#0" />
    </sch:parameter>
    ...
 </sch:class>

..... ........ .......... (........ ........ "value" .... "parameter") ...... .......... _.._ . ....... ........ (entity). ......... ..... ....... .......... ..... .... ........... ...... ... ......, ...... ........ ........ ... .... ........... ... ........ .........., ............ . ...... "<window>" ........ ..... ............ ............ ... "<sch:window>" ...... "<sch:class>". ............ ..... ....... .......... .. ..... .... ........ .......... SYSCLRs, ......... . ....... ...... PM. ... ........ .......... ... ......... ...... ... .... ............ ............ ... "<sch:section>" . ........ ........, ........... ............ ..... ....... ....... .........., ......... . ...... "<sch:section>" .. ..., ....... ....... . "<sch:window>" . "<sch:class>" . ..., ... ... .......... ... ......-.... ........., . ..... .... .. .... .......... ........ ...... . ......, ..... .......... . ..... . ... .. ...... .......... . ......... ......, .... . ..... ......, ......... .............. ......... .......:

• 1. ....;
• 2. .....;
• 3. ..... .......

.............. .......... ...... "<sch:section>" - ........... ..... .......... ....., .. ........... . ............. ...... ... ...., .... ......... ....... .......... .. ........... ..... .............. ...... ..... .... ......... ... ........... ........... .......... ........... .......... . .... ......... ......

........... .......... . ..... . ... .. ...... ......... ... . ........:

• ..... ...... "<sch:window>";
• ..... ...... "<sch:class>";
• .... ...... "<sch:section>"

........ ........

10. ..... ..........

........ .............. ......... ............ ........... . .... ....... . ....... ...... .... ........ ...... (.......... ..... ....... WinDefWindowProc ....... ...... PM). ........ ..... .............. . ......... ...... PM ............ ....... . ...... Paint (WM_PAINT), ................ . ...... .... ........ ....... ..... ........ ...... ..... ...... ..... ............... ...... ......... ......... .......:

 1. ......... ..... ... ........ ....
 2. .... ...... (........, .... ... .... .. .........), ..
 3.   ......... ..... ... ........ ...... ....
 4.   .... ...... (........, .... ... ...... .. .........), ..
 5.      .... ....... ..... .... ..... ...... ........ ......,
 5.         .. ....... . .......
 6.      .......... ....., ....... .... .. ........, . ..3
 7. ........ .......

..... ......., ........ ..... ........ ... ............. . ..... ....... ... ............ .......... ................ ......... .... ........... ..., ... ........ ...... .... .......... . ...... .... ........ ......, ....... ........ .................. . ........... (...............) ....... ........ ...... .... .........:

• 1. ..... .......... ...........
• 2. .... ...... ..., .......
• 3. ...... ......... ........

. ..1 .......... ......... ........., .......... ...., ....... ............. ....... .. ...... ........ ...... .... ............ ...... . ........, .......... ...... ......... ........ .. ...... .. ......... ....... .........., .. ......... . .......... .......... .... ........ ........ ......... ................. ................. .......... .... ... ........... ....... . ......... ........., ............ ... ..-.. ...... . .......... ........., ... . ..-.. ................ ...... (............ ...., .......... ......, ............ ... ........ . ....) ([A11]).

Comments:

arec 2008-04-15 03:17:02	..... eComStation ............ . ........ ReactOS ... ..... ........ ............. . ..... ..... .... . -.. ... . ....... ... . ... ... .. ..... ... . .... ..... .... . .... ...... . ....... .... ...... . ...... ... .......... ....
Sergey Posokhov 2008-04-15 12:25:27	. . ... .. ........ :-) ..... ...., ........ Rexx, ........... ....... ..... ......, . ... ..... .... . .... PM123. ... ............. . ... .. .. . .......... .....?

Comment this article.