BasicSteps 4

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

Rectangle {
 property int frameSize: 300
 property int leftMargin: 10
 property int topMargin: 25
 property int bottomMargin: 65
 property int fontSize: 20
 property color frameColor: "#FFF8DC" // cornsilk

width: 3 * frameSize; height: frameSize

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

Image {
 x: leftMargin; y: topMargin
 source: "voringsfossen1.jpg"
 }

Text {
 x: 0; y: frameSize - bottomMargin
 text: "Voringsfossen"
 font.pixelSize: fontSize
 width: frameSize; horizontalAlignment: Text.AlignHCenter
 height: bottomMargin; verticalAlignment: Text.AlignVCenter
 }
 }

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

Image {
 x: leftMargin; y: topMargin
 source: "bergen.jpg"
 }

Text {
 x: 0; y: frameSize - bottomMargin
 text: "Bergen"
 font.pixelSize: fontSize
 width: frameSize; horizontalAlignment: Text.AlignHCenter
 height: bottomMargin; verticalAlignment: Text.AlignVCenter
 }
 }

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

Image {
 x: leftMargin; y: topMargin
 source: "cotton_grass.jpg"
 }

Text {
 x: 0; y: frameSize - bottomMargin
 text: "Cotton Grass"
 font.pixelSize: fontSize
 width: frameSize; horizontalAlignment: Text.AlignHCenter
 height: bottomMargin; verticalAlignment: Text.AlignVCenter
 }
 }
}