examples/fixtures/main.qml

0001 import QtQuick 2.2
0002 import Box2D 2.0
0003 import "../shared"
0004
0005 Rectangle {
0006     id: screen
0007
0008     width: 800
0009     height: 600
0010
0011     Component {
0012         id: ballComponent
0013         Rectangle {
0014             id: ball
0015
0016             width: 20
0017             height: 20
0018             radius: 10
0019             border.color: "blue"
0020             color: "#EFEFEF"
0021
0022             CircleBody {
0023                 target: ball
0024                 world: physicsWorld
0025
0026                 bodyType: Body.Dynamic
0027
0028                 radius: ball.width / 2
0029                 density: 0.1
0030                 friction: 0.3
0031                 restitution: 0.5
0032             }
0033         }
0034     }
0035
0036     Text {
0037         width: parent.width
0038         y:50
0039         text: "Fixtures tests"
0040         height: 30
0041         font.pixelSize: 16
0042         horizontalAlignment: Text.AlignHCenter
0043     }
0044
0045     World { id: physicsWorld }
0046
0047     PhysicsItem {
0048         function getVertices(height) {
0049             var pos = height;
0050             var arr = [];
0051             arr.push(Qt.point(0,0));
0052             arr.push(Qt.point(height,0));
0053             while (pos < 700) {
0054                 var y = Math.round(Math.random() * height);
0055                 var x = Math.round(20 + Math.random() * 40);
0056                 pos += x;
0057                 arr.push(Qt.point(pos,y));
0058             }
0059             arr.push(Qt.point(760,0));
0060             arr.push(Qt.point(800,0));
0061             arr.push(Qt.point(800,height));
0062             arr.push(Qt.point(0,height));
0063             return arr;
0064         }
0065         height: 40
0066         anchors.bottom: parent.bottom
0067         anchors.left: parent.left
0068         anchors.right: parent.right
0069         z: 100
0070         id: ground
0071         fixtures: Chain {
0072             id: groundShape
0073             vertices: ground.getVertices(ground.height)
0074             loop: true
0075         }
0076         Canvas {
0077             id: groundCanvas
0078             anchors.fill: parent
0079             onPaint: {
0080                 var context = groundCanvas.getContext("2d");
0081                 context.beginPath();
0082                 context.moveTo(0,0);
0083                 var points = groundShape.vertices;
0084                 for (var i = 1; i < points.length; i++) {
0085                     var point = points[i];
0086                     var x = point.x;
0087                     var y = point.y;
0088                     context.lineTo(x,y);
0089                 }
0090                 context.fillStyle = "#000000";
0091                 context.fill();
0092             }
0093         }
0094     }
0095
0096     Wall {
0097         id: topWall
0098         height: 40
0099         anchors {
0100             left: parent.left
0101             right: parent.right
0102             top: parent.top
0103         }
0104     }
0105
0106     Wall {
0107         id: leftWall
0108         width: 40
0109         anchors {
0110             left: parent.left
0111             top: parent.top
0112             bottom: parent.bottom
0113             bottomMargin: 40
0114         }
0115     }
0116
0117     Wall {
0118         id: rightWall
0119         width: 40
0120         anchors {
0121             right: parent.right
0122             top: parent.top
0123             bottom: parent.bottom
0124             bottomMargin: 40
0125         }
0126     }
0127
0128     PhysicsItem {
0129         id: dynamicTest
0130         x: 200
0131         y: 150
0132         width: 200
0133         height: 30
0134         fixtures: [
0135             Box {
0136                 x: 0
0137                 y: 0
0138                 width: dynamicTest.width * 0.45
0139                 height: dynamicTest.height
0140             },
0141             Box {
0142                 x: dynamicTest.width * 0.55
0143                 y: 0
0144                 width: dynamicTest.width * 0.45
0145                 height: dynamicTest.height
0146             }
0147         ]
0148         Rectangle {
0149             anchors.fill: parent
0150             color: "blue"
0151         }
0152     }
0153
0154     PhysicsItem {
0155         id: staticTest
0156         x: 350
0157         y: 250
0158         width: 100
0159         height: 25
0160         fixtures: Box {
0161             x: 0
0162             y: 0
0163             width: 100
0164             height: 25
0165         }
0166         Rectangle {
0167             anchors.fill: parent
0168             color: "orange"
0169         }
0170     }
0171
0172     PhysicsItem {
0173         id: radiusTest
0174         bodyType: Body.Dynamic
0175         x: 600
0176         y: 100
0177         fixtures: [
0178             Circle {
0179                 id: circleShape
0180                 radius: 50
0181                 x: -circleShape.radius
0182                 y: -circleShape.radius
0183                 density: 0.9
0184                 friction: 0.3
0185                 restitution: 0.8
0186             }
0187         ]
0188         Rectangle {
0189             width: circleShape.radius * 2
0190             height: circleShape.radius * 2
0191             anchors.centerIn: parent
0192             radius: circleShape.radius
0193             color: "red"
0194         }
0195     }
0196
0197     PhysicsItem {
0198         id: polygonTest
0199         world: physicsWorld
0200         bodyType: Body.Dynamic
0201         x: 450
0202         y: 50
0203         width: 100
0204         height: 100
0205         fixtures: Polygon {
0206             vertices: [
0207                 Qt.point(polygonTest.width / 2,0),
0208                 Qt.point(polygonTest.width,polygonTest.height),
0209                 Qt.point(0,polygonTest.height)
0210             ]
0211             density: 0.9
0212             friction: 0.3
0213             restitution: 0.8
0214         }
0215         Canvas {
0216             id: canvas
0217             anchors.fill: parent
0218             onPaint: {
0219                 var context = canvas.getContext("2d");
0220                 context.beginPath();
0221                 context.moveTo(parent.width / 2,0);
0222                 context.lineTo(0,parent.height);
0223                 context.lineTo(parent.width,parent.height);
0224                 context.lineTo(parent.width / 2,0);
0225                 context.fillStyle = "green";
0226                 context.fill();
0227             }
0228         }
0229     }
0230
0231     Rectangle {
0232         id: ballsButton
0233         x: 50
0234         y: 100
0235         width: 120
0236         height: 30
0237         Text {
0238             text: "Falling balls"
0239             anchors.centerIn: parent
0240         }
0241         color: "#DEDEDE"
0242         border.color: "#999"
0243         radius: 5
0244         MouseArea {
0245             anchors.fill: parent
0246             onClicked: {
0247                 ballsTimer.running = !ballsTimer.running;
0248             }
0249         }
0250     }
0251
0252     Text {
0253         id: ballsCounter
0254         x: 200
0255         y: 100
0256         height: 30
0257         width: 50
0258         font.pixelSize: 13
0259         horizontalAlignment: Text.AlignLeft
0260         verticalAlignment: Text.AlignVCenter
0261         property int count: 0
0262         text: count + " balls"
0263     }
0264
0265     Timer {
0266         id: ballsTimer
0267         interval: 200
0268         running: false
0269         repeat: true
0270         onTriggered: {
0271             var newBox = ballComponent.createObject(screen);
0272             newBox.x = 40 + (Math.random() * screen.width - 80);
0273             newBox.y = 50;
0274             ballsCounter.count ++;
0275         }
0276     }
0277
0278     Rectangle {
0279         id: dynamicTestButton
0280         x: 50
0281         y: 140
0282         width: 120
0283         height: 30
0284         Text {
0285             text: "Dynamic fixtures"
0286             anchors.centerIn: parent
0287         }
0288         color: "#DEDEDE"
0289         border.color: "#999"
0290         radius: 5
0291         MouseArea {
0292             anchors.fill: parent
0293             onClicked: {
0294                 if(dynamicTest.width == 300)
0295                 {
0296                     dynamicTest.width = 200
0297                     dynamicTest.height = 30
0298                 }
0299                 else
0300                 {
0301                     dynamicTest.width = 300
0302                     dynamicTest.height = 50
0303                 }
0304             }
0305         }
0306
0307     }
0308
0309     Rectangle {
0310         id: staticTestButton
0311         x: 50
0312         y: 180
0313         width: 120
0314         height: 30
0315         Text {
0316             text: "Static fixture"
0317             anchors.centerIn: parent
0318         }
0319         color: "#DEDEDE"
0320         border.color: "#999"
0321         radius: 5
0322         MouseArea {
0323             anchors.fill: parent
0324             onClicked: {
0325                 if(staticTest.width == 200)
0326                 {
0327                     staticTest.width = 100
0328                     staticTest.height = 25
0329                 }
0330                 else
0331                 {
0332                     staticTest.width = 200
0333                     staticTest.height = 50
0334                 }
0335             }
0336         }
0337
0338     }
0339     Rectangle {
0340         id: radiusTestButton
0341         x: 50
0342         y: 220
0343         width: 120
0344         height: 30
0345         Text {
0346             text: "Circle"
0347             anchors.centerIn: parent
0348         }
0349         color: "#DEDEDE"
0350         border.color: "#999"
0351         radius: 5
0352         MouseArea {
0353             anchors.fill: parent
0354             onClicked: {
0355                 if (circleShape.radius == 75)
0356                     circleShape.radius = 50
0357                 else
0358                     circleShape.radius = 75
0359             }
0360         }
0361     }
0362
0363     Rectangle {
0364         id: polygonTestButton
0365         x: 50
0366         y: 260
0367         width: 120
0368         height: 30
0369         Text {
0370             text: "Polygon"
0371             anchors.centerIn: parent
0372         }
0373         color: "#DEDEDE"
0374         border.color: "#999"
0375         radius: 5
0376         MouseArea {
0377             anchors.fill: parent
0378             onClicked: {
0379                 if(polygonTest.height == 100 && polygonTest.width == 100)
0380                     polygonTest.height = 200;
0381                 else if(polygonTest.height == 200 && polygonTest.width == 100)
0382                     polygonTest.width = 200;
0383                 else
0384                 {
0385                     polygonTest.height = 100;
0386                     polygonTest.width = 100;
0387                 }
0388             }
0389         }
0390     }
0391
0392     Rectangle {
0393         id: chainTestButton
0394         x: 50
0395         y: 300
0396         width: 120
0397         height: 30
0398         Text {
0399             text: "Chain"
0400             anchors.centerIn: parent
0401         }
0402         color: "#DEDEDE"
0403         border.color: "#999"
0404         radius: 5
0405         MouseArea {
0406             anchors.fill: parent
0407             onClicked: {
0408                 if (ground.height == 40)
0409                     ground.height = 100
0410                 else
0411                     ground.height = 40
0412             }
0413         }
0414     }
0415
0416     Rectangle {
0417         id: debugButton
0418         x: 50
0419         y: 50
0420         width: 120
0421         height: 30
0422         Text {
0423             text: debugDraw.visible ? "Debug view: on" : "Debug view: off"
0424             anchors.centerIn: parent
0425         }
0426         color: "#DEDEDE"
0427         border.color: "#999"
0428         radius: 5
0429         MouseArea {
0430             anchors.fill: parent
0431             onClicked: debugDraw.visible = !debugDraw.visible
0432         }
0433     }
0434
0435     DebugDraw {
0436         id: debugDraw
0437         anchors.fill: parent
0438         world: physicsWorld
0439         opacity: 1
0440         visible: false
0441     }
0442 }