Viewport with multiple ui-childobjects

[reaktor]

I'm trying to make viewport have multiple interacting button objects, and with draggable background (as in ingame map). Is this supported? I discovered that viewport is single-widget type, and tried containing everything inside vbox(), but this made buttons to follow after the image. Then I changed vbox to fixed, which positioned buttons correctly, but this broke background draggability.

Code: Select all

   python hide:

        ui.side(('c', 'b', 'r'), xpos=100, ypos=50, spacing=5)
        
        vp = ui.viewport(draggable=True, mousewheel=True, xmaximum=400, ymaximum=400)

        ui.fixed()
        ui.image("map.jpg")
        ui.textbutton("test1", xpos=100, ypos=50)
        ui.textbutton("test2", xpos=100, ypos=450)
        ui.close()
        
        ui.bar(adjustment=vp.xadjustment, style='scrollbar')
        ui.bar(adjustment=vp.yadjustment, style='vscrollbar')

        ui.close()
        
        ui.textbutton("Dismiss", xpos=300, xanchor=0.5, ypos=550, yanchor=0.5, clicked=ui.returns(True))
        ui.interact()

[Asha]

It will be supported soon, just wait for the Cookbook Recipe.

[JinzouTamashii]

We'll get to work on it some time around Valentine's, IMHO.

[Watercolorheart]

January 15th.

[reaktor]

Huh? Sorry, I think I have missed some specific post? Could you address correct topic?

Anyways, sounds good if someone is already working with same problem. Still, could anyone point directions to how to place images without losing background drag? That would be great start so I could experiment by my own.

[JQuartz]

Still, could anyone point directions to how to place images without losing background drag?

Well, you can try the inefficient way of setting the value of ypos to negative when using vbox like so:

Code: Select all

python hide:

        ui.side(('c', 'b', 'r'), xpos=100, ypos=50, spacing=5)
       
        vp = ui.viewport(draggable=True, mousewheel=True, xmaximum=400, ymaximum=400)

        ui.vbox()
        ui.image("main_menu3.jpg")
        ui.textbutton("test1", ui.returns(True),xpos=100, ypos=-500)
        ui.textbutton("test2",ui.returns(True), xpos=100, ypos=-600)
        ui.close()
       
        ui.bar(adjustment=vp.xadjustment, style='scrollbar')
        ui.bar(adjustment=vp.yadjustment, style='vscrollbar')

        ui.close()
       
        ui.textbutton("Dismiss", xpos=300, xanchor=0.5, ypos=550, yanchor=0.5, clicked=ui.returns(True))
        ui.interact()