I'm developing new module in our application using vaadin14 components (eg https://vaadin.com/components/vaadin-date-picker). Everything worked pretty well, but after adding few components (text fields, grids, buttons, labels, notifications etc..) vaadin decided to not listen to me anymore... ;(
Everything started when I've tried to add some addon - slider (because for some reason it was removed from vaadin14). Even I tried a bounch of different addons none of them seem to work, it always lead to not displaying component(it was visible in html code when I was checking html elements on website, but size of that elements always was 0x0 - even setting its size in style didn't seem to work, because - yes it took some place on gui, but was invisible).
I thought that it might be some issue with my vaadin version or some deprecated addons and I've returned to work with default vaadin components. But this time it not seem to work as well. Currently the same issue is with IntegerField, NumberField, DatePicker, ProgressBar and I think that there is much more. There are no errors in console, no errors from server side, html elements are visible in generated html but its size is always 0x0 or not visible(eg vaadin-data-picker 0x0 data-picer 0x0).
Eg.:
html egxample
Like you can see there are no styles visible or whatsoever..
Code that should generete them looks like that(it is taken straight from vaadin example):
IntegerField integerField = new IntegerField("Age");
integerField.setSizeFull();
integerField.setVisible(true);
add(integerField);
NumberField numberField = new NumberField("Years of expertise");
numberField.setSizeFull();
numberField.setVisible(true);
add(numberField);
DatePicker labelDatePicker = new DatePicker();
labelDatePicker.setLabel("Label");
DatePicker placeholderDatePicker = new DatePicker();
placeholderDatePicker.setPlaceholder("Placeholder");
I've tried everything - using .setSizeFull(), setVisible(true), rebuilding project with mvn clean install (production and dev mode), deleting node_modules, targer, webpack.generated.js, package-lock.json(both on main directory and module directory) to let vaadin recreate them. But nothing seem to help. On different machine we was able to display NumberField after few rebuilts, but after few more it disapears again...
Thank you in advance!
EDIT:
Check the difference between working and not woring element:
Working element
Not working elements
Like you can see above in working element is bunch of stuff like shadow-root, styles, div etc. I assume that other elements also should consist such.
Try with setSizeUndefined() or use fixed sizes instead, or make absolutely sure all the parent layers also have full size.
When you use setSizeFull() you are telling the component to spread out to use all the available space, but if there is any container parent in there that has undefined size, that one will only use as much space as the contents demand -- which is nothing, if the contents are all set to full size. All the available space of nothing is nothing.
Related
I have a really weird error that I'm trying to resolve. On a website I built with the visual composer, one of the buttons that leads to an internal anchor (#whatwedosmall) on the same site just wont work on the mobile layout.
This is the site: https://b8j3ssh.myraidbox.de/
I created 3 layouts (large, medium, small) and each section has a certain ID (for example the What we do section in large is named: #whatwedolarge and so on. Within the site there are buttons that lead to these sections and it works great!
However, the very first button on mobile (breakpoint smaller than 600px) just wont work at all. I tried everything but I cannot get it to work...
Can you help me?
When you inspect the page at a breakpoint < 600px you can see that your button (actually an ) is being covered by the rev_slider_1_1 so the actual can never be hovered or clicked.
If you delete that slider from the DOM in DevTools or set the height manually, then the hovering and click work. As you can see in the screenshot below, manually setting the Slider height to 850px allows me to hover and click
You need to determine how the height of that slider is being determined and fix that in your code.
I'm new to coding JavaFX and I'm trying to create two checkboxes that will allow a user to remember his username/ password when logging in/out. Coding this isn't the problem; I'm having a hard time graying out the checkboxes (I want the password box to be grayed when the username box isn't checked). Here is a little snippit of code:
CheckBox rememberUsername = new CheckBox("Remember username?");
CheckBox rememberPassword = new CheckBox("Remember password?");
rememberPassword.setStyle("-fx-opacity: 1");
I read an online guide on getting CSS to work, and it said to extract:
/jdk1.8.x/jre/lib/ext/jfxrt.jar in C:\Program Files\Java, which I did. I'm using Eclipse, and when I load my program, it's as if there's no CSS at all.
Thanks in advance!!
When you disable a control, it will set the opacity to 0.5 (by default) and make it so that the control is not responsive. Opacity of 0.5 will look similar to a grayed out control.
rememberPassword.disableProperty().bind(
rememberUsername.selectedProperty().not()
);
This is probably what you really want to do, rather than just modifying the CSS style to gray the control out.
In the unlikely event that you don't want to disable the control when you gray it out, you can do:
rememberPassword.opacityProperty().bind(
Bindings.when(
rememberUsername.selectedProperty()
).then(1).otherwise(0.5)
);
And, in the equally unlikely event that you want to gray it out without disabling it and you want to use inline CSS for this, you can do:
rememberPassword.styleProperty().bind(
Bindings.when(
rememberUsername.selectedProperty()
).then("fx-opacity: 1;").otherwise("-fx-opacity: 0.5;")
);
We are using a JTable in a very old huge application to display some information. Till now we were working on Jre 1.7.0_17 or 1.7.0_51. Recently we tried to test our application with an upgraded JRE to 1.7.0_75.
We noticed that when the JTable is displayed only one row appears for the first time. However during debug we see data for all rows getting added to table. I tried refresh, revalidate, repaint, fireTableDataChanged etc but still only for the first time only first row appears. If we hide and show the table again all the rows start appearing. Also tested on JREs 1.7.0_80, 1.8.0_31, 1.8.0_45 and 1.8.0_51 and the issue is reproducible.
Any hint would be helpful.
(Note : The application was developed on very old java version and has been using old style swing dialogs)
Thank You In Advance!
I haven't seen your code, but a typical problem here is component's size.
Most likely, the layout, in which your JTable appears started to calculate component's size differently.
My assumption is easy to verify, buy changing layout to something that does not use preferred size or other similar parameters to calculate component's size. Alternatively, you can set size explicitly just to see what's going on.
That could be done by:
component.setSize(500, 500);
Please note, that it may be more than just 1 container around your JTable. You have to make sure entire stack produces the right size, but start with JTable as it looks like the size is based on some initial empty table's preferred size.
Once you confirm that the problem is where I think it is, you'd need to fix it by changing layout or layout's parameters.
Okay So today I sat down to make a options panel that would allow you to scroll down through the list of options and for some reason I drew a blank... Anyone got an example at where I could get started for some reason I can't seem to see in my mind how to do it though It seems really simple.
You should use ScrollPane() as the container of your list. and you can use List and List.ListStyle to set your options list if you to use text for it.You should set the style of List.ListStyle and ScrollPane.ScrollPaneStyle linked to a json file and therefore your Skin. And then add a table to the stage containing the ScrollPane Actor.
here is a video tutorial: http://youtu.be/CNjkPPveqG8 talking about this.
PEACE!
I'm viewing HTML in an SWT Browser widget. I am appending logging messages to the end of the content and would like to keep the bottom visible all the time. Currently, whenever I append text to the content, I first set the new text:
browser.setText(content);
And then I scroll down the Browser widget via JavaScript:
browser.execute("window.scrollTo(0,100000);");
The problem with this is that when I set the text, the widget switches to the top again before scrolling down, so when I append lots of messages quickly, the browser widget is showing the top part most of the time, occasionally flickering when switching to the bottom. This makes it impossible to follow what is being logged at the bottom.
I am aware that I could use a tree viewer and get all the convenience of the Eclipse platform, but there is a Swing version of the app too and both should use the same HTML with CSS presentation.
Ideally I'd like to avoid embedding a Swing component, but if there is one that would allow this, I'd be happy to hear about it. I have tried it with a JEditorPane inside a JScrollPane, appending to the content via the editor kit's read method:
editorPane.getEditorKit().read(/*...*/);
And then scrolling down like this:
editorPane.setCaretPosition(editorPane.getDocument().getLength());
This works very smoothly for the standalone Swing app, but embedded in Eclipse it flickers and does not keep up with fast updates of the HTML content.
Right now the only way I can make this work smoothly inside Eclipse is prepending to the Browser widget's content instead of appending, but I'd really prefer adding new messages at the bottom, not at the top.
Rewriting the whole HTML content every time seems unnecessarily busy-work, and there may not be a way to prevent some browsers from scrolling to the top each time you redraw the entire page. Especially if you allow the logs you show to get very long, this will get slower and slower as the log gets longer.
A better solution might be to use JavaScript to append to the page. You're already using
browser.execute()
How about something like this (assuming "itemID" is the ID of the DIV containing the content):
String newContent = newContent.replaceAll("\n", "<br>").replaceAll("'", "\\\\'");
browser.execute("document.getElementById(\"itemID\").innerHTML += '"
newContent + "'");
You have to do the replaceAll() and you may need a couple more transformations, depending on your log content. I've noticed that browser.execute() doesn't like it if the script contains newlines, for example, and single quotes in your string needed to be quoted as I show above.
I would have just added this as a comment, but it wouldn't let me (not enough reputation). You can ship XUL in a nonstandard location on the mac, by setting a system property.
System.setProperty("org.eclipse.swt.browser.XULRunnerPath", "/fubar/xul/Versions/1.9.0.7/");