| Summary: | Layout issue with single-line text input | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | [RT] RAP | Reporter: | Gunnar Wagenknecht <gunnar> | ||||||
| Component: | RWT | Assignee: | Project Inbox <rap-inbox> | ||||||
| Status: | RESOLVED FIXED | QA Contact: | |||||||
| Severity: | normal | ||||||||
| Priority: | P3 | CC: | jeick | ||||||
| Version: | 1.5 | ||||||||
| Target Milestone: | --- | ||||||||
| Hardware: | All | ||||||||
| OS: | All | ||||||||
| Whiteboard: | |||||||||
| Attachments: |
|
||||||||
Browser: Chrome 18.0 on Windows 7 Gunnar, the left/right padding of 10px is defined in the Text theming. You could override it by providing a theme contribution. About the top padding of 5px, it is there by design and it is calculated on the client in order to center the HTML "input" field vertically in the Text widget space (height). BTW... there is a top padding of 5px defined in the Text theming too. Gunnar, did you check the same in SWT? At least on GTK, your code renders exactly as your screenshot. If you want to have Label and Text aligned, I think that you have to use SWT.CENTER instead of SWT.BEGINNING in the GridData. SWT.BEGINNING stands for top aligned. Same on Windows. Changing SWT.BEGINNING to SWT.CENTER for Labels make Label and Text on the same line. Created attachment 214517 [details] screenshot with SWT.CENTER (In reply to comment #4) > SWT.BEGINNING stands for top aligned. I didn't try native SWT. But when I use it in RAP it's still off a bit (just by one pixel, though). This one pixel is probably because of the rounding on the client when top padding is calculated (vertical alignment). Is this one pixel critical for you or we could close the bug as invalid? (In reply to comment #7) > This one pixel is probably because of the rounding on the client when top > padding is calculated (vertical alignment). Is this one pixel critical for you > or we could close the bug as invalid? I'm not sure the algorithm is too blame. The text height is the same (same font, same font size). Assuming the same algorithm is used for the label and left it should render the same. The problem is that not the same algorithm is used for Label and the Text. Label position is calculated by the server-side (GridLayout), "input" HTML element position inside the Text is calculated by the client-side (BasicText.js#_centerFieldVertically). If I align the "input" element with the Label, assuming GridLayout calculation is the correct one, the "input" element it is not centered vertically anymore. So as a workaround I can use a Label instead of a read-only input. However, I'll loose the selection behavior. Is it possible to use labels and allow the user to select text (for copy and paste)? Would it help if I set a fixed height in the GridData on the server? Are there any tools for calculating a height? I'm not sure if this will help... Just give it a try. To calculate the size use Label/Text#computeSize( SWT.DEFAULT, SWT.DEFAULT ). (In reply to comment #12) > I'm not sure if this will help... Just give it a try. To calculate the size use > Label/Text#computeSize( SWT.DEFAULT, SWT.DEFAULT ). If I set the same heightHint for Label and Link then both are aligned without the off-by-one pixel. However, it doesn't work work for Text. The Text height is always a couple of pixels higher than the heightHint. That's true because Text is Scrollable, Link and Label are not. If you look at RAP/SWT Text compute size method you will see that they end with computeTrim( 0, 0, width, height ). This means that trimming are added to the widthHint/heightHint. The Scrollable trimmings include border, scrollbars *and* padding defined in the teaming. In your case Tex#computeSize( SWT.DEFAULT, 100 ) will return a height value bigger than 100 as padding top/bottom is 5px. *** Bug 432492 has been marked as a duplicate of this bug. *** To align the Label with the Text you could specify verticalIndent of the Label GridData. A value of 2 (3) works for me. Label now supports "padding" themeable property. You can use to the vertically allign Text and Lable. |
Created attachment 214513 [details] screenshot There seems to be an issue with a single line text input created without border. The "input" element has a surrounding "div" with a left/right padding of 10px and a top padding of 5px. I think it should not have any padding here and just behave as the other controls used in the same GridLayout. Please have a look at the attached screenshot. Code: final Composite container = new Composite(parent, SWT.NONE); container.setLayout(new GridLayout(2, false)); final Label l1 = new Label(container, SWT.LEFT); l1.setData(RWT.MARKUP_ENABLED, Boolean.TRUE); l1.setText("Blah"); l1.setLayoutData(new GridData(SWT.FILL, SWT.BEGINNING, false, false)); final Text text = new Text(container, SWT.SINGLE | SWT.READ_ONLY); text.setText("Blub"); text.setLayoutData(new GridData(SWT.FILL, SWT.BEGINNING, true, false)); final Label l2 = new Label(container, SWT.LEFT); l2.setData(RWT.MARKUP_ENABLED, Boolean.TRUE); l2.setText("Blah"); l2.setLayoutData(new GridData(SWT.FILL, SWT.BEGINNING, false, false)); final Link link = new Link(container, SWT.NONE); link.setData(RWT.MARKUP_ENABLED, Boolean.TRUE); link.setText("Link"); link.setLayoutData(new GridData(SWT.FILL, SWT.BEGINNING, true, false));