Firefox选项窗格Java Swing中的UX设计？

Question

我需要使用Java Swing设计类似于Firefox > tools > options （如下所示）的窗口。 我必须创建两个顶部标题。 每次单击时，我都必须打开选项卡式窗格（与Firefox > tools > options > advanced 。）Swing几乎是我的新手。

感谢您的快速回复。我已尝试实施相同的方法。 基本窗口是JDialog。 我已经创建了顶部面板的Whithin。工具栏（位于topPanel的BorderLayout-North）和内容面板（位于topPanel的BorderLayout-Center）被添加到此顶部面板。 创建了两个工具栏按钮-“常规”和“高级”，它们是我上一篇文章中正在讨论的标题。“ contentPanel”是占位符面板。 我想在每当单击工具栏按钮时动态添加选项卡式面板的位置。默认为常规。

当单击高级工具栏按钮时，我要删除_generalTabbedPane并显示_advanceTabbedPane，反之亦然。

但是它没有正确发生。单击工具栏按钮时添加和删除/隐藏面板是我需要解决的问题。我已在下面附加了代码。

请帮助。

 @Override
   public JComponent createContentPanel()
  {        
   topPanel  = new JPanel();
   topPanel.setLayout(new BorderLayout());     
   JToolBar toolBar = new JToolBar();
   toolBar.add(new tabButton("general",GENERAL));
   toolBar.add(new tabButton("advanced",ADVANCED));

   contentPanel = new JPanel();       
   contentPanel.add(getGeneralTabs());

   topPanel.add(toolBar, BorderLayout.NORTH);
   topPanel.add(contentPanel, BorderLayout.CENTER);        
   return topPanel;


}  
private  final class JCenterLabel extends JLabel
{       
    public JCenterLabel(final String s)
    {
        super(s);
        setAlignmentX(Component.CENTER_ALIGNMENT);
    }

    public JCenterLabel(final Icon i)
    {
        super(i);
        setAlignmentX(Component.CENTER_ALIGNMENT);
    }
}

private  class tabButton extends JButton
{   
    public tabButton (  String tabId,String actionCommand)
    {
        super();
        setLayout(new BoxLayout(this, BoxLayout.Y_AXIS));      
        add(new JCenterLabel(UIManager.getIcon("OptionPane.informationIcon"))); 
        add(new JCenterLabel(tabId)); 
        this.setActionCommand(actionCommand);
        this.setName(tabId);
        this.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent e) { 
            String cmd = e.getActionCommand();
            if (GENERAL.equals(cmd)) { 
                if(contentPanel != null){
                contentPanel.remove(_advanceTabbedPane);     
                contentPanel.add(getGeneralTabs());
                contentPanel.revalidate();
                contentPanel.repaint();


                }

            } else if (ADVANCED.equals(cmd)) { 
                if(contentPanel != null){
                contentPanel.remove(_generalTabbedPane);               
                contentPanel.add(getAdvancedTabs());
                contentPanel.revalidate();
                contentPanel.repaint();


                }
            } 

        }
        });
}
}

  private JideTabbedPane  getGeneralTabs(){
    _generalTabbedPane = new JideTabbedPane();
    _generalTabbedPane.setModel(new TabbedPaneWithValidationModel());
    //adding the tabs to the _generalTabbedPane
    //-----
    //---

    return _generalTabbedPane;


}
  private   JideTabbedPane getAdvancedTabs(){
      _advanceTabbedPane = new JideTabbedPane();
      _advanceTabbedPane.setModel(new TabbedPaneWithValidationModel());
      //adding the tabs to the _advanceTabbedPane
    //-----
    //---
      return _advanceTabbedPane;

  }

Answer 1

我看到一个JToolBar在BorderLayout.NORTH ，一个JTabbedPane在BorderLayout.CENTER和JPanel使用FlowLayout.RIGHT在BorderLayout.SOUTH 。 BorderFactory可以提供标题的边框。

附录： 我必须创建两个顶部标题。

如果需要两个顶部标题，则可以将两个JToolBar实例添加到具有GridLayout(0, 1)的JPanel中，然后将该面板添加到BorderLayout.NORTH 。 另请参见此嵌套面板示例 。 使用Action封装工具栏的行为， 例如 。

附录： 每当单击高级工具栏按钮时，我都想删除 generalTabbedPane 并显示 advanceTabbedPane ，反之亦然。

您可以使用此处显示的CardLayout来完成此任务。 更好的方法可能是让每个选项卡的抽象父级实现合适的接口方法 ，例如setAdvanced() 。 默认值不会执行任何操作，但是某些具体的实现可能会做出相应的响应。