1/**************************************************************************** 2** 3** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies). 4** Contact: http://www.qt-project.org/legal 5** 6** This file is part of the examples of the Qt Toolkit. 7** 8** $QT_BEGIN_LICENSE:BSD$ 9** You may use this file under the terms of the BSD license as follows: 10** 11** "Redistribution and use in source and binary forms, with or without 12** modification, are permitted provided that the following conditions are 13** met: 14** * Redistributions of source code must retain the above copyright 15** notice, this list of conditions and the following disclaimer. 16** * Redistributions in binary form must reproduce the above copyright 17** notice, this list of conditions and the following disclaimer in 18** the documentation and/or other materials provided with the 19** distribution. 20** * Neither the name of Digia Plc and its Subsidiary(-ies) nor the names 21** of its contributors may be used to endorse or promote products derived 22** from this software without specific prior written permission. 23** 24** 25** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS 26** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT 27** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR 28** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT 29** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, 30** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT 31** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, 32** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY 33** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 34** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 35** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." 36** 37** $QT_END_LICENSE$ 38** 39****************************************************************************/ 40 41import QtQuick 2.0 42import "../contents" 43Item { 44 id:container 45 width:320 46 height:480 47 48 Column { 49 spacing:5 50 anchors.fill:parent 51 Text { font.pointSize:15; text:"Rounded rectangle"; anchors.horizontalCenter:parent.horizontalCenter} 52 Canvas { 53 id:canvas 54 width:320 55 height:280 56 antialiasing: true 57 58 property int radius: rCtrl.value 59 property int rectx: rxCtrl.value 60 property int recty: ryCtrl.value 61 property int rectWidth: width - 2*rectx 62 property int rectHeight: height - 2*recty 63 property string strokeStyle:"blue" 64 property string fillStyle:"steelblue" 65 property int lineWidth:lineWidthCtrl.value 66 property bool fill:true 67 property bool stroke:true 68 property real alpha:alphaCtrl.value 69 70 onLineWidthChanged:requestPaint(); 71 onFillChanged:requestPaint(); 72 onStrokeChanged:requestPaint(); 73 onRadiusChanged:requestPaint(); 74 onRectxChanged:requestPaint(); 75 onRectyChanged:requestPaint(); 76 onAlphaChanged:requestPaint(); 77 78 onPaint: { 79 var ctx = getContext("2d"); 80 ctx.save(); 81 ctx.clearRect(0,0,canvas.width, canvas.height); 82 ctx.strokeStyle = canvas.strokeStyle; 83 ctx.lineWidth = canvas.lineWidth 84 ctx.fillStyle = canvas.fillStyle 85 ctx.globalAlpha = canvas.alpha 86 ctx.beginPath(); 87 ctx.moveTo(rectx+radius,recty); // top side 88 ctx.lineTo(rectx+rectWidth-radius,recty); 89 // draw top right corner 90 ctx.arcTo(rectx+rectWidth,recty,rectx+rectWidth,recty+radius,radius); 91 ctx.lineTo(rectx+rectWidth,recty+rectHeight-radius); // right side 92 // draw bottom right corner 93 ctx.arcTo(rectx+rectWidth,recty+rectHeight,rectx+rectWidth-radius,recty+rectHeight,radius); 94 ctx.lineTo(rectx+radius,recty+rectHeight); // bottom side 95 // draw bottom left corner 96 ctx.arcTo(rectx,recty+rectHeight,rectx,recty+rectHeight-radius,radius); 97 ctx.lineTo(rectx,recty+radius); // left side 98 // draw top left corner 99 ctx.arcTo(rectx,recty,rectx+radius,recty,radius); 100 ctx.closePath(); 101 if (canvas.fill) 102 ctx.fill(); 103 if (canvas.stroke) 104 ctx.stroke(); 105 ctx.restore(); 106 } 107 } 108 109 Rectangle { 110 id:controls 111 width:320 112 height:150 113 Column { 114 spacing:3 115 Slider {id:lineWidthCtrl; width:300; height:20; min:1; max:10; init:2; name:"Line width"} 116 Slider {id:rxCtrl; width:300; height:20; min:5; max:30; init:10; name:"rectx"} 117 Slider {id:ryCtrl; width:300; height:20; min:5; max:30; init:10; name:"recty"} 118 Slider {id:rCtrl; width:300; height:20; min:10; max:100; init:40; name:"Radius"} 119 Slider {id:alphaCtrl; width:300; height:20; min:0; max:1; init:1; name:"Alpha"} 120 } 121 } 122 } 123} 124