BasicSteps 3: Difference between revisions

From Qt Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 3: Line 3:
<code>
<code>


// File: BasicSteps_3.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 QtQuick 1.0
// File: BasicSteps_3.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 QtQuick 1.0


Rectangle {<br /> width: 3 * 300; height: 300
Rectangle {
width: 3 * 300; height: 300


// Photo 1<br /> Rectangle {<br /> x: 0; y: 0<br /> width: 300; height: 300<br /> color: &quot;#FFF8DC&amp;quot; // cornsilk
// Photo 1
Rectangle {
x: 0; y: 0
width: 300; height: 300
color: "#FFF8DC" // cornsilk


Image {<br /> x: 10; y: 25<br /> source: &quot;voringsfossen1.jpg&amp;quot;<br /> }
Image {
x: 10; y: 25
source: "voringsfossen1.jpg"
}


Text {<br /> x: 0; y: 235<br /> text: &quot;Voringsfossen&amp;quot;<br /> font.pixelSize: 20<br /> width: 300; horizontalAlignment: Text.AlignHCenter<br /> height: 65; verticalAlignment: Text.AlignVCenter<br /> }<br /> }
Text {
x: 0; y: 235
text: "Voringsfossen"
font.pixelSize: 20
width: 300; horizontalAlignment: Text.AlignHCenter
height: 65; verticalAlignment: Text.AlignVCenter
}
}


// Photo 2<br /> Rectangle {<br /> x: 300; y: 0<br /> width: 300; height: 300<br /> color: &quot;#FFF8DC&amp;quot; // cornsilk
// Photo 2
Rectangle {
x: 300; y: 0
width: 300; height: 300
color: "#FFF8DC" // cornsilk


Image {<br /> x: 10; y: 25<br /> source: &quot;bergen.jpg&amp;quot;<br /> }
Image {
x: 10; y: 25
source: "bergen.jpg"
}


Text {<br /> x: 0; y: 235<br /> text: &quot;Bergen&amp;quot;<br /> font.pixelSize: 20<br /> width: 300; horizontalAlignment: Text.AlignHCenter<br /> height: 65; verticalAlignment: Text.AlignVCenter<br /> }<br /> }
Text {
x: 0; y: 235
text: "Bergen"
font.pixelSize: 20
width: 300; horizontalAlignment: Text.AlignHCenter
height: 65; verticalAlignment: Text.AlignVCenter
}
}


// Photo 3<br /> Rectangle {<br /> x: 2 * 300; y: 0<br /> width: 300; height: 300<br /> color: &quot;#FFF8DC&amp;quot; // cornsilk
// Photo 3
Rectangle {
x: 2 * 300; y: 0
width: 300; height: 300
color: "#FFF8DC" // cornsilk


Image {<br /> x: 10; y: 25<br /> source: &quot;cotton_grass.jpg&amp;quot;<br /> }
Image {
x: 10; y: 25
source: "cotton_grass.jpg"
}


Text {<br /> x: 0; y: 235<br /> text: &quot;Cotton Grass&amp;quot;<br /> font.pixelSize: 20<br /> width: 300; horizontalAlignment: Text.AlignHCenter<br /> height: 65; verticalAlignment: Text.AlignVCenter<br /> }<br /> }<br />}
Text {
x: 0; y: 235
text: "Cotton Grass"
font.pixelSize: 20
width: 300; horizontalAlignment: Text.AlignHCenter
height: 65; verticalAlignment: Text.AlignVCenter
}
}
}

Revision as of 10:41, 25 February 2015


// File: BasicSteps_3.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 QtQuick 1.0

Rectangle {

width: 3 * 300; height: 300

// Photo 1

Rectangle {
x: 0; y: 0
width: 300; height: 300
color: "#FFF8DC" // cornsilk

Image {

x: 10; y: 25
source: "voringsfossen1.jpg"
}

Text {

x: 0; y: 235
text: "Voringsfossen"
font.pixelSize: 20
width: 300; horizontalAlignment: Text.AlignHCenter
height: 65; verticalAlignment: Text.AlignVCenter
}
}

// Photo 2

Rectangle {
x: 300; y: 0
width: 300; height: 300
color: "#FFF8DC" // cornsilk

Image {

x: 10; y: 25
source: "bergen.jpg"
}

Text {

x: 0; y: 235
text: "Bergen"
font.pixelSize: 20
width: 300; horizontalAlignment: Text.AlignHCenter
height: 65; verticalAlignment: Text.AlignVCenter
}
}

// Photo 3

Rectangle {
x: 2 * 300; y: 0
width: 300; height: 300
color: "#FFF8DC" // cornsilk

Image {

x: 10; y: 25
source: "cotton_grass.jpg"
}

Text {

x: 0; y: 235
text: "Cotton Grass"
font.pixelSize: 20
width: 300; horizontalAlignment: Text.AlignHCenter
height: 65; verticalAlignment: Text.AlignVCenter
}
}

}