Question

I have a shell which has a background image.
Within this shell, I have a scrolled composite. This scrolled composite inherits the background image of the shell.

I would like to perform some sort of alpha blending / gradient on the inherited background image of the scrolled composite.

I follow the codes from here.

1. Rectangle rect = sc.getClientArea(); // this rect always returns width and height as 0.
2. Image newImage = new Image(sc.getDisplay(), Math.max(1, rect.width), rect.height); // doesn’t seems to grab the background image, even if I hardcoded the width and height.

Some codes here:

sc = new ScrolledComposite(parent, SWT.BORDER_SOLID | SWT.V_SCROLL);
sc.setExpandHorizontal(true);
sc.setExpandVertical(true);

sc.setAlwaysShowScrollBars(true);
sc.setMinWidth(0);

GridData gd = new GridData(GridData.FILL, GridData.FILL, true, true);
sc.setLayoutData(gd);
sc.setLayout(new GridLayout(1, false));

Rectangle rect = sc.getClientArea();
Image newImage = new Image(sc.getDisplay(), sc.getParent().getBackgroundImage(), SWT.IMAGE_COPY);
GC gc = new GC(newImage);

// need to do clipping on the image so that only the background underlying the scrolled composite gets the gradient

// fill background 
gc.setForeground(new Color(sc.getDisplay(), 100,200,123)); 
gc.setBackground(new Color(sc.getDisplay(), 23,23,23)); 
gc.fillGradientRectangle(rect.x, rect.y, rect.width, rect.height, true);  
gc.dispose();

sc.setBackgroundImage(newImage);
sc.setBackgroundMode(SWT.INHERIT_DEFAULT);


innerComposite = new Composite(sc, SWT.NONE);

GridLayout gl = new GridLayout();
gl.numColumns = 1;
innerComposite.setLayout(gl);
gd = new GridData(GridData.FILL_BOTH);
gd.grabExcessVerticalSpace = true;
innerComposite.setLayoutData(gd);

/**
* Creates other widgets here!
*/
sc.setContent(innerComposite);
sc.layout();

Answer 1

One logical problem that I can see here is that you are doing all the gradient stuff too early. Even if you do something like this sc = new ScrolledComposite(parent, SWT.BORDER_SOLID | SWT.V_SCROLL); it does not mean the shell is created and ready or the window/composite itself. A very convenient handle is to hook into SWT.Resize event.

Anyway check the below code:

Output

Code !!

Note You have to provide image.png

import org.eclipse.swt.SWT;
import org.eclipse.swt.custom.ScrolledComposite;
import org.eclipse.swt.graphics.Color;
import org.eclipse.swt.graphics.GC;
import org.eclipse.swt.graphics.Image;
import org.eclipse.swt.graphics.Rectangle;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.layout.FormLayout;
import org.eclipse.swt.layout.GridData;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Event;
import org.eclipse.swt.widgets.Label;
import org.eclipse.swt.widgets.Listener;
import org.eclipse.swt.widgets.Shell;

public class ImageGradientTest {

    private Image imageGradient;
    private Image image;

    private void createComponents(Shell parent) 
    {
        ScrolledComposite sc = new ScrolledComposite(parent, SWT.BORDER_SOLID | SWT.V_SCROLL);
        sc.setExpandHorizontal(true);
        sc.setExpandVertical(true);

        sc.setAlwaysShowScrollBars(true);
        sc.setMinWidth(0);

        GridData gd = new GridData(GridData.FILL, GridData.FILL, true, true);
        sc.setLayoutData(gd);
        sc.setLayout(new GridLayout(1, false));


        final Composite composite = new Composite(sc, SWT.NONE);
        composite.addListener(SWT.Resize, new Listener() {
            public void handleEvent(Event e) {
                changeImage(composite);
            }
        });
        composite.setLayout(new FormLayout());
        composite.setBackgroundMode(SWT.INHERIT_DEFAULT);

        Label label = new Label(composite, SWT.None);
        label.setText("Hello, World!");

        sc.setContent(composite);
        sc.layout();

    }

    private void changeImage(Composite composite) 
    {
        Image oldImage = imageGradient;

        Display display = composite.getDisplay();
        Rectangle rect = composite.getClientArea();
        imageGradient = new Image(display, image, SWT.IMAGE_COPY);


        GC gc = new GC(imageGradient);
        Color color1 = new Color(display, 200, 200, 255);
        Color color2 = new Color(display, 255, 255, 255);

        gc.setAlpha(245);           // Two have a layer effect you should set the alpha
        gc.setForeground(color1);
        gc.setBackground(color2);
        gc.fillGradientRectangle(rect.x, rect.y, rect.width, rect.height, true);

        color2.dispose();
        color1.dispose();
        gc.dispose();


        composite.setBackgroundImage(imageGradient);

        if (oldImage != null) {
            oldImage.dispose();
        }
    }

    private void openShell() 
    {
        Display display = new Display();

        Shell shell = new Shell(display);
        shell.setLayout(new FillLayout());

        image = new Image(display, "image.png");

        shell.setBackgroundImage(image);
        shell.setBackgroundMode(SWT.INHERIT_DEFAULT);

        createComponents(shell);

        shell.open();

        while (!shell.isDisposed()) {
            if (!display.readAndDispatch()) {
                display.sleep();
            }
        }

        image.dispose();
        imageGradient.dispose();        
        display.dispose();
    }

    public static void main(String[] args) {
        ImageGradientTest sweet = new ImageGradientTest();
        sweet.openShell();
    }
}

Code for capturing client area image !!

Display display = composite.getDisplay();
Rectangle rect = composite.getClientArea();
Image i = new Image(display, composite.getClientArea().width, composite.getClientArea().height);
GC gc = new GC(i);

composite.print(gc);            // This is important

ImageLoader loader = new ImageLoader();
loader.data = new ImageData[]{i.getImageData()};
loader.save("hello.png", SWT.IMAGE_PNG);

gc.dispose();
i.dispose();

Although check this link as the approach is not cross-platform.