Component.getChildren()

Hello.

I have one VerticalLayout and two Buttons. Buttons are the children of VerticalLayout.
Each Button has own id.

How can I get the second Button Id using getChildren() method of VerticalLayout?

This may be a too difficult way of doing it, but should work:

        VerticalLayout vl = new VerticalLayout();
        Button first = new Button("First");
        first.setId("first-button");
        Button second = new Button("Second");
        second.setId("second-button");
        vl.add(first, second);
        wantedButton = vl.getChildren().filter(child -> {
            if (child.getId().isPresent() && child.getId().get().equals("second-button")) {
                return true;
            } else {
                return false;
            }
        } ).findFirst().get();

Olli Tietäväinen:
This may be a too difficult way of doing it, but should work:

        VerticalLayout vl = new VerticalLayout();
        Button first = new Button("First");
        first.setId("first-button");
        Button second = new Button("Second");
        second.setId("second-button");
        vl.add(first, second);
        wantedButton = vl.getChildren().filter(child -> {
            if (child.getId().isPresent() && child.getId().get().equals("second-button")) {
                return true;
            } else {
                return false;
            }
        } ).findFirst().get();

Hi. Thanks for reply.

I just need to get the second Button Id. I don’t know its Id i just want to get it.

For example we can get vl second component’s id like vl.getComponentAt(1).getId().get()

But how to get second Button Id if i have two Buttons which are inside in a VerticalLayout which is inside in another VerticalLayout?

In that case, you’d need iterate through the component tree recursively. Every Component has the getChildren() method, which you can use to iterate its child components. The order of iteration requires on what you need, so of you have

VerticalLayout
-HorizontalLayout
---ButtonA
---TextField
---ButtonB
-ButtonC

you need to define which is the “first” button (ButtonA or ButtonC?) and the “second” button (ButtonA, ButtonB or ButtonC)?

-Olli

Olli Tietäväinen:
In that case, you’d need iterate through the component tree recursively. Every Component has the getChildren() method, which you can use to iterate its child components. The order of iteration requires on what you need, so of you have

VerticalLayout
-HorizontalLayout
---ButtonA
---TextField
---ButtonB
-ButtonC

you need to define which is the “first” button (ButtonA or ButtonC?) and the “second” button (ButtonA, ButtonB or ButtonC)?

-Olli

Good example. In that case I need to get ButtonB Id, but getChildren() method can get only first child of the parent.

Right, so you call getChildren() for the VerticalLayout. The first result is the HorizontalLayout, for which you should also call getChildren(). Now the first child of the result set is ButtonA (which has no children), then next child is TextField and the last child is ButtonB.

Olli Tietäväinen:
Right, so you call getChildren() for the VerticalLayout. The first result is the HorizontalLayout, for which you should also call getChildren(). Now the first child of the result set is ButtonA (which has no children), then next child is TextField and the last child is ButtonB.

Yes, but how to get ButtonB Id? There are no methods to address to the other children of the component.

Can you, please, show it with code?

Thanks!

I guess the algorithm would go like this:

0. Create `buttonlist`, a new `List` of `Buttons`
1. Get a `list` of `Components` from the root `Layout` using `getChildren()`
2. For each `component` in a `list`:
2.3 Check if `component instanceof Button`. 
2.4 If yes, add it the `buttonlist`
2.5 Check if the length of the `buttonlist` is equal to 2
2.6 If yes, you have found the second Button and you can quit the algorithm
2.7 Check if the `component` has child components. 
2.8 If yes, take the child components using `getChildren()` and run the same algorithm for the `new list`, starting from 2 (but retaining `buttonlist`)