I want to use group boxes to improve my GUI. However when adding components to a Group they move to the center of the box and are not left aligned anymore. How do I get each button and text to move to the left margin.
Code
GridLayout layout = new GridLayout(1, true);
layout.marginWidth = 300;
Group group = new Group(this, SWT.SHADOW_OUT);
group.setText("Open file locations");
group.setLayout(layout);
Button optionOne = new Button(group, SWT.CHECK | SWT.LEFT);
optionOne.setText(AppMessages.msg("Open file A") );
Button optionTwo = new Button(group, SWT.LEFT | SWT.CHECK);
optionTwo.setText(AppMessages.msg("Open file B") );
Need Space between two groups
The buttons are left aligned but you have specified a margin of 300 pixels to go to the left of the buttons before the alignment is done.
The margin values your specify for a layout of a Group or Composite set the margins within the control.
Can u try to remove marginWidth from the layout
Related
I've a problem with an exercise. There is an unexplained space between the first and the second buttons on the scene. I've change the location of the buttons but still the first one has a space from the second one. What cause this and how can I make this space shorter?
https://imgur.com/hYolYE2
public void start(Stage myStage) {
GridPane myPane = new GridPane();
myPane.setPadding(new Insets(10, 10, 10, 10));
myPane.setHgap(10);
myPane.setVgap(10);
Button btn1 = new Button("Computer Scinence");
Button btn2 = new Button("Chemistry");
Button btn3 = new Button("Arts");
DrawText txt1 = new DrawText("Computer Scince","Times Roman",FontWeight.BOLD,FontPosture.ITALIC,20,Color.GREEN);
DrawText txt2 = new DrawText("Chemistry","Times Roman",FontWeight.BOLD,FontPosture.ITALIC,20,Color.BLUE);
DrawText txt3 = new DrawText("Arts","Times Roman",FontWeight.BOLD,FontPosture.ITALIC,20,Color.YELLOW);
GridPane.setConstraints(btn1,0,1);
GridPane.setConstraints(btn2,1,1);
GridPane.setConstraints(btn3,2,1);
GridPane.setConstraints(txt1,0,2);
GridPane.setConstraints(txt2,0,3);
GridPane.setConstraints(txt3,0,4);
myPane.getChildren().addAll(btn1,btn2,btn3,txt1,txt2,txt3);
Scene myScene = new Scene(myPane,350,190);
myStage.setScene(myScene);
myStage.setTitle("Exercise 3_3");
myStage.show();
}
You can often debug GridPane layout issues by turning on the grid lines:
myPane.setGridLinesVisible(true);
After recreating your application (you did not include your DrawText class, so I'm just styling Labels instead) and turning on the grid lines reveals the issue:
You can see that the Computer Science Label at GridPane location 0, 1 has a greater width than the Computer Science Button. This causes the GridPane to expand the width of the first column to accommodate the Label.
You have a couple of options to resolve this, depending on how you want the layout to work.
1) Set Column Span:
If you want to keep the Computer Science Button the same size, but have the first column's width not expand to fit the Label, just have that Label span 2 columns:
GridPane.setColumnSpan(txt1, 2);
2) Increase Button Width:
If you'd like the Computer Science Button to expand to fill the rest of the column, you can set its MaxWidth property to use the maximum value:
btn1.setMaxWidth(Double.MAX_VALUE);
I have an ArrayList of buttons, and I'm trying to set all the buttons the same size of the last button.
This is my code:
ArrayList <Button> buttons = new ArrayList<Button>();
Composite numbersComposite = new Composite(composite, SWT.NONE);
numbersComposite.setLayout(new GridLayout(5, true));
for (int i=0; i<=49; i++) {
Button b = new Button(numbersComposite, SWT.TOGGLE);
b.setText(""+i);
buttons.add(b);
}
for (Button b : buttons) {
b.setSize(buttons.get(buttons.size()-1).getSize());
}
Something is wrong because not all the buttons have the same size. Is there any problem with setSize method on Buttons with TOGGLE style?
Edit
I see that buttons.get(buttons.size()-1).getSize() is giving a Point with 0,0 value. Why?
Edit 2
I tried with this code but nothing happens! not all of them have the same size. Why is this?
Point point = new Point(20, 20);
for (Button b : buttons) {
b.setSize(point);
}
You are mixing layouts with absolute positioning, which doesn't work.
setSize will only work when you are not using layouts.
If you are using layouts (which is usually the best choice) then you should set the appropriate layout data to the components you want to display.
Since you are using GridLayout for the parent Composite, its children should set GridData as layout data; for example this GridData will make the buttons use all the available space in the parent Composite:
for (int i = 0; i <= 49; i++) {
Button b = new Button(numbersComposite, SWT.TOGGLE);
// set the layout data
GridData buttonLayoutData = new GridData(SWT.FILL, SWT.FILL, true, true);
b.setLayoutData(buttonLayoutData);
b.setText("" + i);
buttons.add(b);
}
Look to the constructors of GridData to see which other options you have.
Look here to know more about layouts in SWT: http://www.eclipse.org/articles/article.php?file=Article-Understanding-Layouts/index.html
I am facing issues in displaying notification count against an icon. It should be displayed at right top corner.
First created button with padding and margin as zero and set the image to button.
FlowLayout buttonLayout = new FlowLayout();
buttonLayout.setAlign(Component.CENTER);
buttonLayout.setValign(Component.TOP);
Container buttonContainer = new Container(buttonLayout);
buttonContainer.setUIID("IconContainer");
Button button = new Button(buttonImage);
button.setUIID("ButtonLabelNew");
buttonContainer.addComponent(button);
The created a notification count container and laid it over button
FlowLayout countLayout = new FlowLayout();
countLayout.setAlign(Component.RIGHT);
countLayout.setValign(Component.TOP);
Container countContainer = new Container(countLayout);
Label countLabel = new Label(displayCount);
countLabel.setUIID("backgroundLabel");
countContainer.addComponent(countLabel);
/*Adding Button and Notification Count to ItemContainer*/
Container itemContainer = new Container(new LayeredLayout());
itemContainer.addComponent(buttonContainer);
itemContainer.addComponent(countContainer);
Now added the text below the button
BoxLayout iconLayout = new BoxLayout(BoxLayout.Y_AXIS);
Container iconContainer = new Container(iconLayout);
Label iconText= new Label(buttonText);
iconText.setUIID("Label");
iconContainer.addComponent(0,itemContainer);
iconContainer.addComponent(1,iconText);
FInally created a grid and added icon containers to the grid
GridLayout gridLayout = new GridLayout(numRows, MAX_ITEMS_PER_ROW);
Container gridContainer = new Container(gridLayout);
gridContainer.setUIID("LogoContainer");
for (int indx = 0; indx < itemContainers.length; indx++)
{
gridContainer.addComponent(itemContainers[indx]);
}
approvalsWorklist.addComponent(BorderLayout.CENTER,gridContainer);
The image is positioned at the right hand side but the component is larger than the icon so you see the image positioned where the components are sized.
There are two ways to solve this for you.
Set a padding or margin on countContainer so the count will be spaced and placed in the right location. This has the drawback of having to tune based on a uniform icon size which might not be the case but its a relatively simple approach.
I'm assuming the components are placed in a GridLayout which means they all have the exact same size. You will wrap each element in the grid layout in a FlowLayout or a an absolute center BorderLayout they will take up their preferred size internally and then the badge will be positioned exactly within the icon edge.
I have scroller with 2 buttons
How i can set that the order of the buttons will be in the same raw and not each control : button scroller and button will be in different row
fComposite= new Composite(composite, SWT.RIGHT_TO_LEFT);
GridData layoutData= new GridData(SWT.FILL, SWT.RIGHT_TO_LEFT, true, false);
fComposite.setLayoutData(layoutData);
layout= new GridLayout(1, false);
layout.marginHeight= 0;
layout.marginWidth= 0;
layout.horizontalSpacing= 0;
layout.verticalSpacing= 0;
fComposite.setLayout(layout);
Display display = parent.getDisplay();
Shell shell = parent.getShell();
Button button = new Button(fComposite, SWT.LEFT);
button.setText("Two"); //$NON-NLS-1$
button.setImage(display.getSystemImage(ICON_1));
final Scale scale = new Scale (fComposite, SWT.BORDER);
Rectangle clientArea = fComposite.getClientArea ();
scale.setBounds (clientArea.x, clientArea.y, 200, 64);
scale.setMaximum (5);
scale.setPageIncrement (1);
scale.setSelection(5);
Button rButton = new Button(fComposite, SWT.RIGHT);
rButton.setText("Two"); //$NON-NLS-1$
rButton.setImage(display.getSystemImage(ICON_2));
Did you read the article about SWT layouts that I posted in one of your other questions?
The Display and Shell are the first things to create. After that you can add things to the shell.
Your problem is based on the fact, that you created a GridLayout with just one column. Thus all widgets are below each other.
layout= new GridLayout(1, false);
The first parameter is the number of columns. Set it to 3 for three columns.
Please read the documentation of the layout and the article: Understanding layouts in SWT before asking further questions. It will definitely help you.
I have a horizontal panel with 3 buttons: Back, Next and Cancel. I've made horizontal alignment to the right, but only Next and Cancel buttons follow this alignment.
Here is the code:
HorizontalPanel buttons = new HorizontalPanel();
buttons.setWidth("100%");
cancel = new Button("Cancel");
next = new Button("Next");
back = new Button("Back");
buttons.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_RIGHT);
buttons.add(back);
buttons.setCellWidth(back, "98%");
buttons.add(nextBtn);
buttons.setCellWidth(next, "1%");
buttons.add(cancel);
buttons.setCellWidth(cancel, "1%");
The problem is with this panel width. But if I delete it, all my buttons are left aligned. As a workaround I can use false button, that will be invisible and has cell width = 97%, the cell width of back button is 1%. But this is not what I need, because inspite of small amount of memory this invisible button consumes, it is still a memory :)
What is going wrong with this alignment? Maybe something is wrong with panel width? Hope for your help, thank you in advance.
There is setCellHorizontalAlignment() property in HorizontalPanel. With it you can give alignment to its widgets.
Try following:
buttons.setCellHorizontalAlignment(backButton, HasHorizontalAlignment.ALIGN_RIGHT);
buttons.setCellHorizontalAlignment(nextButton, HasHorizontalAlignment.ALIGN_RIGHT);
buttons.setCellHorizontalAlignment(cancelButton, HasHorizontalAlignment.ALIGN_RIGHT);
You can achieve this much easier using css:
FlowPanel panel = new FlowPanel();
panel.setWidth("100%");
cancel = new Button("Cancel");
cancel.getElement().getStyle().setFloat(Float.RIGHT);
next = new Button("Next");
next.getElement().getStyle().setFloat(Float.RIGHT);
back = new Button("Back");
back.getElement().getStyle().setFloat(Float.RIGHT);
panel.add(back);
panel.add(nextBtn);
panel.add(cancel);