The ImageMap is a widget, that can
display any type of image, pygame can handle, and supports
different mouse events.
In contrast to the ImageButton it does
not react visually upon those events, but can store the last
event, that occured as well as providing the relative position
coordinates of the event.
To create an ImageMap, you have to
provide an image surface or filename similar to the
ImageButton constructor.
imagemap = ImageMap ("path/to/an/image.png")
imagemap = ImageMap (pygame_surface)
set_picture() method.
Below you will find an example of the
ImageMap widget class.
You can find the following example as a python script under
examples/imagemap.py.
# ImageMap examples.
import os
from ocempgui.widgets import *
from ocempgui.widgets.Constants import *
def _get_type (eventtype):
if eventtype == SIG_MOUSEDOWN:
return "SIG_MOUSEDOWN"
elif eventtype == SIG_MOUSEUP:
return "SIG_MOUSEUP"
elif eventtype == SIG_MOUSEMOVE:
return "SIG_MOUSEMOVE"
else:
return "Unknown signal"
def _got_mouseevent (event, imagemap, labels):
labels[0].text = "Signal: %s" % _get_type (imagemap.last_event.signal)
if imagemap.last_event.signal != SIG_MOUSEMOVE:
labels[1].text = "Button: %d" % imagemap.last_event.data.button
else:
labels[1].text = "Button: None"
labels[2].text = "Event pos: %s" % str (imagemap.last_event.data.pos)
labels[3].text = "Rel. pos: %s" % str (imagemap.relative_position)
def _create_vframe (text):
frame = VFrame (Label (text))
frame.spacing = 5
frame.align = ALIGN_LEFT
return frame
def create_imagemap_view ():
frm_map = _create_vframe ("ImageMap")
imagemap = ImageMap ("image.png")
lbl_desc = Label ("Move the mouse over the ImageMap and" + os.linesep +
"press the mouse buttons to interact with it.")
lbl_desc.multiline = True
lbl_results = [Label ("Signal:"), Label ("Button:"), Label ("Event pos:"),
Label ("Rel. pos:")]
for label in lbl_results:
label.create_style()["fgcolor"][STATE_NORMAL] = (255, 0, 0)
imagemap.connect_signal (SIG_MOUSEDOWN, _got_mouseevent, imagemap,
lbl_results)
imagemap.connect_signal (SIG_MOUSEMOVE, _got_mouseevent, imagemap,
lbl_results)
imagemap.connect_signal (SIG_MOUSEUP, _got_mouseevent, imagemap,
lbl_results)
frm_map.add_child (imagemap, lbl_desc, *lbl_results)
return frm_map
if __name__ == "__main__":
# Initialize the drawing window.
re = Renderer ()
re.create_screen (250, 220)
re.title = "ImageMap examples"
re.color = (234, 228, 223)
re.add_widget (create_imagemap_view ())
# Start the main rendering loop.
re.start ()
Example 42. ImageMap example
The ProgressBar is a non-interactive
widget class, that uses a horizontal bar to display operation
efforts. Its value range reaches from 0.0 to 100.0.
To create a ProgressBar widget, you
simply invoke its constructor with no arguments.
bar = ProgressBar ()
Similar to the Range widget class, the
ProgressBar supports the
step and
set_step() methods to set the step
range for continouos increments/decrements
bar.step = 1.4
bar.set_step (10)
# Increment/decrement the bar value by the currently set step range.
while process_runs:
bar.increment () # or bar.decrement ()
...
bar.value = 50.0
You can optionally display a short amount of text centered on it,
which can be set with the text attribute or
set_text() method.
bar.text = "Processing data..."
bar.set_text ("Please wait...")
You can find the following example as a python script under
examples/progressbar.py.
# ProgressBar examples.
from ocempgui.widgets import *
from ocempgui.widgets.Constants import *
def _update_bar (bar, button):
if bar.value == 0:
while bar.value < 100:
bar.increase ()
button.text = "Clean the progressbar"
else:
while bar.value > 0:
bar.decrease ()
button.text = "Fill the progressbar"
def _update_text (bar):
bar.text = "%.2f" % bar.value + "%"
def _create_vframe (text):
frame = VFrame (Label (text))
frame.spacing = 5
frame.align = ALIGN_LEFT
return frame
def create_progressbar_view ():
table = Table (1, 3)
table.spacing = 5
# Create and display a simple ProgressBar.
frame = _create_vframe ("ProgressBar")
progress = ProgressBar ()
progress.step = 0.5
# Create a button to start filling.
btn = Button ("#Fill the ProgressBar")
btn.connect_signal ("clicked", _update_bar, progress, btn)
frame.add_child (progress, btn)
table.add_child (0, 0, frame)
# ProgressBar with text.
frame = _create_vframe ("Progressbar with text")
progress = ProgressBar ()
progress.text = "0.00%"
progress.step = 0.5
progress.connect_signal (SIG_VALCHANGED, _update_text, progress)
# Create a button to start filling.
btn = Button ("Fill the ProgressBar")
btn.connect_signal ("clicked", _update_bar, progress, btn)
frame.add_child (progress, btn)
table.add_child (0, 1, frame)
# Insensitive progressbar.
frame = _create_vframe ("Insensitive Progressbar")
progress = ProgressBar ()
progress.value = 50.0
progress.text = "50.00%"
progress.sensitive = False
frame.add_child (progress)
table.add_child (0, 2, frame)
return table
if __name__ == "__main__":
# Initialize the drawing window.
re = Renderer ()
re.create_screen (450, 150)
re.title = "ProgressBar examples"
re.color = (234, 228, 223)
re.add_widget (create_progressbar_view ())
# Start the main rendering loop.
re.start ()
Example 43. ProgressBar example
The Diagram class is an abstract base
class for Diagram like widgets such as the
Graph2D. It provides interfaces to create
statistical diagrams easily, be it graphs, bar and pie charts or
whatever else.
You usually will not create an Diagram
object directly, but rather use it as parent for your own
classes.
TODO
The Graph2D class allows you to plot
two-diemensional graphs using a cartesian coordinate plane.
You can choose the names of the axes, scale units and units to
display and set up the evaluation function for plotting the graph
freely.
To create a Graph2D widget, you simply invoke
its constructor with the minimum size to occupy by the widget.
graph = Graph2D (400, 400)
The default names of the axes are "x" and "y". They can be changed
using the axes attribute and
set_axes method.
graph.axes = "t", "v" # Set velocity related to time.
graph.set_axes ("t", "v")
To set the scale units to display for the horizontal and vertical axis,
the scale_units attribute and
set_scale_units() method can be used.
The first value is used for the horizontal, the second for the vertical
axis.
graph.scale_units = ("cm", "kp")
graph.set_scale_units ("cm", "kp")
To show or hide the scale units and axes names on the graph, the
show_names attribute and
set_show_names method are used.
The names and units are usually diplayed on the right of the axes.
graph.show_names = True # Show the names
graph.set_show_names (False) # Do not display them.
The distance from one unit to another can be set using the
units and set_units
method. The distance is given in pixels and defaults to 10 to 10.
graph.units = 10, 25 # Set 10 px for the horizontal units, 25 for vertical
graph.set_units (10, 25)
You can rotate the graph clockwise by 90 degrees by adjusting the orientation attribute. The default is a horizontal orientation.
graph.orientation = ORIENTATION_VERTICAL # Rotate the graph
grap.set_orientation (ORIENTATION_HORIZONTAL)
You can find the following example as a python script under
examples/graph2d.py.
# Graph2D examples.
from ocempgui.widgets import *
from ocempgui.widgets.Constants import *
import Numeric, math
__function = "func_1"
def change(graph):
global __function
if __function == "func_1":
graph.eval_func = lambda x: x / ((- 3 * x**2.0 + 2) * math.e**x)
__function = "func_2"
else:
graph.eval_func = lambda x: x**4.0 - 3 * x**2.0 + 2 * x
__function = "func_1"
def create_graph2d_view ():
frame = VFrame (Label ("Graph2D"))
frame.topleft = 10, 10
# Create the graph.
graph = Graph2D (400, 400)
# Lock it, because we set some necessary information and want to
# avoid excessive update() calls.
graph.lock ()
# Scale units for the x and y axis.
graph.scale_units = ("cm", "kp")
# Point of origin.
graph.origin = 200, 200
# We want to see negative values.
graph.negative = True
# The evaluation function and data to use.
graph.eval_func = lambda x: x**4.0 - 3 * x**2.0 + 2 * x
graph.data = Numeric.arrayrange (-10, 10, .001).tolist()
# Done, unlock.
graph.unlock ()
button = Button ("Change function")
button.connect_signal (SIG_CLICKED, change, graph)
frame.add_child (graph, button)
return frame
if __name__ == "__main__":
# Initialize the drawing window.
re = Renderer ()
re.create_screen (450, 500)
re.title = "Graph2D examples"
re.color = (234, 228, 223)
re.add_widget (create_graph2d_view ())
# Start the main rendering loop.
re.start ()
Example 44. Graph2D example
The StatusBar widget class can display various
text information using a stack system as well as the current date and
time. It also supports the placement of widgets on its area.
To create a new StatusBar widget, you simply
invoke its constructor with no arguments.
statusbar = StatusBar ()
To set set the current information to display, the
push_tip() method has to be used.
statusbar.push_tip ("Display this tip")
pop_tip() method
has to be used.
statusbar.pop_tip ()
get_current_tip() method.
info = statusbar.current_tip
info = statusbar.get_current_tip()
To show or hide the information on the StatusBar
the tips attribute and
show_tips method are used.
statusbar.tips = True
statusbar.show_tips (False)
show_date method,
statusbar.date = True
statusbar.show_date (False)
You can supply your own date and time format string to customize
the date output. The date_format attribute and
set_date_format() method allow you to use
python specific date format strings, which can be understood by
python's datetime.strftime() method.
statusbar.date_format = "%x"
statusbar.set_date_format ("%H:%M")
To get the currently displayed date and time, use the current_date attribute. Its value matches the set date_format attribute.
date = statusbar.current_date
You can customize the size occupied by the displayed information
and date using the tip_width and
date_width properties and
set_tip_width and
set_date_width methods.
statusbar.tip_width = 50 # Set the information display width to 50 px.
statusbar.set_tip_width (50)
statusbar.date_width = 50 # Set the date display width tto 50 px.
statusbar.set_date_width (50)
You can find the following example as a python script under
examples/statusbar.py.
# StatusBar examples.
from ocempgui.widgets import *
from ocempgui.widgets.Constants import *
def _update_tip (statusbar, button):
statusbar.pop_tip ()
statusbar.push_tip ("Button '%s' was clicked" % button.text)
def _create_vframe (text):
frame = VFrame (Label (text))
frame.spacing = 5
frame.align = ALIGN_LEFT
return frame
def create_statusbar_view ():
table = Table (1, 3)
table.spacing = 5
# Create and display a simple StatusBar with some children.
frame = _create_vframe ("StatusBar")
status = StatusBar ()
button1 = Button ("Button")
button1.connect_signal (SIG_CLICKED, _update_tip, status, button1)
button2 = CheckButton ("Empty")
button2.connect_signal (SIG_CLICKED, _update_tip, status, button2)
status.add_child (button1, button2)
button = Button ("Testbutton")
button.connect_signal (SIG_CLICKED, _update_tip, status, button)
frame.add_child (button, status)
table.add_child (0, 0, frame)
return table
if __name__ == "__main__":
# Initialize the drawing window.
re = Renderer ()
re.create_screen (450, 150)
re.title = "StatusBar examples"
re.color = (234, 228, 223)
re.add_widget (create_statusbar_view ())
# Start the main rendering loop.
re.start ()
Example 45. StatusBar example
The TooltipWindow is a non-interactive
widget that can display a short to medium amount of text and can
be used to display additional information and descriptions. It
uses a certain background color to be easily distinguished from
other widgets.
To create a TooltipWindow widget, you
simply invoke its constructor with the text to display.
window = TooltipWindow ("A message to display")
To set the text after creation, use the text
attribute or set_text() method.
window.text = "New Text"
window.set_text ("New Text")
You can find the following example as a python script under
examples/tooltipwindow.py.
# TooltipWindow examples
import pygame.mouse
from ocempgui.widgets import *
from ocempgui.widgets.Constants import *
__tooltip = None
def _make_tooltip (tip, renderer):
global __tooltip
# Destroy the tooltip, if it exists.
if __tooltip:
__tooltip.destroy ()
# Create a new tooltip.
__tooltip = TooltipWindow (tip)
x, y = pygame.mouse.get_pos ()
__tooltip.topleft = x + 8, y - 5
__tooltip.depth = 99 # Make it the topmost widget.
renderer.add_widget (__tooltip)
def _destroy_tooltip ():
# Destroy the tooltip, if it exists.
global __tooltip
if __tooltip:
__tooltip.destroy ()
__tooltip = None
def create_tooltip_view (renderer):
frame = VFrame ()
frame.border = BORDER_NONE
frame.spacing = 20
button1 = Button ("Move the mouse over me")
button1.tooltip = "An enhanced description"
button1.connect_signal (SIG_ENTER, _make_tooltip, button1.tooltip, renderer)
button1.connect_signal (SIG_LEAVE, _destroy_tooltip)
button2 = Button ("And over me, too")
button2.tooltip = "Another description"
button2.connect_signal (SIG_ENTER, _make_tooltip, button2.tooltip, renderer)
button2.connect_signal (SIG_LEAVE, _destroy_tooltip)
frame.children = button1, button2
return frame
if __name__ == "__main__":
# Initialize the drawing window.
re = Renderer ()
re.create_screen (200, 150)
re.title = "TooltipWindow examples"
re.color = (234, 228, 223)
re.add_widget (create_tooltip_view (re))
# Start the main rendering loop.
re.start ()
Example 46. TooltipWindow example