Search code examples
codenameone

How do I spotlight a component and show hint on a dialog?

I have a specific container on a form. I want to pop up a dialog and show the container with hints on the dialog. Please reference the image below.

enter image description here

1.Capature outlook of the container as an image and shown on the dialog, but I don't know how to capture outlook of a component?

2.Show the container on the dialog, but a componet can't be contined on mutiple containers.

Any suggestion?

Solution

  • The dialog is the easy part. Use showPopupDialog on InteractionDialog. You can target it on a specific component and it will point at that component for the interaction. So far so good.

    The darkening of the rest of the form and blocking other input is harder. You can add a layered pane that would fill the rest of the form in translucent black and block input. The main problem is avoiding the areas of the dialog and of the component. For that I suggest creating a shape the size of the Form, then placing translucent components in all the areas where the components aren't.

    There are several ways to do that. One of them is to create a special layout manager that positions the dummy components in the absolute coordinates of their "parent" components. That way they will block the input for the underlying components and hide them. It will also work on rotation since the positions would be synchronized.