Display content in ScrolledComposite

Question

I want to create a view that users can zoom in and zoom out, so I planned to implement the view by using ScrolledComposite:

    ScrolledComposite sc = new ScrolledComposite(shell, SWT.BORDER | SWT.H_SCROLL | SWT.V_SCROLL);
    sc.setBounds(0, 0, 200, 200);

The problem is: when the size of content is smaller than the size of scrolled composite, it always appears in the top left corner of the scrolled composite, even I tried setBounds() method of the control or setOrigin() of scrolled composite. In the example below, the display area content of button (100, 50) is smaller than the client area of sc (200, 200), the button always is shown at the top left corner even I tried set up some position for it to display in the scrolled composite.

    Button button = new Button(sc, SWT.PUSH);
    button.setText("Button");
    button.setBounds(50, 50, 100, 50);
    sc.setContent(button);
    sc.setOrigin(30, 30);

The result I get is

How can I fix this problem?

Answer 1

The trick here is to use another Composite within the ScrolledComposite that will contain your button and possibly other content. On the inner or content Composite you will have the flexibility to place children as desired. The ScrollComposite doesn't use a layout, so you cannot control the placement of the children. Just like a TabItem will only allow you to setContent but not its placement.

ScrolledComposite sc = new ScrolledComposite(shell, SWT.BORDER | SWT.H_SCROLL | SWT.V_SCROLL);
sc.setBounds(0, 0, 200, 200);

Composite content = new Composite(sc, SWT.NONE);
content.setSize(300, 300);
sc.setContent(content);

Button button = new Button(content, SWT.PUSH);
button.setText("Button");
button.setBounds(50, 50, 100, 50);

You can use the content composite in any way you like to layout the children. You may also now use a layout of your choice on the content composite to ensure the button always remains in center.