demos/declarative/calculator/calculator.qml
changeset 37 758a864f9613
parent 33 3e2da88830cd
equal deleted inserted replaced
36:ef0373b55136 37:758a864f9613
    56     property string multiplication : "\u00d7"
    56     property string multiplication : "\u00d7"
    57     property string squareRoot : "\u221a"
    57     property string squareRoot : "\u221a"
    58     property string plusminus : "\u00b1"
    58     property string plusminus : "\u00b1"
    59 
    59 
    60     function doOp(operation) { CalcEngine.doOperation(operation) }
    60     function doOp(operation) { CalcEngine.doOperation(operation) }
    61     
    61 
    62     Item {
    62     Item {
    63         id: main
    63         id: main
    64         state: "orientation " + runtime.orientation
    64         state: "orientation " + runtime.orientation
    65 
    65 
    66         width: parent.width; height: parent.height; anchors.centerIn: parent
    66         width: parent.width; height: parent.height; anchors.centerIn: parent
    68         Column {
    68         Column {
    69             id: box; spacing: 8
    69             id: box; spacing: 8
    70 
    70 
    71             anchors { fill: parent; topMargin: 6; bottomMargin: 6; leftMargin: 6; rightMargin: 6 }
    71             anchors { fill: parent; topMargin: 6; bottomMargin: 6; leftMargin: 6; rightMargin: 6 }
    72 
    72 
    73             Row {
    73             Display {
    74                 Display { id: display; width: box.width; height: 64 }
    74                 id: display
       
    75                 width: box.width-3
       
    76                 height: 64
    75             }
    77             }
    76 
    78 
    77             Column {
    79             Column {
    78                 id: column; spacing: 6
    80                 id: column; spacing: 6
    79 
    81 
    80                 property real h: ((box.height - 72) / 6) - ((spacing * (6 - 1)) / 6)
    82                 property real h: ((box.height - 72) / 6) - ((spacing * (6 - 1)) / 6)
    81                 property real w: (box.width / 4) - ((spacing * (4 - 1)) / 4)
    83                 property real w: (box.width / 4) - ((spacing * (4 - 1)) / 4)
    82 
    84 
    83                 Row {
    85                 Row {
    84                     spacing: 6
    86                     spacing: 6
    85 
    87                     Button { width: column.w; height: column.h; color: 'purple'; operation: "Off" }
    86                     Button {
       
    87                         id: rotateButton
       
    88                         width: column.w; height: column.h; color: 'purple'; operation: rotateLeft
       
    89                     }
       
    90                     Button { width: column.w; height: column.h; color: 'purple'; operation: leftArrow }
    88                     Button { width: column.w; height: column.h; color: 'purple'; operation: leftArrow }
    91                     Button { width: column.w; height: column.h; color: 'purple'; operation: "C" }
    89                     Button { width: column.w; height: column.h; color: 'purple'; operation: "C" }
    92                     Button { width: column.w; height: column.h; color: 'purple'; operation: "AC" }
    90                     Button { width: column.w; height: column.h; color: 'purple'; operation: "AC" }
    93                 }
    91                 }
    94 
    92 
   101                     Button { width: column.w; height: column.h; color: 'green'; operation: "m-" }
    99                     Button { width: column.w; height: column.h; color: 'green'; operation: "m-" }
   102                     Button { width: column.w; height: column.h; color: 'green'; operation: "mr" }
   100                     Button { width: column.w; height: column.h; color: 'green'; operation: "mr" }
   103                 }
   101                 }
   104 
   102 
   105                 Grid {
   103                 Grid {
   106                     id: grid; rows: 4; columns: 5; spacing: 6
   104                     id: grid; rows: 5; columns: 5; spacing: 6
   107 
   105 
   108                     property real w: (box.width / columns) - ((spacing * (columns - 1)) / columns)
   106                     property real w: (box.width / columns) - ((spacing * (columns - 1)) / columns)
   109 
   107 
   110                     Button { width: grid.w; height: column.h; operation: "7"; color: 'blue' }
   108                     Button { width: grid.w; height: column.h; operation: "7"; color: 'blue' }
   111                     Button { width: grid.w; height: column.h; operation: "8"; color: 'blue' }
   109                     Button { width: grid.w; height: column.h; operation: "8"; color: 'blue' }
   132         }
   130         }
   133 
   131 
   134         states: [
   132         states: [
   135             State {
   133             State {
   136                 name: "orientation " + Orientation.Landscape
   134                 name: "orientation " + Orientation.Landscape
   137                 PropertyChanges { target: main; rotation: -90; width: window.height; height: window.width }
   135                 PropertyChanges { target: main; rotation: 90; width: window.height; height: window.width }
       
   136                 PropertyChanges { target: rotateButton; operation: rotateLeft }
       
   137             },
       
   138             State {
       
   139                 name: "orientation " + Orientation.PortraitInverted
       
   140                 PropertyChanges { target: main; rotation: 180; }
   138                 PropertyChanges { target: rotateButton; operation: rotateRight }
   141                 PropertyChanges { target: rotateButton; operation: rotateRight }
   139             },
   142             },
   140             State {
   143             State {
   141                 name: "orientation " + Orientation.PortraitInverted
   144                 name: "orientation " + Orientation.LandscapeInverted
   142                 PropertyChanges { target: main; rotation: -180; }
   145                 PropertyChanges { target: main; rotation: 270; width: window.height; height: window.width }
   143                 PropertyChanges { target: rotateButton; operation: rotateLeft }
   146                 PropertyChanges { target: rotateButton; operation: rotateLeft }
   144             },
       
   145             State {
       
   146                 name: "orientation " + Orientation.LandscapeInverted
       
   147                 PropertyChanges { target: main; rotation: -270; width: window.height; height: window.width }
       
   148                 PropertyChanges { target: rotateButton; operation: rotateRight }
       
   149             }
   147             }
   150         ]
   148         ]
   151 
   149 
   152         transitions: Transition {
   150         transitions: Transition {
   153             SequentialAnimation {
   151             SequentialAnimation {