QT += core gui

QT += core gui declarative

#include <QDeclarativeView>
class MainWindow : public QDeclarativeView
{
 ...
}

MainWindow::MainWindow(QWidget *parent)
{
 Init();
}

Rectangle
{
 id: canvas;
 color: "black"
 anchors.fill: parent
 focus: true
}

void Init();

void MainWindow::Init()
{
 QString contentPath;
#ifdef QT_DEBUG
 contentPath = "D:/MyProjects/QT/4Toddler";
#else
 contentPath = QApplication::applicationDirPath();
#endif
 setFocusPolicy(Qt::StrongFocus);
 setResizeMode(QDeclarativeView::SizeRootObjectToView);
 setSource(QUrl::fromLocalFile(contentPath + "/main.qml"));
}

int main(int argc, char *argv[])
{
 ...
 w.show();
 ...
}

int main(int argc, char *argv[])
{
 ...
 w.showFullScreen();
 ...
}

Image
{
 id: button
 MouseArea
 {
  anchors.fill: parent
  id: mouseArea
  onClicked: callback()
 }
}

// Place items in row
Row
{
 anchors.right: parent.right;
 anchors.rightMargin: 4;
 anchors.top: parent.top;
 anchors.topMargin: 4;
 spacing: 4
 WindowButton
 {
  id: about;
  source: "about.png";
  function callback()
  {
  }
 }
 WindowButton
 {
  id: exit;
  source: "exit.png";
  function callback()
  {
  }
 }
}

Q_INVOKABLE void Quit();

void MainWindow::Quit()
{
 QApplication::quit();
}

rootContext()->setContextProperty("window", this);

function callback()
{
 window.Quit();
}

Image
{
 ...
 states:[
  State
  {
   name: "hovered";
   when: mouseArea.pressed;
   PropertyChanges { target: button; opacity: 1;}
  },
  State
  {
   name: "normal"
   when: mouseArea.pressed == false;
   PropertyChanges { target: button; opacity: 0.7; }
  }
  ]
}

Image
{
 ...
 Behavior on opacity
 {
  // Animaion step is a 100 milliseconds
  // On every iteration opacity will increase or descrease with step equals to 0,1
  NumberAnimation { duration: 100 }
 }
}

Rectangle
{
 id: about
 function show()
 {
  about.opacity = 1;
 }
 function hide()
 {
  about.opacity = 0;
 }
  
 color: "transparent"
 opacity: 0
  
 width: parent.width
 height: parent.height
 visible: opacity > 0
 Rectangle
 {
  anchors.fill: parent
  opacity: 0.5
  color: "gray"
 } Rectangle
 {
  id: dialog
   
  width: 360
  height: 230
  x: parent.width / 2 - dialog.width / 2;
  y: parent.height / 2 - dialog.height / 2;
  z: 10
  border.color: "gray"
  Text
  {
   text: "4 Toddler"
   font.bold: true
   font.pixelSize: 22
    
   anchors.horizontalCenter: parent.horizontalCenter
   anchors.verticalCenter: parent.verticalCenter
  }
 }
 Behavior on opacity
 {
  NumberAnimation { duration: 100 }
 }
 MouseArea
 {
  anchors.fill: parent;
   
  onClicked: hide();
 }
}

visible: opacity > 0

Rectangle
{
 id: canvas
 ...
 About
 {
  id: aboutDlg
 }
}

aboutDlg.show();

WindowButton
{
 id: about;
 ...
 function callback()
 {
  aboutDlg.show();
 }
}

Image
{
  id: block;
  property bool remove: false
  property bool show: false
  
  opacity: 0;
  fillMode: Image.Stretch;
 states: [
  State
  {
   name: "remove"; when: remove == true;
   PropertyChanges { target: block; opacity: 0 }
   StateChangeScript { script: block.destroy(1000); }
  },
  State
  {
   name: "show"; when: show == true;
   PropertyChanges { target: block; opacity: 1 }
  }
 ]
  Behavior on opacity { NumberAnimation { duration: 300 } }
}

// Template for new elements
 
var component = Qt.createComponent("block.qml");
var maxBlocksCount = 10;
var blocksArray  = new Array();
function handleKey()
{
 var x = Math.floor(Math.random() * canvas.width);
 var y = Math.floor(Math.random() * canvas.height);
 createNewBlock(x, y);
}
function createNewBlock(x, y)
{
 if(component.status != Component.Ready)
 {
  return false;
 }
 if(blocksArray.length > maxBlocksCount)
 {
  removeAllBlocks();
 }
 var newBlock = component.createObject(canvas);
 if(newBlock == null)
 {
  return false;
 } var iconFile = window.randomIcon;
 newBlock.source = ("Icons/" + iconFile);
 newBlock.x = x;
 newBlock.y = y;
 newBlock.show = true;
 blocksArray.push(newBlock);
 window.PlaySound();
 return true;
}
function removeAllBlocks()
{
 for(var i = 0; i < blocksArray.length; ++i)
 {
  blocksArray[i].remove = true;
 }
 while(blocksArray.length != 0)
 {
  blocksArray.pop();
 }
}

Q_PROPERTY(QString randomIcon READ RandomIcon)

QString RandomIcon();

QString MainWindow::RandomIcon()
{
 QStringList iconFilesList;
 
 QString searchPath = m_ContentPath + "/Icons/";
 QDir directory = QDir(searchPath);
 QStringList filters;
 filters << "*.png";
 directory.setNameFilters(filters);
 iconFilesList = directory.entryList(QDir::AllEntries);
 int fileIdx = qrand() % iconFilesList.count();
  
 return iconFilesList.at(fileIdx);
}

Q_INVOKABLE void PlaySound();

void MainWindow::PlaySound()
{
 QStringList soundFilesList;
 
 QDir directory = QDir(m_ContentPath + "/Sounds/");
 
 QStringList filters;
 
 filters << "*.wav";
 
 directory.setNameFilters(filters);
 soundFilesList = directory.entryList(QDir::AllEntries);
 int fileIdx = qrand() % soundFilesList.count();
 QString soundFile = m_ContentPath + "/Sounds/" + soundFilesList.at(fileIdx);
 QSound::play(soundFile);
}

import Qt 4.7
 
import "main.js" as Main

Rectangle
{
 id: canvas
 ...
 Keys.onPressed: { if(event.isAutoRepeat == false) { Main.handleKey(); } }

import Qt.labs.particles 1.0
Particles
{
 id: particles
 width: 1;
 height: 1;
 anchors.centerIn: parent
 emissionRate: 0
 lifeSpan: 700;
 lifeSpanDeviation: 600
 angle: 0;
 angleDeviation: 360;
 velocity: 100;
 velocityDeviation: 30;
 source: randomImage();
 function randomImage()
 {
  var images = ["red.png", "blue.png", "green.png", "white.png", "yellow.png"];
  var idx = Math.floor((Math.random() * 100)) % images.length;
  return ("Stars/" + images[idx]);
 }
}

Image
{
 id: block;
 ...
 Firework
 {
  id: firework
 }
 ...
}

StateChangeScript { script: firework.burst(50); }

State
{
 name: "show"; when: show == true;
 StateChangeScript { script: firework.burst(50); }
 PropertyChanges { target: block; opacity: 1 }
}