How to set background image for Dialog?

Question

I am trying to do this:

public class DialogMenuHawaii extends Dialog {

    Style s = UiFactory.getBaseStyle();
    s.setBgTransparency(0);
    s.setBgImage( <my image >);
    this.setUnselectedStyle(s);
}

but it doesn't work.

Answer 1

Open your '.res' file in resource Editor and select your preferred theme,

1. Under 'Unselected' tab open the DialogContentPane style, if you don't have one create it look at the end of this answer on HOW TO DO IT?, and set the background image to the image you need to show as Dialog bg
2. Under 'Unselected' tab open the DialogBody style, if you don't have one create it look at the end of this answer on HOW TO DO IT?, and set the background transparency as '0' and also make sure the background image type is NONE

NOTE: The above code will reflect for all the Dialogs in your application. If you want a particular dialog with background image than derive new styles from these default styles, and follow the above steps to apply it to your DialogMenuHawaii or any runtime Dialogs.

HOW TO: I would recommend you to go through the Shai's blog posts LWUIT Resource Editor Tutorial Part 1 till part 10. To better understand the Resouce Editor its features and capabilities.

:

:

:

PS: Programmatic-ally i haven't been able to achieve it using TextArea which is the case for default Dialog's. If you replace the dialog body component with Label if works fine, the code sample is given below. I haven't delved much into why is it so ? maybe will do it in my free time. Hence i have proposed a working alternative solution which is scripted above using Resource Editor and below using the code

class MyDialog extends Dialog {

    public void show() {
        Container octnPane = this.getDialogComponent();
        octnPane.getUnselectedStyle().setBgTransparency(0, false);

        Container ctnPane = (Container)((BorderLayout)octnPane.getLayout()).getCenter();
        ctnPane.getUnselectedStyle().setBackgroundType(Style.BACKGROUND_IMAGE_SCALED, false);
        ctnPane.getUnselectedStyle().setBgImage(myImage, false);

        Label t = new Label("Dialog");
        t.setUIID("DialogBody");
        t.getUnselectedStyle().setBgTransparency(0, false);
        ctnPane.addComponent(t);

        super.show();
    }
}

Answer 2

First, I suggest you use a theme. We constantly change small implementation details e.g. customizations like the one you are doing will not be portable between LWUIT 1.4 and 1.5. There is no reason whatsoever not to use a theme for something like this.

If you are interested in the pain and suffering of manually coding view logic into your application you can use several methods such as getDialogComponent() to get the style from them and manipulate that. Dialog is a complex beast due to the fact that its really a form padded away from the edges.

Answer 3

This is for Dialog background.

Dialog dialog = new Dialog();
dialog.getDialogStyle().setBgImage(Image.createImage("/image/image.png"));

If you want to set transparency of Dialog with image.

dialog.getStyle().setBgImage(Image.createImage("/image/image.png");