1 Main

import QtQuick 2.0
import QtQuick.Controls 1.0
import QtQuick.LocalStorage 2.0


Rectangle {
    id: mainRectangle
    width: 240
    height: 400
    color: "#6d9586"
    
}

2 header

Rectangle{
        id: header
        width: 240
        height: 50
        gradient: Gradient {
            GradientStop {
                position: 0
                color: "#013c1818"
            }

            GradientStop {
                position: 0.86
                color: "#154215"
            }

            GradientStop {
                position: 1
                color: "#000000"
            }
        }
        anchors.top: parent.top
        anchors.topMargin: 0
        anchors.horizontalCenter: parent.horizontalCenter
        Text {
            id: title
            text: "Tennivalóim"
            anchors.left: parent.left
            anchors.leftMargin: 10
            anchors.verticalCenter: parent.verticalCenter
            font.bold: true
            font.pointSize: 15
            color: "#ffffff"
        }

        Button {
            id: addButton
            anchors.verticalCenter: parent.verticalCenter
            width: 26
            height: 26
            text: "+"
            anchors.right: parent.right
            anchors.rightMargin: 10
            onClicked: PropertyAnimation {
                target: newpage
                property: "x";
                to: 0
                duration: 200;
            }
        }

    }

3 listview

ListView {
        id: todolist
        x: 0
        y: 50
        width: parent.width
        height: 350
        cacheBuffer: 317
        flickableDirection: Flickable.VerticalFlick
        boundsBehavior: Flickable.DragOverBounds
        smooth: true
        clip: false
        snapMode: ListView.SnapToItem
        orientation: ListView.Vertical

        delegate: Todo { name: todoName; priority: todoPriority}
        model: todoListmodel
    }

4 listmodel

    ListModel {
        id: todoListmodel
    }

5 initDB

 function initDB() {

        //identifier, version, description, estimated_size, callback(db)
        var db = LocalStorage.openDatabaseSync("TodoDB", "1.0", function(db){
            console.log("Nincs még db");
        });
        db.transaction(
                    function(tx) {
                        // Create the database table if it doesn't already exist
                        console.log("Table create");
                        tx.executeSql('CREATE TABLE IF NOT EXISTS todos (todo TEXT, priority INT NOT NULL, description TEXT)');
                        //tx.executeSql('DROP TABLE todos');
                    }
                    );
        return db;
    }

6 update

    function upDate() {
        initDB().transaction(
                    function(tx) {
                        // Show all added todos
                        var rs = tx.executeSql('SELECT * from todos');
                        console.log("Rows: " + rs.rows.length);
                        todoListmodel.clear();
                        for(var i = 0; i < rs.rows.length; i++) {
                            todoListmodel.append({todoName: rs.rows.item(i).todo, todoPriority:rs.rows.item(i).priority });
                            console.log("Item: " + i);
                        }
                    }
                    )

    }

7 newpage

 NewPage{
        id:newpage
        x: 240
    }

8 oncomplete

    Component.onCompleted: {
        initDB();
        upDate();
    }

animation

PropertyAnimation {
        id: hide
        target: newpage
        property: "x";
        to: 240
        duration: 200;
    }

buttonadd

 Button {
        id: buttonAdd
        text: "Kész!"
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottom: buttonBack.top
        anchors.bottomMargin: 10
        onClicked: {
            initDB().transaction(
                        function(tx) {
                            var prior = 1;
                            if(radio_button1.checked){
                                prior = 1
                            }
                            if(radio_button2.checked){
                                prior = 2
                            }
                            if(radio_button3.checked){
                                prior = 3
                            }

                            // Add todo
                            console.log("Add todo");
                            tx.executeSql('INSERT INTO todos VALUES(?, ?, ?)', [ todoNameInput.text, prior, '' ]);
                        }
                        );
            goBack();
        }

    }

Buttonback

    Button {
        id: buttonBack
        text: "Vissza"
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 30
        onClicked: goBack()
    }

goback

    function goBack(){
        radio_button1.checked = true;
        radio_button2.checked = false;
        radio_button3.checked = false;
        todoNameInput.text = "";
        upDate();
        hide.start();
    }

header

    Text {
        id: title2
        text: "Új tennivaló"
        anchors.top: parent.top
        anchors.topMargin: 10
        anchors.left: parent.left
        anchors.leftMargin: 10
        font.bold: true
        font.pointSize: 15
    }

input

    Rectangle{
        id: rectangle1
        height: 20
        anchors.top: parent.top
        anchors.topMargin: 100
        anchors.right: parent.right
        anchors.rightMargin: 10
        anchors.left: parent.left
        anchors.leftMargin: 10

        TextInput {
            anchors.fill: parent
            id: todoNameInput
            color: "#000000"
            anchors.topMargin: 0
            font.pointSize: 12
        }
    }

NewPage.qml

import QtQuick 2.0
import QtQuick.Controls 1.0
import QtQuick.LocalStorage 2.0

Rectangle {
    id:page2
    width: 240
    height: 400
    color: "#6d9586"
}

raidobuttons

    RadioButton {
        id: radio_button1
        text: "Nagyon fontos"
        anchors.left: parent.left
        anchors.leftMargin: 10
        anchors.top: rectangle1.bottom
        anchors.topMargin: 20
        checked: true;
        onClicked: {
            if(!checked){
                checked = true;
            }
            radio_button2.checked = false;
            radio_button3.checked = false;
        }
    }

    RadioButton {
        id: radio_button2
        text: "Fontos"
        anchors.left: parent.left
        anchors.leftMargin: 10
        anchors.top: radio_button1.bottom
        anchors.topMargin: 10
        onClicked: {
            if(!checked){
                checked = true;
            }
            radio_button1.checked = false;
            radio_button3.checked = false;
        }
    }

    RadioButton {
        id: radio_button3
        text: "Ráér"
        anchors.left: parent.left
        anchors.leftMargin: 10
        anchors.top: radio_button2.bottom
        anchors.topMargin: 10
        onClicked: {
            if(!checked){
                checked = true;
            }
            radio_button2.checked = false;
            radio_button1.checked = false;
        }
    }

Todo.qml

import QtQuick 2.0

Rectangle {
    width: parent.width
    height: 62

    property int priority;
    property string name;


    Rectangle {
        id: priorityRect
        x: 0
        y: 0
        width: 14
        height: parent.height
        color: priority == 1 ? "#FF530D" : priority == 2 ? "#FFCF20" : "#339601"
    }

    Text {
        id: todoName
        x: 20
        y: 16
        width: 212
        height: 30
        font.pixelSize: 12
        text: name
        verticalAlignment: Text.AlignVCenter
        font.bold: true
    }
}