1

My application uses a WebView to display dynamic HTML that is generated on-the-fly during use of the program.

I am trying to ensure the content of the HTML is all displayed within the WebView without horizontal scrolling at all (vertical is fine). I have found many guides on how to make the WebView scale with the contents, but not the other way around.

Here is the code used to generate the HTML:

html
                .append("<head><style>\n")
                .append("   body {\n")
                .append("       font-size: ").append(Settings.getFontSize()).append("px;\n")
                .append("       font-family: ").append(Settings.getFontName()).append(";\n")
                .append("   }\n")
                .append("</style></head><body>\n");

Then, within the body, I load some proprietary text that I cannot post here. The text will often extend past the right side of the WebView:

enter image description here * I apologize for the obfuscation; proprietary information

The WebView size cannot be increased to compensate. How do I set the style properly to allow for the text to wrap?

I have already tried setting the width of body to 100% and word-wrap to "normal."

Thank you.

EDIT My question has nothing to do with Bootstrap. If bootstrap is required for simply fitting the contents of a WebEngine into the WebView, it would be out of the question; are there any other work-arounds?

Zephyr
  • 9,885
  • 4
  • 28
  • 63
  • Looks like you may need to use `Bootstrap` or some other framework that can manage this for you. Just a guess. – SedJ601 Jun 08 '18 at 19:42
  • Possible duplicate of [Bootstrap with JavaFX](https://stackoverflow.com/questions/21268062/bootstrap-with-javafx) – SedJ601 Jun 08 '18 at 19:47
  • I can't imagine bringing in a heavy framework like Bootstrap should be required for such a basic functionality. And this definitely is not a duplicate as it has nothing in common with the question you linked to... – Zephyr Jun 08 '18 at 19:49
  • The linked question shows how to use `Bootstrap` in the `WebView`. `Bootstrap` does exactly what you are asking. – SedJ601 Jun 08 '18 at 19:50
  • But calling it a duplicate question is not correct. I am not asking how to use Bootstrap in my application. Bootstrap may be a decent solution, but it is not the same question. – Zephyr Jun 08 '18 at 19:52
  • You can lead a horse to water but you can't make him drink. – SedJ601 Jun 08 '18 at 19:52
  • I know, `Bootstrap` is just one solution. You can also obtain this using other frameworks. – SedJ601 Jun 08 '18 at 19:53
  • I will look into Bootstrap. But to close my question claiming it has already been asked is wrong. Nothing in the question you posted even refers to text wrapping or fitting content into a `WebView`. I appreciate your suggestion but flagging this question and making sarcastic remarks is not helpful to anyone. – Zephyr Jun 08 '18 at 19:55
  • It says possible duplicate. Emphasis on possible. Four other people would have to agree with me. It does not have to refer to it. I know how `Bootstrap` works. I have used it a lot. – SedJ601 Jun 08 '18 at 19:57
  • Another possible solution would be to keep up with the `WebView's` width and try to put `
    ` in your `HTML` in the correct place`. Seems complicated to me though.     – SedJ601 Jun 08 '18 at 19:58
  • Think about this way. An everyday browser can't do what you are asking without a frame work, but you think `WebView` can. I could be totally wrong, but. – SedJ601 Jun 08 '18 at 20:00
  • I gave you an uptick in hopes that the JavaFX experts will come and have an answer for you. I think it's a good question. I just don't' think the solution is built into JavaFX. – SedJ601 Jun 08 '18 at 20:01
  • Thank you. I know long before Bootstrap came along, websites were able to define a max width and the content would wrap. I have used Bootstrap as well, but I need to do this with straight HTML/CSS, if at all possible. – Zephyr Jun 08 '18 at 20:04

1 Answers1

0

I found the simple solution. WebView does already have this functionality by default. The issue was with my generated HTML; I was wrapping the offending text in the <pre> tag, which forced it to be rendered as one continuous line of text.

There is still an issue with 1 or 2 characters overflowing and causing horizontal scrolling, but I should be able to fix that with some CSS padding.

Zephyr
  • 9,885
  • 4
  • 28
  • 63
  • 1
    Haha no worries. I didn't include the `
    ` in my question so that didn't help things either. Thanks for trying, though!
     – Zephyr Jun 08 '18 at 20:20