How to hide tab's body when tabs are minimized - javafx-2

I want to create JavaFX tabs which can be minimized and shrieked vertically. Something like this:
I only want to display the tab names and remove the body. Setting the vertical position of the tabs is easy:
tabPane.setSide(Side.RIGHT);
The problem is how I can remove the body of the tabs?
TabPane tabPane = new TabPane();
Tab tab0 = new Tab("blue");
tab.setContent(new Rectangle(200,200, Color.BLUE));
Tab tab1 = new Tab("green");
tab.setContent(new Rectangle(200,200, Color.GREEN));
tabPane.getTabs().addAll(tab0, tab1);

Related

Codename One - customize Dialog style not working

I would like to have a customized Dialog styling, having another background color and a rounded border, as it looks nicer than the gray rectangle that comes by default.
This is partially possible, by styling the Contentpane of the Dialog. The problem is, that the underlying Dialog Style is still there, in which the contentpane is shown. And it seems the Dialog UDID itself cannot be changed, nor can the "Dialog" style be overwritten in the designer nor by code.
Form hi = new Form();
hi.getUnselectedStyle().setBgColor(0xffffff);
Button but = new Button("open dialog");
but.addActionListener(e -> {
Dialog d = new Dialog(BoxLayout.y());
d.setUIID("Container"); // this line has no effect, the outside dialog component is still visible
Style s = d.getContentPane().getUnselectedStyle();
s.setBorder(RoundRectBorder.create());
s.setBgColor(0x00ff00);
s.setBgTransparency(255);
s.setMargin(5, 5, 5, 5); // adding some margin between contentpane and Dailog container, to be more obvious
d.setDisposeWhenPointerOutOfBounds(true);
// title
Label title = new Label();
title.setText("Confirmation");
d.add(title);
// body field with spanlabel info text
SpanLabel bodyLabel = new SpanLabel("Body Text");
d.add(bodyLabel);
// delete button
Button okButton = new Button("Ok");
okButton.addActionListener(e2 -> {
d.dispose();
});
// exit button
Button exitButton = new Button("Cancel");
exitButton.addActionListener(e3 -> {
d.dispose();
});
d.add(GridLayout.encloseIn(2, okButton, exitButton));
d.show();
});
hi.add(but);
hi.show();
In above image, the outermost dark gray is the tinted area outside the dialog. The green is the content pane with the intended rounded border. the light grey in between comes from the Dialog style that I would like to get rid off.
Can this be done?
Short answer: setDialogUIID("Container");
However dialogs are a bit problematic to customize via code, I would strongly recommend styling them via the designer/css as we just didn't design them for hand styling and so you're relying on internal implementation details that might break.
When you invoke getContentPane() on the Dialog you're styling the content pane of the Dialog. Not the Dialog itself so the dialog styling still has the non-transparent background. You can use getDialogStyle() to style the Dialog itself. I'm not sure how well that will work.

JavaFX Menu Flow

I have an application with two menu bars (application menus and administration menus) on the top row and a search box in between them. The first menu bar is left justified with the search box immediately following while the second menu is right justified. This leaves room for additional application menus without moving the administration menus.
I tried an HBox, but can't get the second menu right justfied.
I tried using an AnchorPane and anchoring the application menu to the left and the admin menu to the right. This works fine until you resize it. When the display gets too small to show both menus it starts truncating letters. I want it to wrap the second menu to the next line.
I tried using a FlowPane which works great for getting one to flow under the other when resized, but I can't get the second menu reliable right justified. I tried a trick of putting a listener on the parent width and calculating the hgap to use, but the first time this gets called, the menu bars have a size of 0 and so the hgap is too big for the actual menus. After I resize it once, that trick works beautifully.
Even better would be a menuBar that could flow automatically so that I didn't have to break it up to allow it to wrap around. But if that capability exists, I've been unable to find it.
AFAIK MenuBar does not support wrapping its Menus.
There can be different approaches to achieve the layout you want. One of them at the below.
To align the second admin flowPane to the right, use HBox.setHgrow for flowPane. To align menu bars in flowPane, use flow.setAlignment(Pos.TOP_RIGHT):
#Override
public void start(Stage primaryStage) {
final Menu menu01 = new Menu("App Menu 1");
final Menu menu02 = new Menu("App Menu 2");
final Menu menu1 = new Menu("Admin Menu 1");
final Menu menu2 = new Menu("Admin Menu 2");
final Menu menu3 = new Menu("Admin Menu 3");
MenuBar menuBar0 = new MenuBar();
menuBar0.getMenus().addAll(menu01, menu02);
menuBar0.setMinWidth(220); // do not shrink
MenuBar menuBar1 = new MenuBar();
menuBar1.getMenus().addAll(menu1);
MenuBar menuBar2 = new MenuBar();
menuBar2.getMenus().addAll(menu2);
MenuBar menuBar3 = new MenuBar();
menuBar3.getMenus().addAll(menu3);
FlowPane flow = new FlowPane(Orientation.HORIZONTAL);
// flow.setStyle("-fx-background-color: gray; -fx-border-color: red"); // visual debug
flow.setAlignment(Pos.TOP_RIGHT);
flow.setHgap(0);
flow.getChildren().addAll(menuBar1, menuBar2, menuBar3);
TextField searchField = new TextField();
searchField.setPromptText("Search here..");
// make it unresizable
searchField.setMinWidth(200);
searchField.setMaxWidth(200);
HBox mainBox = new HBox(5);
mainBox.setAlignment(Pos.CENTER_LEFT);
HBox.setHgrow(flow, Priority.ALWAYS);
mainBox.getChildren().addAll(menuBar0, searchField, flow);
mainBox.setStyle("-fx-background-color: lightgray;");
VBox vBox = new VBox(0);
vBox.getChildren().addAll(mainBox, new Button("Demo"));
Scene scene = new Scene(vBox);
primaryStage.setScene(scene);
primaryStage.show();
}

