Win a copy of The Little Book of Impediments (e-book only) this week in the Agile and Other Processes forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

New to GUI - Layout Managers

 
Glen Iris
Ranch Hand
Posts: 172
Chrome Java Netbeans IDE
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi All,

The general layout of my GUI will be as such:

-----------------------------------------------------------------------------
| XXXXXXXXXXXXXXXXX| YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY | top
-----------------------------------------------------------------------------
|results table | middle
-----------------------------------------------------------------------------
| button4 button5 | bottom
-----------------------------------------------------------------------------

I have spent two days trying out various techniques to get this layout but with no success. Can you please help me out and let me know if the below its possible.

As you can see, there are 3 rows - top, middle and bottom. Within each of these rows is a jPanel.

I am still unsure as to how to apporach this. Should I give a box layout to the content pane and then add 3 jPanels to the content pane? Do you have better suggestions?




 
Roel De Nijs
Sheriff
Posts: 10662
144
AngularJS Chrome Eclipse IDE Hibernate Java jQuery MySQL Database Spring Tomcat Server
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
First an interesting tutorial about using layout managers.

Secondly some hopefully useful tips:
  • Use a BorderLayout for your window (dialog). Such a layout has 5 regions (as you can see in the tutorial)
  • at the top (area PAGE_START) you set your top JPanel
  • in the center (area CENTER) you set your middle JPanel (containing the results table)
  • at the bottom (area PAGE_END) you set your bottom JPanel


  • Each of the JPanels you add to your window can have a different layout. If you want the buttons in your bottom JPanel to be in a row, you should use a FlowLayout. If you want a nice looking search form (which will be at the top of your window I guess) you'll need a GridBagLayout. That's one of the more advanced and complex layout managers in Java. I used exactly the same layout managers to create my main window. From my main window class:


    Hope it helps!
    Good luck!
     
    Glen Iris
    Ranch Hand
    Posts: 172
    Chrome Java Netbeans IDE
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Hello Again Roel,

    This looks like the solution for me. However, is it possible for me to specify the maximum heights of the top and bottom rows while allowing the middle row to grow with the results table?
     
    Roel De Nijs
    Sheriff
    Posts: 10662
    144
    AngularJS Chrome Eclipse IDE Hibernate Java jQuery MySQL Database Spring Tomcat Server
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    You can set for example a preferred viewport size for the JTable using JTable.setPreferredScrollableViewportSize. When more rows are present in the table, a scrollbar will be shown.
     
    Glen Iris
    Ranch Hand
    Posts: 172
    Chrome Java Netbeans IDE
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Im sorry, I didnt word my question very well.

    Using the solution you proposed in your first reply to this thread. If the window is maximized/made larger, the distance between the jpanels increases. This leads to a large amount of unused space. I have been trying to find a solution whereby, instead of all panels increasing in both width and height, the top and bottom panels only increase in width and the middle panel increases in both width and height. So,

    Current Behaviour:

    regular size:
    -------------------------------
    |
    -------------------------------
    |
    -------------------------------
    |
    -------------------------------
    maximized:
    -----------------------------------------------------------------------------
    |
    |
    |
    -----------------------------------------------------------------------------
    |
    |
    |
    -----------------------------------------------------------------------------
    |
    |
    |
    -----------------------------------------------------------------------------

    Desired Behaviour:

    regular size:
    -------------------------------
    |
    -------------------------------
    |
    -------------------------------
    |
    -------------------------------
    maximized:
    -----------------------------------------------------------------------------
    |
    -----------------------------------------------------------------------------
    |
    |
    |
    -----------------------------------------------------------------------------
    |
    -----------------------------------------------------------------------------
     
    Roel De Nijs
    Sheriff
    Posts: 10662
    144
    AngularJS Chrome Eclipse IDE Hibernate Java jQuery MySQL Database Spring Tomcat Server
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    I just ran my application and it shows your desired behaviour. And I didn't do anything different than I described, except for the JTable. When adding this table to the CENTER area I wrapped it in a JScrollPane.

     
    Glen Iris
    Ranch Hand
    Posts: 172
    Chrome Java Netbeans IDE
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Ok Roel. Thank you. I am obviously missing something but Ill need a break from it before I spot it. Thanks again.
     
    Glen Iris
    Ranch Hand
    Posts: 172
    Chrome Java Netbeans IDE
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Roel,

    I am trying to get my results table (middle row) to left justify. Is this possible if it is in the BorderLayout.CENTER position?

    -----------------------------------------------------------------------------
    |
    -----------------------------------------------------------------------------
    | ...................................RESULTS TABLE HEAD............................
    | ...................................RESULTS TABLE CONTENT......................
    | ...................................RESULTS TABLE CONTENT......................
    -----------------------------------------------------------------------------
    |
    -----------------------------------------------------------------------------

    Ideally:

    -----------------------------------------------------------------------------
    |
    -----------------------------------------------------------------------------
    | RESULTS TABLE HEADRESULTS TABLE HEADRESULTS TABLE HEAD
    | RESULTS TABLE CONTENTRESULTS TABLE CONTENTRESULTS TABLE CONTENT
    | RESULTS TABLE CONTENTRESULTS TABLE CONTENTRESULTS TABLE CONTENT

    -----------------------------------------------------------------------------
    |
    -----------------------------------------------------------------------------
     
    Roel De Nijs
    Sheriff
    Posts: 10662
    144
    AngularJS Chrome Eclipse IDE Hibernate Java jQuery MySQL Database Spring Tomcat Server
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    I am not experiencing the behavior you described. The results table uses all space it has. I don't see any white space before or after the table
     
    K. Tsang
    Bartender
    Posts: 3585
    16
    Android Java
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Glen Iris wrote:Roel,

    I am trying to get my results table (middle row) to left justify. Is this possible if it is in the BorderLayout.CENTER position?


    Hi Glen

    What you are describing isn't the problem with the LayoutManager but with the JTable. JTable can set text alignment for each column/cell. You may want to check out TableCellRenderer.
     
    Glen Iris
    Ranch Hand
    Posts: 172
    Chrome Java Netbeans IDE
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Ok. got it.

    frame.add(topPanel, BorderLayout.PAGE_START);
    frame.add(scrollPane, BorderLayout.CENTER); //scroll pane is important code below:
    frame.add(btmPanel, BorderLayout.PAGE_END);


    JTable table = new JTable(data, headers);
    JScrollPane pane = new JScrollPane(table);
    pane.setVerticalScrollBarPolicy(JScrollPane.VERTICAL_SCROLLBAR_AS_NEEDED);
    pane.setHorizontalScrollBarPolicy(JScrollPane.HORIZONTAL_SCROLLBAR_AS_NEEDED);

    Thanks Roel and K. Tsang for the inspiration and ideas.
     
    Roel De Nijs
    Sheriff
    Posts: 10662
    144
    AngularJS Chrome Eclipse IDE Hibernate Java jQuery MySQL Database Spring Tomcat Server
    • Mark post as helpful
    • send pies
    • Quote
    • Report post to moderator
    Glad to hear you nailed it!
     
    • Post Reply
    • Bookmark Topic Watch Topic
    • New Topic