982 lines · 38.5 KB · HTML
RawDownload
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>Synth File Format</title>  <style>div.dtd-fragment {    width: 100%;    border: none;    background-color: #eee;}pre.dtd-fragment {    margin-left: 0;}div.example {    width: 100%;    color: maroon;}  </style>  </head>   <body>    <h2><a name="file">File Format</a></h2>    <p>      Synth's file format (<a href="synth.dtd">dtd</a>)      allows for specifying all the pieces      necessary to create your own look and feel. A synth file is      loaded by way of the <A HREF="../../../../../javax/swing/plaf/synth/SynthLookAndFeel.html#load(java.io.InputStream, java.lang.Class)">SynthLookAndFeel.load(InputStream, Class)</a> or      <a href="../../../../../javax/swing/plaf/synth/SynthLookAndFeel.html#load(java.net.URL)">SynthLookAndFeel.load(URL)</a> methods.      The following example uses the <code>load</code> method to configure       a <code>SynthLookAndFeel</code> and sets it as the current look      and feel:    </p>    <div class="example">      <pre>  SynthLookAndFeel laf = new SynthLookAndFeel();  laf.load(MyClass.class.getResourceAsStream("laf.xml"), MyClass.class);  UIManager.setLookAndFeel(laf);      </pre>    </div>    <p>      This example loads the look and feel from an input stream, using      the specified class as the resource base to resolve paths.      It is also possible to load a look and feel from an arbitrary URL      as in the following example.    </p>    <div class="example">      <pre>  SynthLookAndFeel laf = new SynthLookAndFeel();  laf.load(new URL("file:///C:/java/synth/laf/laf.xml"));  UIManager.setLookAndFeel(laf);      </pre>    </div>    <p>      The method <a href="../../../../../javax/swing/plaf/synth/SynthLookAndFeel.html#load(java.net.URL)">SynthLookAndFeel.load(URL)</a> can be      used, for instance, to load a look and feel from any of the following:    </p>    <ul>      <li>File, e.g. <code>file:///C:/java/synth/laf/laf.xml</code></li>      <li>Web server, e.g. <code>http://host/laf.xml</code></li>      <li>JAR file, e.g.        <code>jar:file:///C:/synth-laf.jar!/laf.xml</code></li>      <li>Remote JAR file, e.g.        <code>jar:http://host/synth-laf.jar!/laf.xml</code></li>    </ul>    <p>      While the DTD for synth is specified, the parser is not validating.      Parsing will fail only if a necessary attribute is not      specified, or of the wrong type.     <h3>The synth element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.synth">synth</a> ((<a href="#ee.beansPersistance">%beansPersistance;</a>) | <a href="#e.style">style</a> | <a href="#e.bind">bind</a> | <a href="#e.font">font</a> | <a href="#e.color">color</a> |                 <a href="#e.imagePainter">imagePainter</a> | <a href="#e.imageIcon">imageIcon</a> | <a href="#e.defaultsProperty">defaultsProperty</a>)*>&lt;!ATTLIST synth          <a href="#synth.version">version</a>              CDATA          #IMPLIED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl><dt><a name="synth.version"><samp>version</samp></a></dt>	<dd>File format version, should be 1</dd>    </dl>    <p>      The <a href="#e.synth">synth</a> element contains all the other      elements that make up a SynthLookAndFeel definition.    </p>           <h3>The style element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.style">style</a> (<a href="#e.property">property</a> | <a href="#e.defaultsProperty">defaultsProperty</a> | <a href="#e.state">state</a> | <a href="#e.font">font</a> | <a href="#e.graphicsUtils">graphicsUtils</a> |                 <a href="#e.insets">insets</a> | <a href="#e.painter">painter</a> | <a href="#e.imagePainter">imagePainter</a> | <a href="#e.opaque">opaque</a> | (<a href="#ee.beansPersistance">%beansPersistance;</a>) |                 <a href="#e.imageIcon">imageIcon</a>)*>&lt;!ATTLIST style          <a href="#style.id">id</a>              ID          #IMPLIED          <a href="#style.clone">clone</a>           IDREF       #IMPLIED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>      <dt><a name="style.id"><samp>id</samp></a></dt>      <dd>Unique identifier for the style.</dd>      <dt><a name="style.clone"><samp>clone</samp></a></dt>      <dd>Identifier of a previously defined style that is copied	    and used for the new style. This provides a conveniant	    mechanism for overriding only a portion of an existing	    style.</dd>    </dl>    <p>      A <a name="e.style">style</a> element corresponds to a      <code>SynthStyle</code>, with the child elements specifying      properties that apply to all states or state elements which      contain properties specific to a particular state. The following      example creates an opaque style with the id <code>button</code>,      insets of 4, 4, 4, 4 and a font of Dialog 12.    </p>    <div class="example">      <pre>&lt;style id="button">  &lt;opaque value="true"/>  &lt;insets top="4" left="4" right="4" bottom="4"/>  &lt;font name="Dialog" size="12"/>&lt;/style>      </pre>    </div>    <p>      The following example creates a new style with an id of      <code>clonedButton</code> that is a copy of the      style with id <code>button</code> and has a font of Dialog,      14. The resulting style will be opaque, have insets of 4, 4, 4,      4 and a font of Dialog 14.    </p>    <div class="example">      <pre>&lt;style id="clonedButton" clone="button">  &lt;font name="Dialog" size="14"/>&lt;/style>      </pre>    </div>     <h3>The state element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.state">state</a> (<a href="#e.color">color</a> | <a href="#e.font">font</a> | <a href="#e.painter">painter</a> | <a href="#e.imagePainter">imagePainter</a> | (<a href="#ee.beansPersistance">%beansPersistance;</a>) |                 <a href="#e.property">property</a> |  <a href="#e.imageIcon">imageIcon</a>)*>&lt;!ATTLIST state          <a href="#state.id">id</a>              ID             #IMPLIED          <a href="#state.clone">clone</a>           IDREF          #IMPLIED          <a href="#state.value">value</a>           CDATA          #IMPLIED          <a href="#state.idref">idref</a>           IDREF          #IMPLIED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>      <dt><a name="state.id"><samp>id</samp></a></dt>      <dd>Unique identifier for the state.</dd>      <dt><a name="state.clone"><samp>clone</samp></a></dt>      <dd>Identifier of a previously defined state that is copied	and used for the new state.</dd>      <dt><a name="state.value"><samp>value</samp></a></dt>      <dd>Identifies the state of the Component the properties are to apply	to. This is a list of: ENABLED,	MOUSE_OVER, PRESSED, DISABLED, FOCUSED, SELECTED or	DEFAULT. Multiple states should	be separated by 'and.' If you do not specify a value, the	contents apply to all states.      <dt><a name="state.idref"><samp>idref</samp></a></dt>      <dd>Indicates this state should be the same as a previously	    defined state. This is useful for multiple styles that	    wish to share the same visual properties for a particular	    state.      </dd>    </dl>    <p>      The <a href="#e.state">state</a> element specifies the visual      properties that are to be used for      a particular state of a component. For example, you could      specify the background color when the Component is enabled should look      different than the background color when the component is      disabled. Not all Components support all states. For example, a      <code>Panel</code> only supports the states ENABLED and DISABLED.    </p>    <p>      The following example creates a state with a red background that      will be used when the component is in an a selected and pressed state:    </p>    <div class="example">    <pre>&lt;state value="SELECTED AND PRESSED">  &lt;color value="RED" type="BACKGROUND"/>&lt;/state>    </pre></div>    <p>      The state with the most individual matches will be      chosen. For example, the following defines two states:    </p>    <div class="example">      <pre>&lt;state value="SELECTED and PRESSED" id="one">  &lt;color value="RED" type="BACKGROUND"/>&lt;/state>&lt;state value="SELECTED" id="two">  &lt;color value="RED" type="BACKGROUND"/>&lt;/state>    </pre></div>    <p>      State <code>one</code> is used when the Component is SELECTED      and PRESSED, and state <code>two</code> when the Component is      SELECTED. If the state of the Component       contains at least SELECTED and PRESSED, state <code>one</code> will be      chosen, otherwise if the state is SELECTED, but not does not      contain PRESSED, state <code>two</code> will be used.    <p>     <h3>The font element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.font">font</a> EMPTY>&lt;!ATTLIST font          <a href="#font.id">id</a>              ID             #IMPLIED          <a href="#font.idref">clone</a>           IDREF          #IMPLIED          <a href="#font.name">name</a>            CDATA          #IMPLIED          <a href="#font.style">style</a>           CDATA          #IMPLIED          <a href="#font.size">size</a>            CDATA          #IMPLIED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>      <dt><a name="font.id"><samp>id</samp></a></dt>      <dd>Unique identifier for the Font.</dd>      <dt><a name="font.idref"><samp>idref</samp></a></dt>      <dd>Identifier of a previously defined font.</dd>      <dt><a name="font.name"><samp>name</samp></a></dt>      <dd>Name of the font.      <dt><a name="font.style"><samp>style</samp></a></dt>      <dd>Style of the font. This is a list of the styles defined by	Font separated by spaces: PLAIN, BOLD or ITALIC. If	unspecified PLAIN is used.      </dd>      <dt><a name="font.size"><samp>size</samp></a></dt>      <dd>Size of the font, in pixels</dd>    </dl>    <p>      Defines the font for the current <a href="#e.state">state</a>,      or <a href="#e.style">style</a>. You must      specify either an <a href="#font.idref">idref</a> or a      <a href="#font.name">name</a> and <a href="#font.size">size</a>.    </p>    <p>      The following example creates a style with a Font of      Dialog 12 Bold.    </p>    <div class="example">      <pre>&lt;style id="test">  &lt;font name="DIALOG" size="12" style="BOLD"/>&lt;/style>    </pre></div>    <p>      The following example creates a style with a font of      Dialog 12 Bold that will be used if the component is ENABLED,      otherwise Dialog 12 Italic will be used.    </p>    <div class="example">      <pre>&lt;style id="test">  &lt;font name="DIALOG" size="12" style="ITALIC"/>  &lt;state value="ENABLED">    &lt;font name="DIALOG" size="12" style="BOLD"/>  &lt;/state>&lt;/style>    </pre></div>    <p>      While you can supply a different font per state, in general      widgets will NOT revalidate when the state changes, so that you      may run into sizing problems if you try to use a font with a      significantly different size for different states.    </p>      <h3>The color element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.color">color</a> EMPTY>&lt;!ATTLIST color          <a href="#color.id">id</a>              ID             #IMPLIED          <a href="#color.idref">idref</a>           IDREF          #IMPLIED          <a href="#color.type">type</a>            CDATA          #IMPLIED          <a href="#color.value">value</a>           CDATA          #IMPLIED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>      <dt><a name="color.id"><samp>id</samp></a></dt>      <dd>Unique identifier for the color.</dd>      <dt><a name="color.idref"><samp>idref</samp></a></dt>      <dd>Identifier of a previously defined color.</dd>      <dt><a name="color.type"><samp>type</samp></a></dt>      <dd>Describes where this color should be used. This is	    typically one of the constants defined by ColorType:	    FOREGROUND, BACKGROUND, TEXT_FOREGROUND, TEXT_BACKGROUND	    or FOCUS. Alternatively you can specify the complete path	    to a class and field, for example	    javax.swing.plaf.synth.ColorType.FOREGROUND, this	    is useful for subclasses of synth that define additional	    color types.      </dd>      <dt><a name="color.value"><samp>value</samp></a></dt>      <dd>        Value for the color. This accepts the following forms.         <ul>          <li>The name of a constant in the <code>Color</code> class,            for example <code> RED</code>.           <li>A hex value of the form <code>#RRGGBB</code> where            <code>RR</code> gives the red component, <code>GG</code>            the green component and <code>BB</code> the blue            component. You need not specify all color components. For            example, <code>#123</code> is equivalent to <code>#000123</code>.          <li>A hex value of the form <code>#ARRGGBB</code> or            <code>#AARRGGBB</code>. This is useful for alpha values            other than <code>0xFF</code>. The form            <code>#ARRGGBB</code> is equivalent to            <code>#0ARRGGBB</code>.         </ul>      </dd>    </dl>    <p>      <a href="#e.color">Color</a> defines a color and what portion of      the Component it should be applied to. The following example      will use a background color of RED when the component is      enabled.    </p>    <div class="example">      <pre>&lt;state value="ENABLED">  &lt;color value="RED" type="BACKGROUND"/>&lt;/state>    </pre></div>    <p>      The following example will have a red background when the      Component is enabled, otherwise blue.    </p>    <div class="example">      <pre>&lt;style id="test">  &lt;state value="ENABLED">    &lt;color value="RED" type="BACKGROUND"/>  &lt;/state>  &lt;state>    &lt;color value="#00FF00" type="BACKGROUND"/>  &lt;/state>&lt;/style>    </pre></div>     <h3>The property element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.property">property</a> EMPTY>&lt;!ATTLIST property          <a href="#property.key">key</a>               CDATA                                             #REQUIRED          <a href="#property.type">type</a>              (idref|boolean|dimension|insets|integer|string)          "idref"          <a href="#property.value">value</a>             CDATA                                             #REQUIRED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>      <dt><a name="property.key"><samp>key</samp></a></dt>      <dd>Name of the property.</dd>      <dt><a name="property.type"><samp>type</samp></a></dt>      <dd>Indicates the type of the property.</dd>      <dt><a name="property.value"><samp>value</samp></a></dt>      <dd>Value for the property. For boolean properties this will be	be true or false, for integer properties this will be a	valid integer, for dimensions this will be the width and	height separated by a space, for insets properties this will	be the top, left, bottom and right separated by a space and	for idref properties this will be the unique id of a	previously defined object.</dd>    </dl>    <p>      <a href="#e.property">Property</a> elements are used to add key value pairs to a      <code>SynthStyle</code> that can be accessed by way of the      <code>get</code> method. Many <code>Component</code>s use the      key value pairs for configuring their visual appearance. Refer to      <a href="componentProperties.html">property table</a> for a list of the      properties each <code>Component</code> supports. The following      creates the properties      <code>ScrollBar.allowsAbsolutePositioning</code>,      <code>OptionPane.minimumSize</code>,      <code>ScrollPane.viewportBorderInsets</code>,      <code>Tree.rowHeight</code> and <code>foreground</code> with the      values false, a dimensions of 262x90, an insets of 5, 5, 5, 5,      the integer 20 and an instance of the      class ArrowButtonPainter.    </p>    <div class="example">      <pre>&lt;style id="test">  &lt;property key="ScrollBar.allowsAbsolutePositioning" type="boolean" value="false"/>  &lt;property key="OptionPane.minimumSize" type="dimension" value="262 90"/>  &lt;property key="ScrollPane.viewportBorderInsets" type="insets" value="5 5 5 5"/>  &lt;property key="Tree.rowHeight" type="integer" value="20"/>  &lt;object class="ArrowButtonPainter" id="ArrowButtonPainter"/>  &lt;property key="foreground" type="idref" value="ArrowButtonPainter"/>&lt;/style>    </pre></div>    <p>      You can also specify properties that are to apply to specific      states.  Whether or not the property is accessed for each state      depends upon how the property is used.  For example, the      following specifies a default icon and an icon to use while the      mouse is over the component.    </p>    <div class="example">      <pre>&lt;style id="test">  &lt;imageIcon id="defaultIcon" path="resources/myImage.png"/>  &lt;property key="RadioButton.icon" value="defaultIcon"/>  &lt;state value="MOUSE_OVER">    &lt;imageIcon id="mouseOverIcon" path="resources/myMouseOverImage.png"/>    &lt;property key="RadioButton.icon" value="mouseOverIcon"/>  &lt;/state>&lt;/style>    </pre></div><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.defaultsProperty">defaultsProperty</a> EMPTY>&lt;!ATTLIST defaultsProperty          <a href="#defaultsProperty.key">key</a>               CDATA                                             #REQUIRED          <a href="#defaultsProperty.type">type</a>              (idref|boolean|dimension|insets|integer|string)   "idref"          <a href="#defaultsProperty.value">value</a>             CDATA                                             #REQUIRED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>      <dt><a name="defaultsProperty.key"><samp>key</samp></a></dt>      <dd>Name of the property.</dd>      <dt><a name="defaultsProperty.type"><samp>type</samp></a></dt>      <dd>Indicates the type of the property.</dd>      <dt><a name="defaultsProperty.value"><samp>value</samp></a></dt>      <dd>Value for the property. For boolean properties this will be	true or false, for integer properties this will be a	valid integer, for dimensions this will be the width and	height separated by a space, for insets properties this will	be the top, left, bottom and right separated by a space and	for idref properties this will be the unique id of a	previously defined object.</dd>    </dl>    </dl>    <p>      <a href="#e.defaultsProperty">DefaultsProperty</a> elements are      used to define properties that will be placed in the      <code>UIDefaults</code> table that <code>SynthLookAndFeel</code>      supplies to the <code>UIManager</code>. The following assigns the      the Color red to the value Table.focusCellForeground.    </p>    <div class="example">      <pre>&lt;style id="test">  &lt;object class="javax.swing.plaf.ColorUIResource" id="color">    &lt;int>255&lt;/int>    &lt;int>0&lt;/int>    &lt;int>0&lt;/int>  &lt;/object>  &lt;defaultsProperty key="Table.focusCellForeground" type="idref" value="color"/>&lt;/style>    </pre></div>    <p>      This value could then be asked by way of      <code>UIManager.get("Table.focusCellForeground")</code>.    </p>     <h3>The graphicsUtils element</h3><div class="dtd-fragment"><pre class="dtd-fragment">&lt;!ELEMENT <a name="e.graphicsUtils">graphicsUtils</a> EMPTY>&lt;!ATTLIST graphicsUtils          <a href="#graphicsUtils.idref">idref</a>           IDREF             #REQUIRED&gt;</pre></div>    <p><em>Attribute definitions</em></p>    <dl>

Lines 1–500 of 982.