lwuit number of tabs

I have created number of LWUIT Tabs,when i display those tabs on my form Screen,i am able to see only 4 tabs on my form screen,remaining tabs are displaying but those are hiding,How to display my form with tabs userfriendly?
tabs.addTab("Tab1", newsList);
tabs.addTab("Tab2", myNewsList);
tabs.addTab("Tab3", cinemaNewsList);
tabs.addTab("Tab4", gossipList);
tabs.addTab("Tab5", list);
tabs.addTab("Tab5", list);
form1.addComponent(BorderLayout.CENTER, tabs);
form1.show();
It will differ based on the screen size. If your screen size is 240*320, it will show only 4 tabs. If your screen size is 320*240, it will show all 6 tabs.
You can do it in only one way by using buttons.
int tabsCount = 6;
Button btnOne = new Button(" Tab 1 ");
btnOne.setPreferredW(Display.getInstance().getDisplayWidth()/tabsCount);
Button btnTwo = new Button(" Tab 2 ");
btnTwo.setPreferredW(Display.getInstance().getDisplayWidth()/tabsCount);
Button btnThree = new Button(" Tab 3 ");
btnThree.setPreferredW(Display.getInstance().getDisplayWidth()/tabsCount);
Button btnFour = new Button(" Tab 4 ");
btnFour.setPreferredW(Display.getInstance().getDisplayWidth()/tabsCount);
Button btnFive = new Button(" Tab 5 ");
btnFive.setPreferredW(Display.getInstance().getDisplayWidth()/tabsCount);
Button btnSix = new Button(" Tab 6 ");
btnSix.setPreferredW(Display.getInstance().getDisplayWidth()/tabsCount);
tabs.addTab(btnOne, new Label("Tab one selected"));
tabs.addTab(btnTwo, new Label("Tab Two selected"));
tabs.addTab(btnThree, new Label("Tab three selected"));
tabs.addTab(btnFour, new Label("Tab four selected"));
tabs.addTab(btnFive, new Label("Tab five selected"));
tabs.addTab(btnSix, new Label("Tab six selected"));
It won't display the text of the button fully in small screens. But, when that tab is focused that title will be displayed as ticker.

How to display a Form Screen on LWUIT Tabs?

I have list items on form, I have to display that form on tabs, when the user clicked on a tab.
How to add that form to tab, after form.show() or before?
I need to display first tab as default with Form Screen?
You can display form in Tabs. Form is also a component.
Form frmObj = new Form("Tabs Example");
Form frmOne = new Form("One");
Form frmTwo = new Form("Two");
Tabs tabObj = new Tabs();
tabObj.addTab("Form One",frmOne);
tabObj.addTab("Form Two",frmTwo );
frmObj.addComponent(tabObj);
frmObj.show();

Adding vertical field manager within a horizontal field manager that itself lies in a vertical field manager-Blackberry

I am creating 3 buttons in a horizontal field manager so that they are aligned in center of screen horizontally.
This is being done on a tabpane manager that contains 3 tabs.The implementation is within the first tab of the pane.All the code held in this pane is within a vertical field manager.
I have gone through the following link for creation of buttons
How to put two buttons in Horizontal field manager in blackberry for any device?
It advises adding a vertical field manager to a horizontal field manager.In my code there is another vertical field manager that is holding this horizontal field manager.
Here is my code:
// setup the tab model with 3 tabs
final PaneManagerModel model = new PaneManagerModel();
model.enableLooping( true );
// setup the first tab
VerticalFieldManager vfm = new VerticalFieldManager(
Field.USE_ALL_HEIGHT | Field.USE_ALL_WIDTH |
Manager.NO_VERTICAL_SCROLL | Manager.NO_HORIZONTAL_SCROLL );
LabelField lbl = new LabelField( "Content for tab 1", Field.FOCUSABLE );
vfm.add( lbl );
//Add one button to the form normal way
ButtonField gl = new ButtonField(" Group ",ButtonField.FIELD_HCENTER | ButtonField.CONSUME_CLICK);
// sms.setChangeListener(new FieldChangeListener());
gl.setChangeListener(new FieldChangeListener()
{
public void fieldChanged(Field field,int context)
{
model.getView().jumpTo(1,PaneManagerView.DIRECTION_NONE);
}
});
vfm.add(gl)
//Second button
//SMS send from form
ButtonField sms = new ButtonField(" Sms ",ButtonField.FIELD_HCENTER | ButtonField.CONSUME_CLICK);
vfm.add(sms);
//Adding horizontal field manager(MAIN IMPLEMENTATION)
HorizontalFieldManager buttonPanel = new HorizontalFieldManager(Field.FIELD_HCENTER | Field.USE_ALL_WIDTH);
buttonPanel.add(vfm);//Gives error at this point
// buttonPanel.add(sms);
buttonPanel.add(new ButtonField(" Send Mail "));
add(buttonPanel);
//Ideal way posted on that link
VerticalFieldManager vfm = new VerticalFieldManager(USE_ALL_WIDTH);
vfm.add(new ButtonField("button2",Field.FIELD_RIGHT));
HorizontalFieldManager hfm = new HorizontalFieldManager();
hfm.add(new ButtonField("button1"));
hfm.add(vfm);
add(hfm);
I am totally confused with the layout managers to be used here.
Please guide.Thanks

Resources