meegim/qml/DialogSmiles.qml

import QtQuick 1.1

DialogLiquid {
    id: dlgSmiles

    signal clickedOk
    signal clickedCancel

    property string title: ""
    property int fontTitleSize: 24

    width: parent.width*0.9
    height: parent.height*0.4

    color: "white"
    border.color: "gray"
    border.width: 3
    smooth: true

    property alias smilesModel: smilesGrid.model
    signal smileSelected()
    property string selectedSmile: ""
    /****************************************************/

    GridView {
        id: smilesGrid
        clip: true
        anchors.top: parent.top
        anchors.left: parent.left
        height: parent.height
        width: parent.width
        delegate: componentSmileWrapper
        cellWidth: screen.orientationString == "Landscape" || screen.orientationString == "LandscapeInverted" ? 0.8*parent.width/8 : 0.8*parent.width/4
        cellHeight: cellWidth
    }

    Component {
        id: componentSmileWrapper
        Rectangle {
            id: smileWrapper
            color: "transparent"
            height: smilesGrid.cellHeight
            width: smilesGrid.cellWidth
            Image {
                id: imgSmile
                anchors.centerIn: parent
                height: parent.height*0.6
                width: parent.width*0.6
                smooth: true
                source: "file://" + smilePicture
            }
            MouseArea {
                id: ma
                anchors.fill: parent
                onClicked: {
                    dlgSmiles.selectedSmile = smileText
                    dlgSmiles.smileSelected()
                    animSelectedSmile.start()
                }
            }
            SequentialAnimation {
                id: animSelectedSmile
                ParallelAnimation {
                    NumberAnimation {
                        target: imgSmile;
                        property: "scale";
                        from: 1; to: 2
                        duration: 300;
                        easing.type: Easing.InOutQuad
                    }
                    NumberAnimation {
                        target: imgSmile;
                        property: "opacity";
                        from: 1; to: 0.1
                        duration: 300;
                        easing.type: Easing.InOutQuad
                    }
                }
                ScriptAction {
                    script: {
                        dlgSmiles.state = "hidden"
                        imgSmile.scale = 1
                        imgSmile.opacity = 1
                    }
                }
            }
        }
    }

}