Skip over navigation

Roxen Interactive RXML Help

<tablist></tablist>

<tablist> produces graphical navigationtabs. For example, the Administration interface for Roxen CMS uses tablists for easier administration.

The <tablist> tag is by design a wrapper for the <gbutton> tag, i.e. it inherits all <gbutton> attributes. Also, the <tab> tag is in turn a wrapper for <tablist> meaning that all attributes which may be given to <tablist> may also be used in <tab>. Those attributes given to <tablist> has a global effect on the tablist, while the same attributes given to a <tab> only will have a local effect, thus overriding the globally given attribute.

All contents inside <tablist> except for the <tab> tags will be discarded. <taglist> is used in this way to make it possible for tabs to look different when they are for instance first or last in the tablisting.

The <define> tag can be used to globally define the tablist fgcolor (foreground color). The define, <<define name="fgcolor">>, declared prior to the <tablist> tag, will be sent as an extra argument to <gbutton>.

<tablist> <tab selected='selected'>Information</tab> <tab>Settings</tab> </tablist>
/Information\/Settings\

Attributes

frame-image
frame-image= (/internal-roxen-tabframe)

A layered Photoshop (PSD) or Gimp (XCF) image which portrays the tab's appearance. Descriptions of the different layers follows below. If a <define name="frame-image">Image_path</define> definition is set that image will be the default value instead of /internal-roxen-tabframe.

selcolor
selcolor=color (white)

This attribute sets the backgroundcolor for the image. The effect of this attribute is only shown when the attribute "selected" has been set. If a <define name="selcolor">colordefinition</define> definition is set that color will be the default value instead of white.

seltextcolor
seltextcolor=color (black)

This attribute sets the textcolor for the image. The effect of this attribute is only shown when the attribute "selected" has been set. If a <define name="seltextcolor">colordefinition</define> definition is set that color will be the default value instead of black. If this definition is not present, the attribute "textcolor", the definition "textcolor" and finally the color "black" will be tested.

dimcolor
dimcolor=color (#003366)

This attribute sets the backgroundcolor for the image. The effect of this attribute is only shown when the attribute "selected" has not been set. If a <define name="dimcolor">colordefinition</define> definition is set that color will be the default value instead of #003366 .

textcolor
textcolor=color (white)

This attribute sets the textcolor for the image. The effect of this attribute is only shown when the attribute "selected" has not been set. If a <define name="textcolor">colordefinition</define> definition is set that color will be the default value instead of white .

Defined in content

<tab></tab>

<tab> defines the layout and function for each and one of the tabs in the tablisting. <tab> inherits all attributes available to <tablist>, hence all attributes available to <gbutton> tag may be used with the <tab> tag. For instance, the attribute href is very useful when using <tab> and a part of <gbutton>. For more information about <gbutton> attributes, see its documentation.

The contents of the <tab> is the tabs text.

Below follows a listing of the attributes unique to the <tab> tag. Also, a listing of how imagelayers may be used is presented.

Attributes

selected
selected=

Using this attribute the layer "selected" in the image will be shown in the generated image. If this attribute has not been given the layer "unselected" will be shown in the generated image.

alt
alt=text (the tags content)

This attribute sets the alt-text for the tab. By default the alt-text is fetched from the content between the <tab>...</tab>.

Image Layers

These lists shows the function of the different image layers as well as how one layer from each group may be combined.

  • Layer Position

    Position layers are the layername prefix.

  • first

    A layer with this prefix is only shown for the first <tab> tag inside the <tablist> tag.

  • last

    A layer with this prefix is only shown for the last <tab> tag inside the <tablist> tag.

  • Layer Focus

    Focus layers are the middle part of the layername.

  • selected

    This layer is only shown when the attribute selected has been set.

  • unselected

    This layer is only shown when the attribute selected has not been set.

  • Layer Type

    Type layers are the layername suffix.

  • [nothing, i.e. ""]

    This layer is inserted above all layers in the image, closest to the viewer that is, if lower layers are considered to further in inside the monitor.

  • mask

    This layer should be transparent where the tab is supposed to be transparent. The only thing that is retrieved from this layer is the mask; any graphical content here will be thrown away.

  • frame

    The framelayer contains the various graphical elements fromwhich the frame around the button is built. This layer will always be run in "Multiply" mode, regardless of what mode it was previously set to. "Multiply" adjusts the framelayers brightness, i.e. Value ("V" in HSV), without affecting the colorcomponents, i.e. Hue and Saturation ("HS" in HSV).

  • background

    This layer will be put beneath the frame layer and the printed text.

  • left

    This layer is put on the left side of the of the generated image, thus increasing the width of the images left side.

  • right

    This layer is put on the right side of the of the generated image, thus increasing the width of the images right side.

  • above

    This layer will be shown above the other parts of the generated image, thus increasing the height of the images top.

  • below

    This layer will be shown below the other parts of the generated image, thus increasing the height of the images base.

  • Handling layers

    The Position- and Focus-layers give instructions on when the layer is used while the Type-layers indicates its function.

    PositionFocusType

    ""

    ""

    ""

    first

    selected

    background

    last

    unselected

    mask

     

     

    frame

     

     

    left

     

     

    right

     

     

    above

     

     

    below

    These three layertypes can be combined into all possible permutations. The order in the name is always Position Focus Type, each type separated by a space. If one or two of the three layertypes is left out, the layer will be shown regardless the extra criterias that might be choosen. For instance, "selected frame" will be shown for the "first" and "last" tabs as well as for the ones in between the two, given that the tab has been marked as "selected".

    None of these layers are strictly necessary, as long as there exists at least one layer of the type "background" or "frame". If all "mask"-layers are left out, the mask will primary be the framelayer and secondly the backgroundlayer, if the framelayer is not available.