PDA

View Full Version : Please help me with my (very simple) UI


El Amir
04-05-2010, 02:45 PM
Hi guys,

I've started learning a bit of python and Qt in order to develop my own application, this has been a bit of a goal for some time now.

I've finally got the python side working well, but i'm really struggling with the UI part.

My application is a simple "clicker" program: you can increment/decrement (by one) the current value, reset the current value to 0 and quit the application.

I know there already is a similar app on the OVI store, but this is more of a first step into developing for me.

Ideally, to do this, the program should have a "+", "-", "reset" and "quit" button and should look like something like this:

http://farm5.static.flickr.com/4036/4493775653_cce8fda99a.jpg

Since, Maemo (and Meego I guess) are all open open source, i dont mind sharing my code, not that it would take most of you more than 5min to do on your own!

This is it:



# Clicker V1 for Nokia N900
# by Amir B (aka "El Amir" or "benjezzy")

print ""
print " * TIP : Press 'q' to exit and 'r' to reset back to 0 * "
print " Also, 'l' will print the last result "
print ""
print " The default value is '0' "
print ""

var = 1
x = 0
while var == 1:


y = raw_input("Press '+' to add one or '-' to substract one: ")

if y == "q":
exit()
elif y == "+":
x = x + 1
print x
elif y == "-":
x = x - 1
print x
elif y == "r":
x = 0
print x
elif y == "":
print 'Please enter something'
elif y == "l":
print x
else:
print 'Input error'




As you can see the code is very simple. I've tried to link the code to the UI but with very little succes:

- I can get the program to create a window,
- to get a working quit button

but

-I can't seem to link any of the buttons to a specific function
-i can't link the program to the LCD object (even though I can connect it to the slider, like in the QT documentation, but that's not really what I need)


So here it is: I'm really lost! And I could do with some help. Any advice is more than welcome, and as soon as I get my app in the repo, i'll be adding some name to the "thanks to/contribution" tab :)

krk969
04-05-2010, 03:53 PM
...
So here it is: I'm really lost! And I could do with some help. Any advice is more than welcome, and as soon as I get my app in the repo, i'll be adding some name to the "thanks to/contribution" tab :)

Im not a python coder, I use C++, but ill try to give you an idea and let you research the rest so it will give you a chance to learn as well.

1. create 3 pushbutton using QPushButton , lets call it plus , minus and reset.
2. create a widget to display your number, something like a QLabel or QLCDNumber, lets call it displaywidget
3. connect the signal clicked of plus to a slot function called increment.
4. connect the signal clicked of minus to a slot function caled decrement.
5. connect the signal clicked of reset to a slot function caled reset.
6. in your increment funtion set your displayWidget to the value count+1. QLabel has a slot setNum() and QLCDNumber has a slot display() to set your count value.
7. in your decrement funtion set your displayWidget to the value count-1
8. in your reset funtion set your displayWidget and count to 0.
9 use a layout like QHBoxLayout, QVboxlayout, and align your widgets and buttons the way you want.
If I take the above example you posted
create 1 QHBoxLayout and add your pushbuttons to it so they appear in a row one beside the other.
then add the displaywidget and the above layout to a QVBoxLayout
so the displaywidget and the buttonsgroup appear as above.
10. finally create a QMainWIndow and set the layout as the above QVBoxLayout you created that contains the buttonsgroup and displaywidget.

now run your app and your QMainWindow gets displayed and clicking the buttons will change the display as required.

good luck now learning QT, its a great framework and very easy to work with :)

jaem
04-05-2010, 09:22 PM
El Amir:
I'm not sure if this is part of your problem, but just as an FYI:
Some of the Qt syntax (for Signals & Slots, anyway) is different between PyQt for Python 2.6 and Python 3.x, and for all I know may also be different for PySide (Nokia's "official" Python-Qt bindings), which I've never tried. If you're getting errors about signal connect calls, then you might have just read a tutorial that didn't make clear which version it was for. I do have some example code that I could show you, but it's for Python 3.x, so it probably isn't relevant. If you want it anyway, just PM me.

mikec
04-06-2010, 11:28 AM
@El Amir

Welcome to the PyQt Club.
it looks like you are using Qt Designer, and I would say that is the right direction. But QtDesigner does things a little bit different to Python and Qt on its own, and is worth investing so time.
1. if you are using pyuic4 to convert your ui code to python, you can use the -x option on pyuic to generate the application.
2. You can then add your code into the generated code as a quick and simple start, but this is not the recommend way, as any changes in your ui will overwrite your changes. Still as a starter its quick and simple.
3. To connect your buttons, get the name of your button from the generated code, and then connect the buttons signal to your code

self.connect(MyButton, QtCore.SIGNAL('clicked()'),
QtGui.qApp, MyButton-Handling Routine)


Once you get past this point I would really recommend you do the Eric4 Tutorial, and set yourself up a Python IDE. You will find it a lot easier to learn both Qt and Python, as Eric4 will both trap any syntax errors as well as generate the dialog code so you will not have to write your own signal and slot code as above. it does it for you!!

Mike C

noobmonkey
04-09-2010, 12:10 PM
Amir, not much i can say from what mic has done to begin with - as thats the basic's. I did a bodge job on mine but for example:


try:
from PyQt4 import QtCore, QtGui
except:
print "Unexpected error: Importing QtCore and QtGui"
raise


class Ui_MainWindow(object):
def setupUi(self, MainWindow):
MainWindow.setObjectName("MainWindow")

#or whatever size you want
MainWindow.resize(800, 420)

self.centralwidget = QtGui.QWidget(MainWindow)
self.centralwidget.setObjectName("centralwidget")

self.pushButtonPlus_snd1 = QtGui.QPushButton(self)
self.pushButtonPlus.setGeometry(QtCore.QRect(10, 10, 391, 51))
self.pushButtonPlus.setObjectName("pushButtonPlus")
self.pushButtonPlus.setText("+")
# Tell the button what to do when it is clicked. In this case i want it to run the Add a number function below
QtCore.QObject.connect(self.pushButtonPlus, QtCore.SIGNAL('clicked()'), self.plusFunction)

MainWindow.setCentralWidget(self.centralwidget)
QtCore.QMetaObject.connectSlotsByName(MainWindow)

def plusFunction(self):
<< Do something here?!?! - change value of a label maybe?>>

if __name__ == "__main__":
app = QtGui.QApplication(sys.argv)
MainWindow = QtGui.QMainWindow()

ui = Ui_MainWindow()
ui.setupUi(MainWindow)
MainWindow.show()

sys.exit(app.exec_())




Ok, well a very simple example with one button....... SO you need to add a label and another button....

The example should show how the button press links to the function name....... :D

gryedouge
04-09-2010, 12:21 PM
You making a BJ Card counting program? :D