Need some guidance on SWT code

Started by Manj75, June 24, 2021, 07:32:03 AM

Previous topic - Next topic

Manj75

I'm trying to create a simple dialog window in SWT and using the JFaceConfigDialog.ajs script as a guide.

Basic layout is a Name field for input and a Documentation multi text field.  The issue I'm trying to resolve is to do with the GridLayout for the name label and name textfield, which is rendered with a horizontal gap between them, which I want to remove.  The attached screenshot shows the dialog and circles the area I want to remove so the textfield appears right after the label.

The Composite container is configured with:
- 2 columns
- columns equal width is false

I've set a border around the Name label to see how much of it is filling in the horizontal and the name textfield alignment is set to SWT.FILL on the horizontal, so I was expecting it to fill right up to the Name label.

createDialogArea: function (parent) {
let dialogWin = Java.super(cfgDialog.dialog).createDialogArea(parent);
let container = new CompositeWidget(dialogWin, SWT.BORDER);
GridDataFactory.swtDefaults().align(SWT.FILL, SWT.FILL).grab(true, true).applyTo(container);
GridLayoutFactory.swtDefaults().numColumns(2).equalWidth(false).margins(10,10).spacing(1, 5).applyTo(container);

// Create the Name label
let nameLabel = new LabelWidget(container, SWT.BORDER/*SWT.NONE*/);
nameLabel.setText("Name:");
GridDataFactory.swtDefaults().span(0,0).align(SWT.BEGINNING, SWT.CENTER).grab(false, false).applyTo(nameLabel);

// Create the Name text field
let nameTextField = new TextWidget(container, SWT.BORDER);
GridDataFactory.swtDefaults().align(SWT.FILL, SWT.CENTER).grab(true, false).applyTo(nameTextField);

// Create the Documentation Comment label
let documentationLabel = new LabelWidget(container, SWT.NONE);
documentationLabel.setText("Documentation Comment:");
GridDataFactory.swtDefaults().align(SWT.BEGINNING, SWT.CENTER).applyTo(documentationLabel);

// Create the documentation comment multi text field
let documantationTextField = new TextWidget(container, SWT.MULTI | SWT.BORDER | SWT.V_SCROLL);
GridDataFactory.swtDefaults().span(2,2).align(SWT.FILL, SWT.FILL).grab(true, true).applyTo(documantationTextField);
},


Hope this makes sense - thanks in advance for your assistance.

Phil Beauvoir

This is because the controls share the same parent container. The left column is as wide as the widest label. You need to use two containers for each label/field.
If you value and use Archi, please consider making a donation!
Ask your ArchiMate related questions to the ArchiMate Community's Discussion Board.

Phil Beauvoir

If you value and use Archi, please consider making a donation!
Ask your ArchiMate related questions to the ArchiMate Community's Discussion Board.

Manj75

Using a separate container did the trick - thanks Phil

Also, I enjoyed the video 8)

I'm on the next issue I thought I'd continue on this discussion as it is about the same script, which I've attached.  I just cannot seem to get it working when using it with a Text field. When saving to the config object it for some reason does not respond to the "Ok" button, however if I commented out the lines as shown below it works fine.  I just want to be able to save the input entry and then access from outside the cfgDialog object.

saveInput: function () {
//this.config.commentByName = this.nameTextField.getText();
//this.config.documentationCommentText = this.documentationTextField.getText();
},


I know this is more about swt/javascript question rather than an jArchi question, it's just that I'm close to completing and just missing something.  I'm no expert in javascript as you can tell, but getting by, so really value some help.

Thanks

Phil Beauvoir

At the saveInput() function, nameTextField and documentationTextField are both null, i.e not accessible. Perhaps these fields should be scoped at a global level?
If you value and use Archi, please consider making a donation!
Ask your ArchiMate related questions to the ArchiMate Community's Discussion Board.

Phil Beauvoir

#5
Looking at the original JFaceConfigDialog.ajs he uses:

widgets: {},

and stores the widget by name/value in that. Then accesses the widget by its name.

https://gist.github.com/rchevallier/d155527dcc3e956848a90e51bf21d7e1

Or you could use global vars by changing these parts:

var nameTextField, documentationTextField;

...

saveInput: function () {
    this.config.commentByName = nameTextField.getText();
    this.config.documentationCommentText = documentationTextField.getText();
},

...

nameTextField = new TextWidget(container1, SWT.BORDER);

...

documentationTextField = new TextWidget(container2, SWT.MULTI | SWT.BORDER | SWT.V_SCROLL);
If you value and use Archi, please consider making a donation!
Ask your ArchiMate related questions to the ArchiMate Community's Discussion Board.

Manj75

How embarrassing - I should've spotted the issue of being out of scope.

I wanted to keep it simple, so opted to place them in global scope and have got a final working script.

Thanks for all your help Phil  :)