The three ways to write a property

Tag, tag with value, or attribute — and why it changes everything.

The same property can be written in three ways. They are equivalent… except on one decisive point.

1. As a child tag

<image name="fond">
  <path>./data/fond.jpg</path>
</image>

The historical form. The most readable as soon as a component has several properties.

2. As a child tag with a `value` attribute

<image name="fond">
  <path value="./data/fond.jpg" />
</image>

Strictly equivalent to the first.

3. As an attribute of the component

<image name="fond" path="./data/fond.jpg" pos="0 0" size="1 1" />

Everything fits on one line. Very handy for simple components.

The difference that matters

Only forms 1 and 2 accept a condition on ONE property.

<image name="fond">
  <path if="crt">./data/fond-crt.jpg</path>
  <path if="!crt">./data/fond-hd.jpg</path>
</image>

Impossible in form 3: if= on the parent tag would condition the whole component, not one of its properties.

They mix freely

This is the important point: you do not have to pick one way and stick to it. Recalbox's reader accepts all three, including within the same component.

<image name="fond" pos="0 0" size="1 1" zIndex="1">
  <path if="crt">${root}/images/fond-crt.jpg</path>
  <path if="!crt">${root}/images/fond-hd.jpg</path>
  <color value="FFFFFFC0" />
</image>

Three spellings in the same component: the simple values as attributes on the first line, the one with variants as conditional tags, and a last one as a value tag. It is perfectly valid, and it is even what you write in practice.