Каталог статей

Import

Во-первых, мы должны импортировать типы, в которых мы нуждаемся для этого примера. Большинство файлов QML используют встроенные типы QML (такие как: Rectangle, Image, ...), которые пришли с QT:

    import QtQuick 1.0


Элемент Rectangle

    Rectangle {
        id: page
        width: 500; height: 200
        color: "lightgray"

Мы объявляем рутовый (root) элемент типа Rectangle (Прямоугольник). Это - один из основных стандартных блоков, которые Вы можете использовать, чтобы создать приложение в QML. Мы присваем этому эдементу id, для возможности обращений к ниму позже. Назовем этот элемент "page". Мы также устанавливаем ширину (свойство: width), высоту (свойство: height) и цвет (свойство: color)  элемента. Элемент Rectangle содержит и много других свойств (таких как x и y), но иы оставим в них значения по умолчанию.

Элемент Text

    Text {
        id: helloText
        text: "Hello world!"
        y: 30
        anchors.horizontalCenter: page.horizontalCenter
        font.pointSize: 24; font.bold: true
    }

Здесь мы добавляем элемент Text, который показывает текст 'Hello world!'. Элемент Text в этом примере представляет собой дочерний элемент рутового элемента Rectangle. Свойство "y" используется, чтобы задать вертикальную позицию элемента Text на 30 пикселов ниже от вершины его родителя.

Свойсьво anchors.horizontalCenter отвечает за горизонтальную центровку элемента. В нашем случае мы определяем, что наш элемент Text должен быть горизонтально отцентрован внутри элемента page.

Свойства font.pointSize и font.bold определяют параметры шрифта (жирный шрифт размера 24).

Исходный код примера:

http://qml.ucoz.com/load/primery_na_qml/primer_k_state_quot_bazovye_tipy_v_qml_quot/2-1-0-2