Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
416 views
in Technique[技术] by (71.8m points)

javafx - Webview with contenteditable cannot be focused programmatically

Trying to do a requestFocus() on the WebView does not work until the user has first clicked on the control.

I know this must be possible as htmlEditor can be focused this way (and I suspect it is based on a contenteditable WebView).

I am coding my own specialized htmlEditor using a webview with "contenteditable" and I would really like to be able to focus it like I can do with the standard htmlEditor.

I believe this must be an issue with Javafx and I have already submitted it to Jira, but I wonder if anyone can think of a work-around for this.

UPDATE: Issue number in jira: RT-21695

Short demostration code:

/* Demo webview */

public class WebViewConteneditableDemo extends Application {


String initialEditview = "<html><head>"
        + "</head><body contenteditable='true'>"
        +"</body></html>";

/**
 * @param args the command line arguments
 */
public static void main(String[] args) {
    launch(args);
}

@Override
public void start(Stage primaryStage) {
    primaryStage.setTitle("Webview focus demo");


    final WebView editor = new WebView();

    Button btn = new Button();
    btn.setText("Test Webview focus");
    btn.setOnAction(new EventHandler<ActionEvent>() {

        @Override
        public void handle(ActionEvent event) {
           editor.requestFocus();
        }
    });

    BorderPane root = new BorderPane();
    root.setTop(btn);

    root.setCenter(editor);
    editor.getEngine().loadContent(initialEditview);

    primaryStage.setScene(new Scene(root, 500, 450));
    primaryStage.show();
}

}

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

The requestFocus api is just a request for focus, it does not guarantee focus.

Sometimes the internal implementation of other JavaFX controls request focus before or after you have requested focus which ends up in your requestFocus call not having any effect.

Often you can make the requestFocus call take effect by either wrapping it in a Platform.runLater or using a Timeline with a KeyFrame which invokes requestFocus after a delay.

If neither of those work, then there is likely a bug in the requestFocus processing for WebView which the JavaFX team can address in the context of the jira you filed.

Update

The specific issue in the sample code in the question was that, although the WebView was focused, the editable content element in the WebView was not focused.

I tried loading just the html from the sample code <html><head></head><body contenteditable='true'></body></html> into firefox and it behaved exactly the same as the JavaFX WebView (i.e. the editable content element was not focused until it was clicked on). So I don't believe this is an issue with WebView.

To get the editable element focused, you need to execute some script when you want it focused, for example in the javascript onload hook <body onLoad='document.body.focus();' contenteditable='true'/>

Here is an executable sample application which demonstrates programmatic control of focus behaviour of contenteditable elements in a JavaFX WebView:

import javafx.application.Application;
import javafx.beans.binding.Bindings;
import javafx.event.*;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class WebViewEditable extends Application {
  String content = "<body bgcolor='cornsilk' onLoad='document.body.focus();' contenteditable='true'/>";
  public static void main(String[] args) { launch(args); }
  @Override public void start(Stage stage) {
    final WebView editor = new WebView();
    editor.getEngine().loadContent(content);

    Button webviewFocusButton = new Button("Focus on WebView");
    webviewFocusButton.setOnAction(new EventHandler<ActionEvent>() {
      @Override public void handle(ActionEvent event) {
        editor.getEngine().executeScript("document.body.focus()");
        editor.requestFocus();
      }
    });
    Button selfFocusButton = new Button("Focus on this Button");

    Label focusLabel = new Label();
    focusLabel.textProperty().bind(Bindings
      .when(editor.focusedProperty())
        .then("WebView has the focus.")
        .otherwise("WebView does not have the focus.")
    );
    focusLabel.setMaxWidth(Double.MAX_VALUE);
    focusLabel.setStyle("-fx-background-color: coral; -fx-padding: 5;");

    BorderPane layout = new BorderPane();
    layout.setTop(HBoxBuilder.create().spacing(10).children(webviewFocusButton, selfFocusButton).style("-fx-padding: 10; -fx-background-color: palegreen").build());
    layout.setCenter(editor);
    layout.setBottom(focusLabel);
    stage.setScene(new Scene(layout));
    stage.show();
  }
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

2.1m questions

2.1m answers

60 comments

57.0k users

...