• 5000阅读
  • 2回复

关于QT5.7.0基础代码QML Jeff [复制链接]

上一主题 下一主题
离线wangfei9618
 

只看楼主 倒序阅读 楼主  发表于: 2016-07-29
— 本帖被 XChinux 执行加亮操作(2016-08-15) —
大家可以运行一下,我是菜鸟
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Controls.Styles 1.2
import QtQuick.Layouts 1.1
import QtQuick.Dialogs 1.1
Rectangle {
    id: rectangleWindowView;
    visible: true;
    width: 1000;
    height: 618;
    color: "#EEE9E9";
    property  bool flag: false;
    property  real radiobuttonFlage;
    property  int  cbxFlage;
    function hiddenOrDisplay(flag){
        if(!flag){
            btnDisplayOrHidden.text = qsTr("Hidden");
        }
        else{
            btnDisplayOrHidden.text = qsTr("display");
        }
    }
    function backgroundColor(flag){
        if(!flag){
            rectangleWindowView.color = "#E0FFFF";
            rectangleDrawArea.color = "#AAAAAA";
            rectangleFunctionArea.color ="#F0F8FF";
            rectangleDrawArea.border.color = "#5CACEE";
            rectangleFunctionArea.border.color = "#5CACEE";
            txtMode.color = "#9F79EE";
            txtWidth.color = "#9F79EE";
            txtHeight.color = "#9F79EE";
        }
        else{
            rectangleWindowView.color = "#EEE9E9";
            rectangleDrawArea.color = "#EBEBEB";
            rectangleFunctionArea.color ="#EBEBEB";
            rectangleDrawArea.border.color = "#AAAAAA";
            rectangleFunctionArea.border.color = "#AAAAAA";
            txtMode.color = "#black";
            txtWidth.color = "#black";
            txtHeight.color = "#black";
        }
    }
    function cbxSelectArea(){
        cbxFlage = cbxSelecting.currentIndex;
    }
    GridLayout {
        anchors.left: parent.left;
        anchors.leftMargin: 2;
        anchors.top: parent.top;
        anchors.bottomMargin: 5;
        width: 1000;
        height: 618;
        rows: 1;
        columns: 2;
        rowSpacing: 4;
        columnSpacing: 5;
        flow: GridLayout.TopToBottom;
        Rectangle {
            id: rectangleDrawArea;
            anchors.left: parent.left;
            anchors.leftMargin: 4;
            anchors.top: parent.top;
            anchors.topMargin: 5;
            width: 750;
            height: 608;
            color: "#EBEBEB";
            border.width: 2;
            border.color: "#AAAAAA";
            Canvas {
                id: canvasRectangle;
                anchors.fill: rectangleDrawArea;
                property real shapeX : -50;
                property real shapeY : -50;
                property real shapeWidth ;
                property real shapeHeight ;
                onPaint: {
                    switch(radiobuttonFlage){
                    case 0:
                        var ctx =getContext("2d");
                        ctx.fillStyle = "red";
                        ctx.linewidth = 2;
                        ctx.beginPath();
                        ctx.rect(shapeX,shapeY,shapeWidth,shapeHeight);
                        ctx.fill();
                        ctx.stroke();
                        break;
                    case 1:
                        var ctx1 =getContext("2d");
                        ctx1.fillStyle = "blue";
                        ctx1.linewidth = 2;
                        ctx1.beginPath();
                        ctx1.ellipse(shapeX,shapeY,shapeWidth,shapeHeight);
                        ctx1.fill();
                        ctx1.stroke();
                        break;
                    case 2:
                        var ctx2 =getContext("2d");
                        ctx2.fillStyle = "green"
                        ctx2.linewidth = 2;
                        ctx2.beginPath();
                        ctx2.moveTo(shapeWidth/2 + shapeX,shapeY);
                        ctx2.lineTo(shapeWidth + shapeX,shapeHeight + shapeY);
                        ctx2.lineTo(shapeX,shapeHeight + shapeY);
                        ctx2.closePath();
                        ctx2.fill;
                        ctx2.stroke();
                        break;
                    }
                }
                MouseArea {
                    id: mouseAreaClicked;
                    anchors.fill: parent;
                    onPressed: {
                        if(cbxFlage == 1){
                                canvasRectangle.shapeX = mouseX;
                                canvasRectangle.shapeY = mouseY;
                                canvasRectangle.shapeWidth = textfieldWidth.displayText;
                                canvasRectangle.shapeHeight = textfieldHeight.displayText;
                        }
                    }
                    onPositionChanged: {
                        canvasRectangle.requestPaint();
                    }
                }//End of mouseAreaClicked
            }// End of canvasRectangle
        }// End of rectangleDrawArea
        Rectangle {
            id: rectangleFunctionArea;
            anchors.left: rectangleDrawArea.right;
            anchors.leftMargin: 4;
            anchors.top: rectangleDrawArea.top;
            width: 235;
            height: 608;
            color: "#EBEBEB";
            border.width: 2;
            border.color: "#AAAAAA";
            property  bool flag: false;
            function hiddenOrDisplay(flag){
                if(!flag){
                    display.text = qsTr("Hidden");
                }
                else{
                    display.text = qsTr("display");
                }
            }
            ComboBox {
                id: cbxSelecting;
                currentIndex: 0;
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 10;
                anchors.right: rectangleFunctionArea.right;
                anchors.rightMargin: 20;
                width: 110;
                model: ["View","Add","Remove"];
                onCurrentIndexChanged: cbxSelectArea();
            }
            Text {
                id:txtMode;
                anchors.left: rectangleFunctionArea.left;
                anchors.leftMargin: 30;
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 20;
                color: "black";
                text: qsTr("Mode  :");
                font.pixelSize: 16;
            }

            Text {
                id: txtWidth;
                anchors.left: rectangleFunctionArea.left;
                anchors.leftMargin: 30;
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 70;
                color: "black";
                text: qsTr("Width :");
                font.pixelSize: 16;
            }
            TextField {
                id: textfieldWidth;
                validator: IntValidator{ top: 100; bottom: 0}
                anchors.right: rectangleFunctionArea.right;
                anchors.rightMargin: 20;
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 70;
                placeholderText: "20";
                width: 110;
                height: 25;
            }
            Text {
                id: txtHeight;
                anchors.left: rectangleFunctionArea.left;
                anchors.leftMargin: 30;
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 100;
                color: "black";
                text: qsTr("Heigth:");
                font.pixelSize: 16;
            }
            TextField {
                id: textfieldHeight;
                validator: IntValidator{ top: 100; bottom: 0}
                anchors.right: rectangleFunctionArea.right;
                anchors.rightMargin: 20;
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 100;
                placeholderText: "20";
                width: 110;
                height: 25;
            }
            GroupBox {
                id: gbxGroup ;
                title: "please choose a shapes!";
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin:  150;
                anchors.left: rectangleFunctionArea.left;
                anchors.leftMargin: 30;
                width: 185;
                height: 180;
                Column {
                    RadioButton {
                        id: radiobuttonSquare;
                        text: qsTr("Rectangle");
                        checked: true;
                        onClicked: radiobuttonFlage = 0;
                    }
                    RadioButton {
                        id:radiobuttonTriangle;
                        text: qsTr("Ellipse");
                        onClicked: radiobuttonFlage = 1;
                    }
                    RadioButton {
                        id:radiobuttonEllipse;
                        text: qsTr("Triangle");
                        onClicked: radiobuttonFlage = 2;
                    }
                }//End of Column
            }//End of GroupBox
            Button {
                id: btnDisplayOrHidden;
                text:qsTr("Display")
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 350;
                anchors.right: rectangleFunctionArea.right;
                anchors.rightMargin: 20;
                width: 85;
                onClicked: {
                    hiddenOrDisplay(flag);
                    flag = !flag;
                }
            }
            Button {
                id: btnChangeStyle;
                text:qsTr("Style")
                anchors.top: rectangleFunctionArea.top;
                anchors.topMargin: 350;
                anchors.left: rectangleFunctionArea.left;
                anchors.leftMargin: 30;
                width: 85;
            }
            Connections {
                target: btnChangeStyle;
                onClicked: {
                    backgroundColor(flag);
                    flag = ! flag;
                }
            }
        }//End  of rectangleFunctionArea
    }//End of  the first GridLayout
}//End of ALL
离线cycloveu

只看该作者 1楼 发表于: 2016-08-04
没有截图啊
大道至简 悟在天成
离线shaoxie1986

只看该作者 2楼 发表于: 2016-08-12
这个基础代码亮点在哪?和之前的版本有什么差异?
快速回复
限100 字节
 
上一个 下一个