Question

我有一个使用React和Material-UI的网页，我希望使用JavaFX的WebView将其嵌入到我的桌面应用程序中。但是，当我尝试这样做时，Material-UI中的Tabs无法按预期工作。第一次单击选项卡时，它按预期工作，并显示该选项卡的内容，并将选项卡标记为活动选项卡。此后它停止工作，你无法切换标签。

要重现此问题，以下代码就足够了：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class TabTest extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {

        BorderPane pane = new BorderPane();
        Scene scene = new Scene(pane);

        WebView webView = new WebView();
        WebEngine webEngine = webView.getEngine();

        webEngine.load("http://www.material-ui.com/#/components/tabs");

        pane.setCenter(webView);

        primaryStage.setScene(scene);
        primaryStage.setMaximized(true);
        primaryStage.show();
    }

    public static void main(String[] args) throws Exception {
        Application.launch(TabTest.class);
    }
}

到目前为止的观察：

标签适用于常规网络浏览器。
停止工作后，整个网页似乎都会响应点击次数（到处都会触发Material-UI点击动画）。我添加了日志记录到Material-UI标签组件，并且在我点击的任何地方从第一次点击中选择的标签上触发了onTouchTap。

有谁知道问题可能是什么，以及是否有任何方法可以修复它？或者我应该将其作为JavaFX错误提交？

Answer 1

我找到了解决Java 8此问题的方法。添加

{
display: inline;
position: relative;
}

到每个标签的样式

Material-UI选项卡在JavaFX WebView中不起作用

1 个答案: