graphicsjuce

How viewport Works In Juce?


Can anybody please explain me how the viewport works in JUCE framework. I found a discussion on forum but I can't understand in hierarchical Components. I am confused please explain me with a Simple example.


Solution

  • Viewport in JUCE are just like any other viewport in games. the details in the API is clear

    how it works:

    You have to put a component to it, that component will act as its content component that will contain other components. it must be larger than the Viewport otherwise it will defeat the purpose of the Viewport. after that you will be able to scroll around the content component.

    Example:

    Component contentComponentOfViewport = new Component();
    contentComponentOfViewport.addAndMakeVisible(registerButton);
    contentComponentOfViewport.addAndMakeVisible(loginButton);
    contentComponentOfViewport.addAndMakeVisible(usernameTextfield);
    contentComponentOfViewport.addAndMakeVisible(passwordTextfield);
    
    contentComponent.setSize(viewportObject.getWidth() + 1, viewportObject.getHeight() + 1); // with this size you will be able to scroll around with 1x1 pixel offset
    
    viewportObject.setViewedComponent(contentComponentOfViewport); // set it to the viewportObject so it will become scrollable now which is the role of the viewport.
    

    Viewport is just a component with scroll bar. scroll bar wont show if the size of content component is <= to size of Viewport (it doesnt make sense to show the scroll bar anyway)

    Note: Viewport can only have 1 component (contentComponentViewport in the example) which will contain the other components. its like a Picture (content component) and Picture frame (Viewport) as analogy

    read this also: https://docs.juce.com/master/classViewport.html