Results 1 to 11 of 11

Thread: How to perform calculator functions in qt qml?

  1. #1
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Post How to perform calculator functions in qt qml?

    Hi all,
    I am new to qml and i am trying an application based on calculator.

    I am trying to perform addition in qml but i was not able to do with it.

    From my coding the output is displayed with the first input i give....

    For example:for adding two numbers->i am entering "2" in the first input and clicked on "+" button and entering the second input as "6" and when clicked on "=" i am getting the final output as "2".....


    Here is my code:

    javascript Code:
    1. import QtQuick 1.0
    2. import com.nokia.symbian 1.0
    3.  
    4. Page {
    5. id: mainPage
    6.  
    7. property string i;
    8. property string a;
    9. property string b;
    10. property string c;
    11. Button {
    12. id: button13
    13. x: 76
    14. y: 447
    15. text: "0"
    16. onClicked: {
    17. i = text
    18. t.text = t.text + i
    19.  
    20. }
    21. }
    22.  
    23. Button {
    24. id: button15
    25. x: 76
    26. y: 375
    27. text: "1"
    28. onClicked: {
    29. i = text
    30. t.text = t.text + i
    31. }
    32. }
    33.  
    34. Button {
    35. id: button2
    36. x: 136
    37. y: 375
    38. text: "2"
    39. onClicked: {
    40. i = text
    41. t.text = t.text + i
    42. }
    43. }
    44.  
    45. Button {
    46. id: button3
    47. x: 203
    48. y: 375
    49. text: "3"
    50.  
    51. onClicked: {
    52.  
    53. i = text
    54. t.text = t.text + i
    55.  
    56. }
    57. }
    58.  
    59.  
    60.  
    61. Button {
    62. id: button5
    63. x: 76
    64. y: 299
    65. text: "4"
    66. onClicked: {
    67. i = text
    68. t.text = t.text + i
    69.  
    70. }
    71. }
    72.  
    73. Button {
    74. id: button6
    75. x: 136
    76. y: 299
    77. text: "5"
    78. onClicked: {
    79.  
    80. i = text
    81. t.text = t.text + i
    82.  
    83. }
    84. }
    85.  
    86. Button {
    87. id: button7
    88. x: 203
    89. y: 299
    90. text: "6"
    91. onClicked: {
    92.  
    93. i = text
    94. t.text = t.text + i
    95. }
    96. }
    97.  
    98.  
    99.  
    100. Button {
    101. id: button9
    102. x: 76
    103. y: 235
    104. text: "7"
    105. onClicked: {
    106. i = text
    107. t.text = t.text + i
    108.  
    109.  
    110. }
    111. }
    112.  
    113. Button {
    114. id: button10
    115. x: 136
    116. y: 235
    117. text: "8"
    118. onClicked: {
    119.  
    120. i = text
    121. t.text = t.text + i
    122.  
    123. }
    124. }
    125.  
    126. Button {
    127. id: button11
    128. x: 203
    129. y: 235
    130. text: "9"
    131. onClicked: {
    132. i = text
    133. t.text = t.text + i
    134. }
    135. }
    136.  
    137.  
    138. Button {
    139. id: button4
    140. x: 136
    141. y: 447
    142. text: "+"
    143. onClicked: {
    144.  
    145. a = t.text
    146. t.text = ""
    147.  
    148. b = t.text
    149.  
    150. c = a + b
    151. }
    152.  
    153.  
    154. }
    155. Button {
    156. id: button8
    157. x: 264
    158. y: 299
    159. text: "-"
    160.  
    161. onClicked: {
    162.  
    163. t.text = a
    164. a.toString()
    165.  
    166. t.text = b
    167. b.toString()
    168.  
    169. c = a - b;
    170.  
    171. }
    172.  
    173. Button {
    174. id: button16
    175. x: 0
    176. y: 76
    177. text: "*"
    178.  
    179. onClicked: {
    180.  
    181. t.text = a
    182. a.toString()
    183.  
    184. t.text = b
    185. b.toString()
    186.  
    187. c = a * b;
    188. }
    189. Button {
    190. id: button12
    191. x: -58
    192. y: 72
    193. text: "/"
    194.  
    195. onClicked: {
    196.  
    197. t.text = a
    198. a.toString()
    199.  
    200. t.text = b
    201. b.toString()
    202.  
    203. c = a / b;
    204. }
    205.  
    206.  
    207. }
    208.  
    209.  
    210.  
    211.  
    212. TextField {
    213. id: t
    214. x:-188
    215. y:-237
    216. width: 230
    217. height: 50
    218. text: ""
    219.  
    220. }
    221. }
    222. }
    223.  
    224. Button {
    225. id: button1
    226. x: 267
    227. y: 447
    228. width: 39
    229. height: 42
    230. text: "="
    231.  
    232. onClicked: {
    233.  
    234. t.text = c
    235.  
    236.  
    237. }
    238. }
    239.  
    240. Button {
    241. id: button14
    242. x: 264
    243. y: 235
    244. width: 42
    245. height: 42
    246. text: "C"
    247. onClicked: {
    248.  
    249. t.text = ""
    250.  
    251. }
    252. }
    253.  
    254.  
    255. }
    To copy to clipboard, switch view to plain text mode 


    I think i am wrong with a small mistake anyone help me with this so that i can finish my task.

    Regards,
    Harish
    Last edited by wysota; 26th January 2012 at 13:47. Reason: missing [code] tags

  2. #2
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: How to perform calculator functions in qt qml?

    Your + implementation says:

    javascript Code:
    1. a = t.text
    2. t.text = ""
    3. b = t.text
    4. c = a + b
    To copy to clipboard, switch view to plain text mode 

    Hence if t.text = "7":
    a = 7
    t.text = ""
    b = t.text = ""
    c = a + b = 7 + "" = 7 + 0 = 7

    You should perform the operation upon clicking "=" and not "+". Or actually you should have a stack of arguments and upon clicking an operator you should be calculating the result of the previous operation. Currently your calculator works as a Reverse Polish Notation (RPN) calculator. So if you click buttons "7", "2", "+", "=", you'll get "9".
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  3. #3
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Post Re: How to perform calculator functions in qt qml?

    Thank You Sir for your reply .

    But i am not able to get your point clearly sir.. can you explain me with sample code showing that.
    I tried what you have said .. but still i am not able to perform the operation..


    Thank you
    Harish
    Last edited by harish; 26th January 2012 at 14:07.

  4. #4
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: How to perform calculator functions in qt qml?

    So what have you tried?
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  5. #5
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Post Re: How to perform calculator functions in qt qml?

    I had tried the operation by clicking "=" and not "+" but still i was not able to get the required output.

  6. #6
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: How to perform calculator functions in qt qml?

    How does the code look like? Did you implement the stack of operations?
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  7. #7
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Unhappy Re: How to perform calculator functions in qt qml?

    If I change my coding as:

    a = t.text

    b = t.text

    c = a + b

    for eg: a = t.text = "2"
    b = t.text = "3"

    c = a + b.......i.e. c = 2 + 3

    and when clicked on "=" my answer should be "5" but i am getting the values appended as "2323"..


    Can someone please help me....?



    Whether the calculation done in .qml file is right or else i should i create a function call to .cpp file and do the calculation there....I had tried that too but still i was not able to get the result.....

    Is there anyone to solve my problem?

    Last edited by harish; 30th January 2012 at 06:59.

  8. #8
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: How to perform calculator functions in qt qml?

    You are working on text so the + operator concatenates. Your program doesn't know you want it to convert text to integers.

    Doing calculations in qml is fine. Have you seen the Calculator example?
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  9. #9
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Post Re: How to perform calculator functions in qt qml?

    I had already found the link which have given sir.In this they are using javascript code but i am using C++.

    Now i had tried anotherway of doing my app as:

    I had made a function call to .cpp file and done the calcultion there and passed that value to the .qml file.

    Here is my code:

    .qml file

    javascript Code:
    1. property string i;
    2. property string c;
    3. Button {
    4. id: button1
    5. x: 203
    6. y: 258
    7. text: “5”
    8. onClicked:
    9. {
    10. i = text t.text = t.text + i
    11. }
    12. }
    13.  
    14. Button {
    15. id: button2
    16. x: 203
    17. y: 258
    18. text: “3”
    19. onClicked: { i = text t.text = t.text + i
    20. }
    21. }
    22.  
    23. Button {
    24. id: buttonplus
    25. x: 136
    26. y: 320
    27. text: “+” onClicked: {
    28. t.text = a;
    29. t.text = b;
    30.  
    31. StringHelper.apple(a,b);
    32. }
    33. }
    34.  
    35. Button {
    36. id: equal
    37. x: 195
    38. y: 320
    39. width: 116
    40. height: 42
    41. text: “=”
    42. onClicked: {
    43.  
    44. t.text = StringHelper.apple(button1.text,button2.text);
    45.  
    46. }
    47. }
    48.  
    49. TextField { id: t
    50. x: 81
    51. y: 60
    52. width: 225
    53. height: 50
    54. text: “” maximumLength: 32765
    55.  
    56. }
    To copy to clipboard, switch view to plain text mode 

    stringhelper.h


    Qt Code:
    1. #ifndef STRINGHELPER_H
    2. #define STRINGHELPER_H
    3.  
    4. #include<QObject>
    5.  
    6. class StringHelper : public QObject
    7. {
    8. Q_OBJECT
    9. public slots:
    10. int apple(int a,int b)
    11.  
    12. {
    13.  
    14. int c = a + b;
    15.  
    16. return c;
    17.  
    18. }
    19.  
    20.  
    21. };
    22.  
    23. #endif // STRINGHELPER_H
    To copy to clipboard, switch view to plain text mode 

    main.cpp:

    Qt Code:
    1. #include <QApplication>
    2. #include <QDeclarativeView>
    3. #include <QDeclarativeContext>
    4. #include "stringhelper.h"
    5. #include<QDateTime>
    6.  
    7. int main(int argc, char *argv[])
    8. {
    9. QApplication a(argc, argv);
    10.  
    11. StringHelper stringHelper;
    12.  
    13. QDeclarativeView view;
    14. view.setResizeMode(QDeclarativeView::SizeRootObjectToView);
    15. view.rootContext()->setContextProperty("StringHelper", &stringHelper);
    16. view.setSource(QUrl("qml/sad/main.qml"));
    17.  
    18. #if defined(Q_WS_S60) || defined(Q_WS_MAEMO)
    19. view.showMaximized();
    20. #else
    21. view.setGeometry(100, 100, 800, 480);
    22. view.show();
    23. #endif
    24.  
    25. return a.exec();
    26. }
    To copy to clipboard, switch view to plain text mode 



    From this i was able to get the addition operation performed and displayed but in case if i am having 10 buttons with integers from 0-9 how to declare the result function:


    in .qml file:

    javascript Code:
    1. onClicked: {
    2. t.text = StringHelper.apple(????????????????);
    3. }
    To copy to clipboard, switch view to plain text mode 

    ???????


    Could you please come out with a solution for my problem.....?
    Last edited by wysota; 30th January 2012 at 11:20. Reason: missing [code] tags

  10. #10
    Join Date
    Jan 2006
    Location
    Warsaw, Poland
    Posts
    33,359
    Thanks
    3
    Thanked 5,015 Times in 4,792 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows Android Maemo/MeeGo
    Wiki edits
    10

    Default Re: How to perform calculator functions in qt qml?

    Quote Originally Posted by harish View Post
    I had already found the link which have given sir.In this they are using javascript code but i am using C++.
    Last code you pasted was definitely using javascript.

    From this i was able to get the addition operation performed and displayed but in case if i am having 10 buttons with integers from 0-9 how to declare the result function:


    in .qml file:

    javascript Code:
    1. onClicked: {
    2. t.text = StringHelper.apple(????????????????);
    3. }
    To copy to clipboard, switch view to plain text mode 

    Could you please come out with a solution for my problem.....?
    javascript Code:
    1. t.text = (Number(a)+Number(b)).toString()
    To copy to clipboard, switch view to plain text mode 
    Your biological and technological distinctiveness will be added to our own. Resistance is futile.

    Please ask Qt related questions on the forum and not using private messages or visitor messages.


  11. #11
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Smile Re: How to perform calculator functions in qt qml?

    Ya thank you sir i got it....

    Its been a good guidance given by you sir...


    Thanks a lot again...


Similar Threads

  1. how to perform search in QTableWidget?
    By aurora in forum Qt Programming
    Replies: 3
    Last Post: 5th January 2012, 05:25
  2. Perform an automatic click on a webpage
    By manuelito2459 in forum Newbie
    Replies: 0
    Last Post: 25th December 2011, 22:50
  3. Replies: 5
    Last Post: 27th May 2011, 03:51
  4. Perform a cyclic task in a QState
    By schall_l in forum Qt Programming
    Replies: 1
    Last Post: 17th April 2010, 00:18
  5. Replies: 12
    Last Post: 22nd March 2010, 09:59

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.