diff options
author | Topi Reinio <topi.reinio@digia.com> | 2014-09-24 14:37:46 +0200 |
---|---|---|
committer | Topi Reiniö <topi.reinio@digia.com> | 2014-09-30 12:37:28 +0200 |
commit | f83d12e0c27ad76d98d66a663140a09698b11d37 (patch) | |
tree | 6ce1e66cd651c8b325f5a6790ea036e7bbe62c47 /examples/quick/demos/calqlatr/content | |
parent | fccf0e29120f64a8b9b2a15b33971a648ab190e7 (diff) |
Update the Calqltr demo visuals and engine logic
- Add logic for displaying the calculation result in the best
available precision, determined by the display width
- Display 'ERROR' when the result cannot be displayed
- Animate the number pad button colors to react to presses and
visually disable them when pressing the button has no effect
- Fix issues in calculator.js logic
- Update documentation accordingly
Task-number: QTBUG-41253
Change-Id: Ibed7b8218ea4cd074b8f9b90d9bb4e3ea6b25ba2
Reviewed-by: Johanna Äijälä <johanna.aijala@digia.com>
Reviewed-by: Leena Miettinen <riitta-leena.miettinen@digia.com>
Reviewed-by: Venugopal Shivashankar <venugopal.shivashankar@digia.com>
Diffstat (limited to 'examples/quick/demos/calqlatr/content')
-rw-r--r-- | examples/quick/demos/calqlatr/content/Button.qml | 29 | ||||
-rw-r--r-- | examples/quick/demos/calqlatr/content/Display.qml | 61 | ||||
-rw-r--r-- | examples/quick/demos/calqlatr/content/NumberPad.qml | 18 | ||||
-rw-r--r-- | examples/quick/demos/calqlatr/content/calculator.js | 43 |
4 files changed, 113 insertions, 38 deletions
diff --git a/examples/quick/demos/calqlatr/content/Button.qml b/examples/quick/demos/calqlatr/content/Button.qml index fc6234414f..0748645274 100644 --- a/examples/quick/demos/calqlatr/content/Button.qml +++ b/examples/quick/demos/calqlatr/content/Button.qml @@ -41,12 +41,13 @@ import QtQuick 2.0 Item { + id: button property alias text: textItem.text - property alias color: textItem.color + property color color: "#eceeea" property bool operator: false - - signal clicked + property bool dimmable: false + property bool dimmed: false width: 30 height: 50 @@ -56,7 +57,18 @@ Item { font.pixelSize: 48 wrapMode: Text.WordWrap lineHeight: 0.75 - color: "white" + color: (dimmable && dimmed) ? Qt.darker(button.color) : button.color + Behavior on color { ColorAnimation { duration: 120; easing.type: Easing.OutElastic} } + states: [ + State { + name: "pressed" + when: mouse.pressed && !dimmed + PropertyChanges { + target: textItem + color: Qt.lighter(button.color) + } + } + ] } MouseArea { @@ -70,4 +82,13 @@ Item { window.digitPressed(parent.text) } } + + function updateDimmed() { + dimmed = window.isButtonDisabled(button.text) + } + + Component.onCompleted: { + numPad.buttonPressed.connect(updateDimmed) + updateDimmed() + } } diff --git a/examples/quick/demos/calqlatr/content/Display.qml b/examples/quick/demos/calqlatr/content/Display.qml index 97eed1e57e..efa7a1ab66 100644 --- a/examples/quick/demos/calqlatr/content/Display.qml +++ b/examples/quick/demos/calqlatr/content/Display.qml @@ -39,10 +39,16 @@ ****************************************************************************/ import QtQuick 2.0 +import QtQuick.Window 2.0 Item { id: display + property real fontSize: Math.floor(Screen.pixelDensity * 5.0) property bool enteringDigits: false + property int maxDigits: (width / fontSize) + 1 + property string displayedOperand + property string errorString: qsTr("ERROR") + property bool isError: displayedOperand === errorString function displayOperator(operator) { @@ -53,7 +59,8 @@ Item { function newLine(operator, operand) { - listView.model.append({ "operator": operator, "operand": operand }) + displayedOperand = displayNumber(operand) + listView.model.append({ "operator": operator, "operand": displayedOperand }) enteringDigits = false listView.positionViewAtEnd() } @@ -68,8 +75,16 @@ Item { listView.positionViewAtEnd() } + function setDigit(digit) + { + var i = listView.model.count - 1; + listView.model.get(i).operand = digit; + listView.positionViewAtEnd() + } + function clear() { + displayedOperand = "" if (enteringDigits) { var i = listView.model.count - 1 if (i >= 0) @@ -78,6 +93,42 @@ Item { } } + // Returns a string representation of a number that fits in + // display.maxDigits characters, trying to keep as much precision + // as possible. If the number cannot be displayed, returns an + // error string. + function displayNumber(num) { + if (typeof(num) != "number") + return errorString; + + var intNum = parseInt(num); + var intLen = intNum.toString().length; + + // Do not count the minus sign as a digit + var maxLen = num < 0 ? maxDigits + 1 : maxDigits; + + if (num.toString().length <= maxLen) { + if (isFinite(num)) + return num.toString(); + return errorString; + } + + // Integer part of the number is too long - try + // an exponential notation + if (intNum == num || intLen > maxLen - 3) { + var expVal = num.toExponential(maxDigits - 6).toString(); + if (expVal.length <= maxLen) + return expVal; + } + + // Try a float presentation with fixed number of digits + var floatStr = parseFloat(num).toFixed(maxDigits - intLen - 1).toString(); + if (floatStr.length <= maxLen) + return floatStr; + + return errorString; + } + Item { id: theItem width: parent.width + 32 @@ -121,16 +172,16 @@ Item { width: parent.width Text { id: operator - x: 8 - font.pixelSize: 18 + x: 6 + font.pixelSize: display.fontSize color: "#6da43d" text: model.operator } Text { id: operand - font.pixelSize: 18 + font.pixelSize: display.fontSize anchors.right: parent.right - anchors.rightMargin: 26 + anchors.rightMargin: 22 text: model.operand } } diff --git a/examples/quick/demos/calqlatr/content/NumberPad.qml b/examples/quick/demos/calqlatr/content/NumberPad.qml index c7f2680651..c4ae1bb582 100644 --- a/examples/quick/demos/calqlatr/content/NumberPad.qml +++ b/examples/quick/demos/calqlatr/content/NumberPad.qml @@ -45,6 +45,8 @@ Grid { columnSpacing: 32 rowSpacing: 16 + signal buttonPressed + Button { text: "7" } Button { text: "8" } Button { text: "9" } @@ -55,15 +57,15 @@ Grid { Button { text: "2" } Button { text: "3" } Button { text: "0" } - Button { text: "." } + Button { text: "."; dimmable: true } Button { text: " " } - Button { text: "±"; color: "#6da43d"; operator: true } - Button { text: "−"; color: "#6da43d"; operator: true } - Button { text: "+"; color: "#6da43d"; operator: true } - Button { text: "√"; color: "#6da43d"; operator: true } - Button { text: "÷"; color: "#6da43d"; operator: true } - Button { text: "×"; color: "#6da43d"; operator: true } + Button { text: "±"; color: "#6da43d"; operator: true; dimmable: true } + Button { text: "−"; color: "#6da43d"; operator: true; dimmable: true } + Button { text: "+"; color: "#6da43d"; operator: true; dimmable: true } + Button { text: "√"; color: "#6da43d"; operator: true; dimmable: true } + Button { text: "÷"; color: "#6da43d"; operator: true; dimmable: true } + Button { text: "×"; color: "#6da43d"; operator: true; dimmable: true } Button { text: "C"; color: "#6da43d"; operator: true } Button { text: " "; color: "#6da43d"; operator: true } - Button { text: "="; color: "#6da43d"; operator: true } + Button { text: "="; color: "#6da43d"; operator: true; dimmable: true } } diff --git a/examples/quick/demos/calqlatr/content/calculator.js b/examples/quick/demos/calqlatr/content/calculator.js index 906cb9d3b7..841ba9414c 100644 --- a/examples/quick/demos/calqlatr/content/calculator.js +++ b/examples/quick/demos/calqlatr/content/calculator.js @@ -38,7 +38,6 @@ ** ****************************************************************************/ - var curVal = 0 var memory = 0 var lastOp = "" @@ -46,9 +45,13 @@ var previousOperator = "" var digits = "" function disabled(op) { - if (op == "." && digits.toString().search(/\./) != -1) { + if (digits == "" && !((op >= "0" && op <= "9") || op == ".")) + return true + else if (op == '=' && previousOperator.length != 1) return true - } else if (op == window.squareRoot && digits.toString().search(/-/) != -1) { + else if (op == "." && digits.toString().search(/\./) != -1) { + return true + } else if (op == "√" && digits.toString().search(/-/) != -1) { return true } else { return false @@ -59,7 +62,7 @@ function digitPressed(op) { if (disabled(op)) return - if (digits.toString().length >= 8) + if (digits.toString().length >= display.maxDigits) return if (lastOp.toString().length == 1 && ((lastOp >= "0" && lastOp <= "9") || lastOp == ".") ) { digits = digits + op.toString() @@ -77,6 +80,12 @@ function operatorPressed(op) return lastOp = op + if (op == "±") { + digits = Number(digits.valueOf() * -1) + display.setDigit(display.displayNumber(digits)) + return + } + if (previousOperator == "+") { digits = Number(digits.valueOf()) + Number(curVal.valueOf()) } else if (previousOperator == "−") { @@ -85,7 +94,6 @@ function operatorPressed(op) digits = Number(curVal) * Number(digits.valueOf()) } else if (previousOperator == "÷") { digits = Number(curVal) / Number(digits.valueOf()) - } else if (previousOperator == "=") { } if (op == "+" || op == "−" || op == "×" || op == "÷") { @@ -97,10 +105,7 @@ function operatorPressed(op) } if (op == "=") { - if (digits.toString().length >= 9) - digits = digits.toExponential(2) - - display.newLine("=", digits.toString()) + display.newLine("=", digits.valueOf()) } curVal = 0 @@ -114,12 +119,9 @@ function operatorPressed(op) digits = (Math.abs(digits.valueOf())).toString() } else if (op == "Int") { digits = (Math.floor(digits.valueOf())).toString() - } else if (op == "±") { - digits = (digits.valueOf() * -1).toString() - display.clear() - display.appendDigit(digits) } else if (op == "√") { - digits = (Math.sqrt(digits.valueOf())).toString() + digits = Number(Math.sqrt(digits.valueOf())) + display.newLine("√", digits.valueOf()) } else if (op == "mc") { memory = 0; } else if (op == "m+") { @@ -134,17 +136,16 @@ function operatorPressed(op) display.appendDigit(digits) } else if (op == "Off") { Qt.quit(); - } else if (op == "C") { + } + + // Reset the state on 'C' operator or after + // an error occurred + if (op == "C" || display.isError) { display.clear() curVal = 0 memory = 0 lastOp = "" - digits ="0" - } else if (op == "AC") { - curVal = 0 - memory = 0 - lastOp = "" - digits ="0" + digits = "" } } |