Details Component Sizing

Vaadin 6 / 7 / 8 Framework UI
1

Hi,
newbie with newbie-question here:

How do I determine the size of a (custom) Details Component?

Is there a way to ensure that the unfolding content (a text) is not wider than the Summary above?
This is ment from a visual point of view, so I’m speaking of the visible change that happens when you use e.g. the ThemeVariant filled.
I am also not able to create this behavior properly by using the Layout that contains the Detail-Component

I basically want this behavior:


**********************************      
*        some component          *     
*        width Verticallayout    *   
**********************************

unfolds to:

**********************************      
*        some component          *     
*        width Verticallayout    * 
*                                *
*    content (Text)              *
*   that is pretty long          * 
**********************************

instead of unfolding into:

************************************************************      
*        some component                                    *     
*        width Verticallayout                              * 
*                                                          *
*    content (Text)           that is pretty long          * 
************************************************************
2

I am also struggling with this exact issue. A VerticalLayout in Details seems to act as a HorizontalLayout.

3

Hi Nico,

I think you might be in the wrong forum. :wink: “Framework” is intended for Vaadin versions below 10 while “Flow” is for 10+. I assume you’re working with 10+ if you’re the Details component?

Anyway, I’m not exactly sure how to reproduce the problem. Could you post a code snippet showcasing the issue?

4

Damian Carey:
I am also struggling with this exact issue. A VerticalLayout in Details seems to act as a HorizontalLayout.

Hi Damian,

As posted above, I couldn’t reproduce such a situation. Do you have an example?