In this tutorial we'll be building a color picker in PyGame using the Hooman library:
Introducing Hooman
Hooman is a library which simplifies PyGame coding.
To install it's just:
pip install Hooman
The Hooman skeleton is as follows:
from hooman import Hooman
import pygame
window_width, window_height = 500, 500
hapi = Hooman(window_width, window_height)
while hapi.is_running:
hapi.flip_display()
hapi.event_loop()
pygame.quit()
Building the picker
We need two Hooman elements:
The Slider and the text element.
The slider is as follows:
hapi.slider(x, y, width, height, options)
where options is a dictionary
The docs tell us:
optional parameters
background_color - the background color of the slider
slider_width - the width of slider, by default it is the same as the height
slider_color - the color of the slider
starting_value - the starting value of the slider, by default it is in the middle of the range
value_range - the range that the slider ranges between, by default it is between 0 and 1
Methods
update() - this updates the slider and draws it on screen, this should be called every frame
value() - this returns the current value of the slider
set_value(value) - given a integer or float, this sets the value and moves the slider
Before the while loop we set 3 sliders:
slider_options = {"value_range": [0, 255]}
r_slider = hapi.slider(50, 300, 400, 10, slider_options)
g_slider = hapi.slider(50, 330, 400, 10, slider_options)
b_slider = hapi.slider(50, 360, 400, 10, slider_options)
where each has a range of 0 to 255
Then we set the background to the slider values. Before the background docs tell:
.background
used to set background color of screen
hapi.background((100, 100, 100)) for r g b
hapi.background(100) same as hapi.background((100, 100, 100))
The below snippet suits our purpose:
while hapi.is_running:
bg_col = (r_slider.value(), g_slider.value(), b_slider.value())
hapi.background(bg_col)
colors are set as tuples of 3 values viz red, blue, green
Then after we update the sliders:
r_slider.update()
g_slider.update()
b_slider.update()
Then we display the values using .text
.text(the string, x, y)
hapi.fill(hapi.color["black"])
r_text = "r:{}".format(r_slider.value())
hapi.text(r_text, 50, 280)
g_text = "g:{}".format(g_slider.value())
hapi.text(g_text, 50, 310)
b_text = "b:{}".format(b_slider.value())
hapi.text(b_text, 50, 340)
The complete snippet:
from hooman import Hooman
import pygame
window_width, window_height = 500, 500
hapi = Hooman(window_width, window_height)
slider_options = {"value_range": [0, 255]}
r_slider = hapi.slider(50, 300, 400, 10, slider_options)
g_slider = hapi.slider(50, 330, 400, 10, slider_options)
b_slider = hapi.slider(50, 360, 400, 10, slider_options)
while hapi.is_running:
bg_col = (r_slider.value(), g_slider.value(), b_slider.value())
hapi.background(bg_col)
r_slider.update()
g_slider.update()
b_slider.update()
hapi.fill(hapi.color["black"])
r_text = "r:{}".format(r_slider.value())
hapi.text(r_text, 50, 280)
g_text = "g:{}".format(g_slider.value())
hapi.text(g_text, 50, 310)
b_text = "b:{}".format(b_slider.value())
hapi.text(b_text, 50, 340)
hapi.flip_display()
hapi.event_loop()
pygame.quit()
Top comments (0)