JavaFX TabPane - 每个选项卡一个控制器 [英] JavaFX TabPane - One controller for each tab

问题描述

我是 Fx 的新手.我有一个带有 10 个标签的 TabPanel.每个 Tab 都有很多控件(图表、按钮等)，我想要的是为每个 Tab 分配一个控制器.SceneBuilder 只让我为整个视图分配一个控制器，我的意思是，只有顶部面板(根)具有控制器类"选项，所以我必须为一个类中的所有选项卡编写代码，并且这个，作为需要，导致一个非常大的类并且难以理解和维护.也许解决方案很简单，但正如我所说，我对 FX 的经验很少，而且我无法在网上找到类似的东西.

I'm new to Fx. I have a TabPanel with 10 Tabs. Each Tab has many controls (charts, buttons, etc.), and what I want is to assign a controller for each Tab. The SceneBuilder only let me assign a controller for the whole view, I mean, only the top panel (the root) has the "Controller class" option, so I have to write the code for all the tabs in one class and this, as entail, resulting in a very large class and difficult to understand and maintain. Perhaps the solution is very simple, but as I say, I have very little experience with FX and I have not been able to find something similar on the web.

有什么想法吗?谢谢.

推荐答案

一种方法是将每个标签页封装到一个单独的 FXML 文件中，并使用它自己关联的控制器类.

One approach is to encapsulate each of your tab pages into a separate FXML file with it's own associated controller class.

然后在主选项卡控件的 FXML 文件中，您可以执行以下操作:

Then in your FXML file for the main tab control you can do something like this:

<TabPane fx:controller="com.foo.MainController">
    <tabs>
        <Tab text="Untitled Tab 1">
            <content>
                <fx:include fx:id="fooTabPage" source="fooTabPage.fxml"/>
            </content>
        </Tab>
        <Tab text="Untitled Tab 2">
            <content>
                <fx:include fx:id="barTabPage" source="barTabPage.fxml"/>
            </content>
        </Tab>
    </tabs>
</TabPane>

请注意，我没有直接嵌入内容，而是使用了 fx:include 指令，该指令告诉 FXMLLoader 加载正在引用的 FXML 文件.用于页面内容的各个 FXML 文件都有自己的控制器，以便很好地分离逻辑.

Notice that instead of embedding the content directly, I am using the fx:include directive which tells the FXMLLoader to load the FXML file that is being referenced. The individual FXML files used for the page content will all have their own controller so that the logic is nicely separated.

如果您需要与来自主控制器的子页面或子控制器进行交互，那么您可以像使用任何其他 FXML 控件一样引用它们以注入它们.

If you need to interact with the sub-pages or sub-controllers from the main controller then you can reference them like you do with any other FXML control to have them injected.

public class MainController {
    // Inject tab content.
    @FXML private FooTabPage fooTabPage;
    // Inject controller
    @FXML private FooTabController fooTabPageController;

    // Inject tab content.
    @FXML private BarTabPage barTabPage;
    // Inject controller
    @FXML private BarTabController barTabPageController;
}

如果您有大量页面(每个页面都有大量自己的控件)，另一种方法是将每个选项卡留空，然后在加载主视图后，将相关页面加载到您的控件中.

If you have a large number of pages (each with a large number of their own controls) another approach is to leave each tab empty, and once the main view is loaded, load the relevant page into your control.

您需要监听选项卡更改以切换内容并添加相关代码以加载/卸载用于选项卡页面内容的视图.

You would need to listen for tab changes to switch the content and add relevant code to load / unload the views that are being used for the content of the tab pages.

如果您发现性能问题，我建议您从第一种方法开始，然后重构以使用第二种方法.

I would recommend starting with the first approach and refactoring to use the second approach if you discover performance problems.

这篇关于JavaFX TabPane - 每个选项卡一个控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！