wangfei9618 |
2016-07-29 23:13 |
关于QT5.7.0基础代码QML Jeff
大家可以运行一下,我是菜鸟 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
|
|