====In-line style declaration====

You may declare styles within a style tag anywhere inside a //composer// node of your SMXML. It makes sense to declare styles before the UI elements they are being applied on so by the time SMAF gets to render the UI element the style has already been registered. All style declarations must appear as child nodes of a <style/> node in SMXML.

All style declarations must also have a //style// attribute. The value of which is the unique style ID. You apply stlyles by referencing their unique style ID. In the example below we apply the //sampleFill// fill style on a //box// component by setting its //fill// attribute to '//sampleFill//'. Each type of style has its own corresponding attribute name. See the style documentation for more details.

==SMXML==
%%(xml)
<!DOCTYPE composer SYSTEM "http://dtd.samplemath.com/smxml.dtd">
<composer>
<style>
<fill style="sampleFill" type="solid">
<color alpha=".95" ratio="0">0xff0000</color>
</fill>
</style>
<box id="background" width="100%" height="100%" alpha=".1" rounded="24"/>
<box width="200" height="100" x="230" y="30" fill="sampleFill"/>
</composer>
%%
==OUTPUT==
{{flash url="http://samplemath.com/smxml/bin/smxml.swf?url=http://samplemath.com/smxml/example/style.smxml" [width="640"] [height="160"] }}




====Applying styles====

You may and should apply one style on many components. There may be more styles applied on a component but there should always be only one style of a certain type applied at a time. For example there may be both a //stroke// and a //fill// style applied on a //box// but there may never be two of the same kind.





====External style sheets====

External style sheets are planned but not yet explicitly implemented. They can already be technically achieved loading external SMXML but it is not yet officially supported.