Skip to Content
author's profile photo Former Member
Former Member

What's the Difference Between RowLayout, FlowLayout, MatrixLayout and Grid?

I saw there are a few selections for the layout.

I don't quite understand what's the difference and when I should use which one layout in my scenario.

Does anyone know and give me info details about this?

Add a comment
10|10000 characters needed characters exceeded

Assigned Tags

Related questions

7 Answers

  • Best Answer
    author's profile photo Former Member
    Former Member
    Posted on Feb 27, 2009 at 02:03 AM
    Add a comment
    10|10000 characters needed characters exceeded

  • author's profile photo Former Member
    Former Member
    Posted on Feb 27, 2009 at 02:07 AM
    Add a comment
    10|10000 characters needed characters exceeded

  • author's profile photo Former Member
    Former Member
    Posted on Feb 27, 2009 at 06:08 AM

    Hi Shreya,

    /people/bertram.ganz/blog/2008/11/28/best-practices-for-building-state-of-the-art-web-dynpro-java-user-interfaces

    https://www.sdn.sap.com/irj/scn/wiki?path=/display/wdjava/layout+managers

    Thanks,

    Tulasi

    Add a comment
    10|10000 characters needed characters exceeded

  • author's profile photo Former Member
    Former Member
    Posted on Feb 27, 2009 at 02:39 PM

    Flow Layout

    a) This Layout is the default layout for all container UI elements.

    b) You have no direct control of over the position of UI elements managed by the Flow Layout . The UI elements will position themselves form left to right across the screen, and will automatically wrap to the next line when right-hand screen margin is encountered.

    c) This Layout is most useful when managing other container UI elements.

    d) No vertical allignment

    Row Layout

    a) The RowLayout manager allows UI elements to be arranged into specific rows.

    b) You can specify that a certain UI element will appear at the start of a new row by setting the layoutData property to RowHeadData

    c) No vertical allignment

    d) If the screen is not wide enough to accomodate all the UI elements in a particular row, then the UI elements will flow around to the next row in exactly the same way as flow layout.

    MatrixLayout

    a) Allow UI elements to be arranged into specific rows and provide vertical allignment of the UI elements between different rows.

    b) You can specify that a certain UI element sill appear at the start of a new row by setting the layoutData property to MatrixHeadData.

    GridLayout

    a) Equal number of columns per row.

    b) You nee dto specify the number of columns in the grid.

    c) Once you specify the number of columns in the grid, the UI elements are added in a left to right, top-to-bottom manner.

    d) Vertical allignment.

    Hope this will help you.

    Rgards

    Shanmukha Rao Banisetti

    Add a comment
    10|10000 characters needed characters exceeded

  • author's profile photo Former Member
    Former Member
    Posted on Feb 27, 2009 at 02:58 AM

    Hi

    I guess you can create a simple form and then try with different Layouts which can help you .

    murali

    Add a comment
    10|10000 characters needed characters exceeded

  • Posted on Feb 27, 2009 at 04:56 AM

    Hi Shreya

    Keep in mind that It also a performance factor to use a particular layout and u can see the nesting of the underlying Container by pressing CTRLSHIFTALT+O .I explain the hierarchy of preference along with the uses of the available Layout

    1. By default view having Flow Layout : Simplest one among all,Use : it required when a series of UI element

    sequentially arranges in the container,we cannot describe defined line break

    Gives the best performance because runtime don't spend time to look in the property of the layout

    2. RowLayout : it sequentially assigns the UI elements to exactly one column. It is a great advantage of the row layout that we can easily create consistent layout structures using the predefined cell classes,

    3.ColumnLayout : It a new Layout in CE 7.1 more or less it same as Row layout except It has LayoutData

    Properties to define like cell design and Vgutter.

    4. MatrixLayout : A matrix layout arranges the container children in a tabular format, You can use the properties stretchedHorizontally and stretchedVertically to specify whether or not the UI elements match the container size. You cannot explicitly define the number of columns, for example, which you can do when using the grid layout. Instead you assign a IWDMatrixHeadData object to a UI element so this UI element is wrapped. It is a great advantage of the matrix layout that you can easily create consistent layout structures.

    5. GridLayout : A grid layout arranges the container children in a two-dimensional grid with a defined column number and any number of rows. Line breaks can be defined. Line breaks are automatically inserted when a UI element is too long to be displayed within one row. In Most case we avoid this layout in containers.

    For further Best Practices follow [this|https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/e0e682bd-b59e-2b10-cd82-fa175f502fe6] and [this|https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/b06c8c9a-19a4-2b10-d985-9ae7a4383478]

    experts guide .

    Best Regards

    Satish Kumar

    Add a comment
    10|10000 characters needed characters exceeded

  • author's profile photo Former Member
    Former Member
    Posted on Feb 27, 2009 at 06:50 PM

    Hi Shreya,

    The definitions of various Layouts have been explained in detail in the posts above. You should also consider the performance perspective when selecting the layout you need to you. There is document by Bertram Ganz which explain the performance impact of different layout. You can do through this document from page 10 onwards.

    [https://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/604ddc2f-ec9c-2b10-1682-be37e1c62dee]

    Regards,

    Sanyev

    Add a comment
    10|10000 characters needed characters exceeded

Before answering

You should only submit an answer when you are proposing a solution to the poster's problem. If you want the poster to clarify the question or provide more information, please leave a comment instead, requesting additional details. When answering, please include specifics, such as step-by-step instructions, context for the solution, and links to useful resources. Also, please make sure that you answer complies with our Rules of Engagement.
You must be Logged in to submit an answer.

Up to 10 attachments (including images) can be used with a maximum of 1.0 MB each and 10.5 MB total.