Package: pygame-json-ui
Pygame UI READMEPygame UIis a package for building user interfaces forpygamein JSON.It is currently a work in progress, but if you wanna test it out, feel free to do so :)Table Of ContentQuick StartInstallationSetupPythonJSONElement ListAttribute ListGeneralFrameLabelText InputButtonSwitchSliderFramesFrame PathExamplesFAQQuick StartInstallationPygame UI is available on PyPi:pipinstallpygame-json-uiIn case this doesn't work, you'll need to manually add the pygame_ui folder to your site-packages.When this is done you can test your installation, by executing the following:>>>importpygame_ui>>>pygame_ui.test()Successfullyinstalled!enjoy:)Version:x.x.x.xSetupYou will have two files in the same folder:whatever.pyInterface.json <-- Name for automatically loading the fileIf you prefer a different name for the json file, or Pygame UI is having issues locating it automatically, you can pass the absolute path to the file as an argument forpygame_ui.init().Here a simple example for making a label:Python FileNotice that theevent_handleris not required unless you want interactive elements to function as expected.importpygameimportpygame_ui# Creating a windowpygame.init()screen=pygame.display.set_mode((1280,720),vsync=1)pygame.display.set_caption("GUI")clock=pygame.time.Clock()# Initializing interfaceInterface=pygame_ui.init()whileTrue:foreventinpygame.event.get():ifevent.type==pygame.QUIT:quit()# Call event handlerInterface.event_handler(event)screen.fill((0,0,0))# Draw interfaceInterface.draw(screen)pygame.display.flip()clock.tick(60)JSON FileMUST be namedInterface.jsonand in the same folder as python file for loading the json file automatically!{"test_label":{"type":"label","position":[200,100],"size":[120,80],"background_color":[200,0,0],"text":"IT WORKS!","font_size":20,"auto_size":true}}Element ListAll of the following items will be refered to aselements:FrameLabelText InputButtonSwitchSliderDropdown (Coming soon)Attribute Listattribute: data typedescription (default value).GeneralThese attributes can be given to any element typetype: strREQUIRED, specifies which element this is choose fromthislist.position: [x,y]Sets position from top-left of screen to top-left of element boundry box ([0, 0]).position_anchor: str"top/center/bottom left/center/right" or "center" ("top left").position_relative: boolWhether given position will be interpreted as relative to parent or absolute (false).size: [x,y]Sets the size of the element boundry box ([0, 0]).background_color: (r,g,b)The boundry box will be filled with this color (none).is_visible: bool(true).is_hoverable: bool(false).is_clickable: bool(false).Framecontents: {}Seeframesfor more info.Labeltext: strExactly what you think it is.text_color: (r,g,b)([255,255,255])text_aa: boolanti-aliasing (true)font_name: str('Arial')font_size: int(10)font_bold: bool(false)font_italic: bool(false)auto_size: boolThis will overwrite size of the boundry box to fit the text within (false).Text Inputtyping_start_on_click: boolWill set typing to True when the hitbox is clicked (true).typing_end_on_enter: boolWill set typing to False whenenteris pressed (true).typing: boolWhether or not the users button presses will be processed (false).text: strThe currently typed string ("Your text here").caret: boolOnly used for backend (false).caret_timer: floatOnly used for backend (0).Buttoncontents: {}The button is basically just a frame with the following default attributes added to it. Making a button manually from a frame is possible, but deprecated.is_clickable: bool(true)is_hoverable: bool(true)click_start: bool(false)click_end: bool(false)click_held: bool(false)hover_start: bool(false)hover_end: bool(false)hover_held: bool(false)Switchstate: boolRepresents the current state of the switch on/off (false)preset: strA preset for it's looks. Only existing preset is currently: "simple" (none)is_clickable: bool(true)is_hoverable: bool(true)click_start: bool(false)click_end: bool(false)click_held: bool(false)hover_start: bool(false)hover_end: bool(false)hover_held: bool(false)Slidervalue_min: int/floatLower end of the slider (0)value_max: int/floatUppper end of the slider (1)value: int/floatRepresents the current value of the slider (0)preset: strA preset for it's looks. Only existing preset is currently: "simple" (none)is_clickable: bool(true)is_hoverable: bool(true)click_start: bool(false)click_end: bool(false)click_held: bool(false)hover_start: bool(false)hover_end: bool(false)hover_held: bool(false)FramesFrames can containelementsJust like how a folder can contain files and other folders.
Frames can also hold other frames, and yes, those can contain frames aswell (seeFrame-ception). When a frame is invisible, it'selementswill also be invisible. Deleting a frame will also delete it'selements.Frame PathA frame path is a string representation of the route to a certain frame.Say we have the following json file{"Arthur":{"type":"frame""contents":{"Bertha":{"type":"frame""contents":{"Pippinpaddleopsicopolis":{"type":"frame"}}},"Cedric":{"type":"frame"}}}}and i wanted to accessPippinpaddleopsicopolisThe syntax for the frame path is very simple:"Arthur->Bertha->Pippinpaddleopsicopolis"ExamplesAll examples usethispython file as base.A button{"harry the button":{"type":"button","position":[250,120],"size":[200,200],"background_color":[100,0,0],"contents":{"jonathan the label":{"type":"label","position":[260,150],"font_size":30,"auto_size":true}}}}With this called afterpygame_ui.init():harry=Interface.get_element('harry the button','frame1->frame2')jonathan=Interface.get_element('jonathan the label','frame1->frame2->harry the button')And this betweenevent_handler()anddraw():jonathan.text="start: "+str(harry.click_start)+", end: "+str(harry.click_end)+", held: "+str(harry.held)Adding An Element Post Initializationplay_label=pygame_ui.label(position=[100,100],size=[100,100],text="play now",text_size=20)Interface.add_element('play',play_label)Adding An Element To A Frameplay_label=pygame_ui.label(position=[100,100],size=[100,100],text="play now",text_size=20)Interface.add_element('play',play_label,'Arthur->Bertha->Pippinpaddleopsicopolis')Removing An Element From A FrameInterface.remove_element('Pippinpaddleopsicopolis','Arthur->Bertha')Get Element Objectplay_label=Interface.get_element('play','Arthur->Bertha->Pippinpaddleopsicopolis')play_label.text='THE THIRD'Frame-ceptionJust... don't ask me why.Pythonimportpygameimportpygame_uipygame.init()screen=pygame.display.set_mode((1280,720),vsync=1)pygame.display.set_caption("Frame-ception")clock=pygame.time.Clock()Interface=pygame_ui.init()path='frame0'foriinrange(100):frame='frame'+str(i+1)Interface.add_element(frame,pygame_ui.frame(),path)path+='->'+framewhileTrue:foreventinpygame.event.get():ifevent.type==pygame.QUIT:quit()screen.fill((0,0,0))Interface.draw(screen)pygame.display.flip()clock.tick(60)JSON{"frame0":{"type":"frame","contents":{}}}FAQNothing yet lol.