BasicSteps 4

// File: BasicSteps_4.qml<br />// NOTE: For the three images voringsfossen1.jpg, bergen.jpg and cotton_grass.jpg,<br />// you can take any image in JPEG format with the size 280x210 pixels.<br />import Qt 4.7

Rectangle {<br /> property int frameSize: 300<br /> property int leftMargin: 10<br /> property int topMargin: 25<br /> property int bottomMargin: 65<br /> property int fontSize: 20<br /> property color frameColor: &quot;#FFF8DC&amp;quot; // cornsilk

width: 3 * frameSize; height: frameSize

// Photo 1<br /> Rectangle {<br /> x: 0; y: 0<br /> width: frameSize; height: frameSize<br /> color: frameColor

Image {<br /> x: leftMargin; y: topMargin<br /> source: &quot;voringsfossen1.jpg&amp;quot;<br /> }

Text {<br /> x: 0; y: frameSize - bottomMargin<br /> text: &quot;Voringsfossen&amp;quot;<br /> font.pixelSize: fontSize<br /> width: frameSize; horizontalAlignment: Text.AlignHCenter<br /> height: bottomMargin; verticalAlignment: Text.AlignVCenter<br /> }<br /> }

// Photo 2<br /> Rectangle {<br /> x: frameSize; y: 0<br /> width: frameSize; height: frameSize<br /> color: frameColor

Image {<br /> x: leftMargin; y: topMargin<br /> source: &quot;bergen.jpg&amp;quot;<br /> }

Text {<br /> x: 0; y: frameSize - bottomMargin<br /> text: &quot;Bergen&amp;quot;<br /> font.pixelSize: fontSize<br /> width: frameSize; horizontalAlignment: Text.AlignHCenter<br /> height: bottomMargin; verticalAlignment: Text.AlignVCenter<br /> }<br /> }

// Photo 3<br /> Rectangle {<br /> x: 2 * frameSize; y: 0<br /> width: frameSize; height: frameSize<br /> color: frameColor

Image {<br /> x: leftMargin; y: topMargin<br /> source: &quot;cotton_grass.jpg&amp;quot;<br /> }

Text {<br /> x: 0; y: frameSize - bottomMargin<br /> text: &quot;Cotton Grass&amp;quot;<br /> font.pixelSize: fontSize<br /> width: frameSize; horizontalAlignment: Text.AlignHCenter<br /> height: bottomMargin; verticalAlignment: Text.AlignVCenter<br /> }<br /> }<br />}