1 / 78

GUI design with Python – examples from crystallography

GUI design with Python – examples from crystallography. Bernhard Lohkamp Karolinska Institute Stockholm Sweden. Coot - Who are we – why am I here?. Paul Emsley (Oxford; everything). Bernhard Lohkamp (Stockholm; Python, GUI, Windows). Kevin Cowtan (York;

jovita
Download Presentation

GUI design with Python – examples from crystallography

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. GUI design with Python –examples from crystallography Bernhard Lohkamp Karolinska Institute Stockholm Sweden

  2. Coot - Who are we – why am I here? Paul Emsley (Oxford; everything) Bernhard Lohkamp (Stockholm; Python, GUI, Windows) Kevin Cowtan (York; crystallographic libraries & tools) Eugene Krissinel, Stuart McNicholas, and others... Bernhard.Lohkamp@ki.se

  3. COOT • Graphical (Crystallographic-Object)-Oriented Toolkit • Used in macromolecular (X-ray) crystallography • Main aims: • Model building • Model completion • Model validation • Graphical, interactive, intuitive, … Bernhard.Lohkamp@ki.se

  4. G(raphical) U(ser) I(nterface)GUI <-> UI • Allow end users to interact with application • Interface can be simple (e.g. command line) to complex (graphical) • Good UI: • Intuitive • Easy to use/learn • Note: applications with good UI are preferred to ones with inferior ones (independent of quality of application!?) Bernhard.Lohkamp@ki.se

  5. What do you prefer? >>> delete_residue(10) Bernhard.Lohkamp@ki.se

  6. GUIs • Good things about GUI • Intuitive (if designed properly) • More efficient (e.g., putting the cursor at a particular location) • Multiple activities simultaneously • Bad things about GUI • Inefficient (if mis-designed) • Difficult to automate (e.g. difficult to write a program to push a button in another application) • Speed Bernhard.Lohkamp@ki.se

  7. The challenge of GUI programming • programming model must address the following issues: • user allowed to perform different things (e.g. type a character, type a hot-key, click on a button, resize the window, obscure the window with another application, minimize it, etc.) • program needs to adapt to different window size (and with it all its content) • Solution: • event-driven model • widget systems (controlled by a geometry manager) • Use Toolkits == TK Bernhard.Lohkamp@ki.se

  8. Windows manager/Desktop Forms of interactionevents in context • Human Interface Device (HID) control Bernhard.Lohkamp@ki.se

  9. Windowing system/hierarchy • Lots of layers • Not very efficient • Slow (not necessary to be fast?!) Bernhard.Lohkamp@ki.se

  10. Connect GUI with Python • Direct via script • GUI design tools and IDEs (Integrated Development Environments) • GUI builder • GUI to build a GUI application • Useful especially for larger projects • Output usually xml • Use directly • Translate to Python script Bernhard.Lohkamp@ki.se

  11. GUI modules for Python (I)(Toolkits, cross-platform) • PyGTK (Gnome): Coot • TK: GTK+ (GIMP Tool Kit) • Well supported • Builder (Glade) • xml direct • Not native on Mac (yet) • PyQt (KDE): CCP4mg – molecular graphics • TK: Qt (“cu-te”) • Licence issue? • Native • Builder (Designer) • xml->python Bernhard.Lohkamp@ki.se

  12. GUI modules for Python (II) • Tk(Inter): PyMOL • TK: Tk • Tkinter Python Tk interface • Distributed with python • Not OO • Builder (GUI builder) • wxPython: Phenix • TK: wxWidgets • Builder (wxGlade) • Native • ? Bernhard.Lohkamp@ki.se

  13. Nomenclature/Widgets • Widget: “windowing gadget”, which means “a useful building block (gadget) to make a windowing system”. • Hierarchy (exemplified): Bernhard.Lohkamp@ki.se

  14. Widget examples • Top level (independent widgets): • Main window • Various (pre-defined) dialogs Bernhard.Lohkamp@ki.se

  15. Dialogs (I) • Info (Message) dialog • Dialog box Bernhard.Lohkamp@ki.se

  16. Dialogs (II) • About dialog • Assistant Bernhard.Lohkamp@ki.se

  17. Dialogs (III) • Selection dialogs • Files • Colours • Fonts • …. Bernhard.Lohkamp@ki.se

  18. Containers/Layout • Boxes • Vertical • Horizontal • Combined (grid, table) • Scrolled window • Tabbed widgets/notebook • Frames • Panes Bernhard.Lohkamp@ki.se

  19. Boxed layout Bernhard.Lohkamp@ki.se

  20. tabs Tabbed window/Notebook Bernhard.Lohkamp@ki.se

  21. Buttons • Button • Toggle button • Check button • Spin button • Radio button • Pre-defined buttons • Files • Colours • Fonts • … Bernhard.Lohkamp@ki.se

  22. Input & Entries (I) • Menu • Toolbar Bernhard.Lohkamp@ki.se

  23. Menus • Submenus • Icons • Accelerators Bernhard.Lohkamp@ki.se

  24. Context menu • Shown upon event (usually mouse click) Bernhard.Lohkamp@ki.se

  25. Toolbars • Like menus but contain icons/buttons • Short-cut for frequently used functions Bernhard.Lohkamp@ki.se

  26. Toolbar Bernhard.Lohkamp@ki.se

  27. Change Style Bernhard.Lohkamp@ki.se

  28. Text only Bernhard.Lohkamp@ki.se

  29. Text and Icons Bernhard.Lohkamp@ki.se

  30. Toolbar Detouch/ Handle Bernhard.Lohkamp@ki.se

  31. detouched Bernhard.Lohkamp@ki.se

  32. Input & Entries (I) • Combobox – spin button • Simple Entry: Bernhard.Lohkamp@ki.se

  33. Input & Entries (II) • Entry: • Auto-completion possible • Sliders Bernhard.Lohkamp@ki.se

  34. List/Tree structures Bernhard.Lohkamp@ki.se

  35. Can include: icons, buttons, … Bernhard.Lohkamp@ki.se

  36. Tree-> expansion Bernhard.Lohkamp@ki.se

  37. Miscellaneous widgets • Progress bar • Status bar Bernhard.Lohkamp@ki.se

  38. Canvas • Drawing area • Canvas/cairo drawing (e.g. PyGoocanvas) • OpenGL drawing (e.g. PyOpenGL, PyGtkGLExt) • Can be interactive Bernhard.Lohkamp@ki.se

  39. Tooltips • Pop ups with text (upon mouse over) • Helps to explore the GUI without reading help files • Use whenever you can (!?) Bernhard.Lohkamp@ki.se

  40. GUI designWhat makes a good UI? • Simple • Intuitive • Respects the commonly accepted conventions • Visually organized • Native look Bernhard.Lohkamp@ki.se

  41. Designing UIs • Two levels: • Graphical: visual aspect • Events: Functionality • Basic blocks = widgets • Making an application react to events = binding Bernhard.Lohkamp@ki.se

  42. General concepts • Main loop and events • Packing • Showing • How to do. Bernhard.Lohkamp@ki.se

  43. Main loop and events • TK mainloop: • Event loop • Idle until an event happens (e.g. a button is pushed, a menu is pulled, etc.) • Quit when program (GUI) finishes • Can have multiple loops (count!!) • PyGTK: gtk.main() • TKinter: tk.mainloop() • PyQT: application.exec_() Bernhard.Lohkamp@ki.se

  44. Main loop and events • Events (examples): • Keyboard (key-pressed, key-released) • Mouse (button-pressed, button-released, motion, wheel, …) • Window/widget (resize, destroy, visibility, activate, deactivate, …) • Etc. • Event modifiers (Shift, Alt, …) • Events emit signals • Can be connected with callbacks (functions, methods) Bernhard.Lohkamp@ki.se

  45. Callbacks and signals • Callback functions/bindings: • functions, methods • do something when event happens (e.g. button pressed) • PyGTK: object.connect(signal_name, callback_func, func_data) def callback_func(widget, callback_data): def callback_meth(self, widget, callback_data): • Tkinter: Button(master, text="OK", command=callback) def callback_func(): • PyQT: connect(widget, signal, callback_func) Bernhard.Lohkamp@ki.se

  46. Synergy between objects and widgets • Variables are passed automatically within class • refer to them as self.whatever • No need to pass variables • Callback functions • Easy to handle • No need to define callbacks on the fly (lambda functions) Bernhard.Lohkamp@ki.se

  47. Packing • Add widget to container • Pack widget in boxes • PyGTK: container_widget.add(widget) box_object.pack_start(child, expand, fill, padding) • Tkinter: object.pack(various_options) • PyQT: Layout.addWidget(widget) Bernhard.Lohkamp@ki.se

  48. Packing • Homogeneous (equal space for everyone) HBox(True/False, 0) • Expand, fill box.pack(expand=, fill=) Bernhard.Lohkamp@ki.se

  49. Showing • Widgets itself do not show (neither do they do anything else -> connect signals!) • Need to show every (!) widget • Can hide widgets • Usually collective show for all • PyGTK: widget.show() widget.hide() widget.show_all() • Tkinter: Done via mainloop • PyQT: widget.show() widget.hide() Bernhard.Lohkamp@ki.se

  50. window VBox HBox Label Entry ScrolledWindow TextBuffer Button Simple example • GUI command input • Schematic in terms of widgets Bernhard.Lohkamp@ki.se

More Related