I’m having a tough time figuring out how to get my UI to do something, and I’m hoping someone can help me out.
Here’s a mock-up of what I’m trying to achieve:
I have a SplitPanel, and inside the left vertical layout of the split panel I have a Tree component, followed by that Upload button. I want the Tree component to be scrollable, but I always want that Upload button to remain fixed at the bottom of the SplitPanel layout. So if I expand the Tree (which could grow to several hundred items), I want to be able to scroll the Tree only.
I tried putting the Tree component into a Panel (styled with Reindeer.PANEL_LIGHT) and turned scrolling on for the panel. I then added the Panel and the upload Button to the SplitPanel’s left VerticaLayout, with expand ratios set for 90% and 10% respectively to keep the button at the bottom.
This didn’t seem to work. First of all, the scroll bar doesn’t show. Also, when I expand the second item to show the many sub-items, the Upload button is pushed out of view.
It should be possible to achieve wanted layout with the following code.
//...
Panel panel = new Panel();
panel.setScrollable(true);
panel.addComponent(tree);
panel.setSizeFull();
Layout leftLayout = new VerticalLayout();
// this is important, since otherwise the size of the leftLayout is undefined
leftLayout.setSizeFull();
leftLayout.addComponent(panel);
leftLayout.addComponent(uploadButton);
leftLayout.setExpandRatio(panel, 1);
splitPanel.setOrientation(SplitPanel.ORIENTATION_HORIZONTAL);
splitPanel.setFirstComponent(leftLayout);
splitPanel.setSecondComponent(rightLayout);
mainWindow.addComponent(splitPanel);
//...
Thanks for the code sample. I had basically the same code, but realized after I compared yours to mine that I forgot to set the size of the Panel after defining it.
This gets me all the time (smile). I know that you have to define the size of your component layouts to get things to line up the way you want, and I thought I had it all covered. It of course worked exactly as it should once I added the panel.setSizeFull() method call.
