使WebView在JavaFX中忽略場景CSS

當我使用javafx.scene.web.WebView加載網站/ html時，該網站似乎受到了我的場景自定義樣式的影響。演示問題的最小示例。使WebView在JavaFX中忽略場景CSS

Main.java

public class Main extends Application { 

    @Override 
    public void start(Stage primaryStage) throws Exception { 
     VBox root = new VBox(); 

     primaryStage.setScene(new Scene(root, 900, 900)); 

     String css = Main.class.getResource("/test.css").toExternalForm(); 
     primaryStage.getScene().getStylesheets().add(css); 

     WebView webView = new WebView(); 

     root.getChildren().add(webView); 

     webView.getEngine().load("http://google.pl"); 

     primaryStage.show(); 
    } 


    public static void main(String[] args) { 
     launch(args); 
    } 
}

test.css

.text-area, 
.text-field { 
    -fx-background-color: red; 
}

這導致

最後，我希望像當然webview.getEngine().dontInheritStyles()的方法是沒有的，但是我做不到否則找到任何方法。試過：

webView.getStylesheets().clear(); 
webView.setStyle(null); 
webView.getStyleClass().clear();

他們都沒有工作。我認爲可以使這項工作（還沒有嘗試過）的一種方法是在不使用相同場景的子窗口中打開webview，但是我希望將webview嵌入到我現有的應用程序視圖中所以這個選項將是我的最後手段，我寧願避免它。

來源

2017-06-06 Dawid

您可以使用某種黑客技術，例如JavaFX和Swing的組合。

你有兩類：

JFXPanel - 它允許你嵌入一個JavaFX控制到搖擺
SwingNode - 它允許你嵌入擺動控制到JavaFX

你可以結合使用包裝類中的JFXPanel和SwingNode類：

public class Styleless<T extends Parent> extends StackPane { 
    private T root; 

    public Styleless(T root) { 
     this.root = root; 

     JFXPanel jfxPanel = new JFXPanel(); 
     jfxPanel.setScene(new Scene(root)); 

     SwingNode swingNode = new SwingNode(); 
     swingNode.setContent(jfxPanel); 

     getChildren().add(swingNode); 
    } 

    public T getRoot() { 
     return root; 
    } 
}

你可以使用它像這樣：

public class Main extends Application { 

    @Override 
    public void start(Stage primaryStage) throws Exception { 
     VBox root = new VBox(); 
     primaryStage.setScene(new Scene(root, 900, 900)); 

     String css = Main.class.getResource("/test.css").toExternalForm(); 
     primaryStage.getScene().getStylesheets().add(css); 

     WebView webView = new WebView(); 
     webView.getEngine().load("http://google.pl"); 

     Styleless<WebView> webViewStyleless = new Styleless<>(webView); 

     root.getChildren().add(webViewStyleless); 
     VBox.setVgrow(webViewStyleless, Priority.ALWAYS); 

     primaryStage.show(); 
    } 

    public static void main(String[] args) { 
     launch(args); 
    } 
}

來源

2017-06-06 15:18:14 mrg

您還可以使用樣式類在你的CSS來管理哪些元素讓應用到他們的風格。在你的css中定義一個'myapplication'類，並將該類添加到你的根節點。

test.css

/* any text fields inside a container with the myapplication style class */ 
.myapplication > .text-field{ 
    -fx-background-color: red; 
} 

/* any text areas inside a container with the myapplication style class */ 
.myapplication > .text-area{ 
    -fx-background-color: red; 
}

Main.java

... 
root.getStyleClass().add("myapplication"); 
TextField txtField = new TextField("Application text field"); 
root.getChildren().addAll(webView, txtField); 
...

使用 '>' CSS選擇器（https://www.w3schools.com/cssref/css_selectors.asp）這種方式將應用該樣式的文本，其父母有風格類的領域我的應用程序'。當創建一個web視圖，它具有風格類的網絡視圖「（https://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html#webview）

雖然是爲了防止風格被繼承，樣式類不會被添加到孩子值沒有真正的方法。

來源

2017-06-06 15:46:04

使WebView在JavaFX中忽略場景CSS

回答

相關問題