2

我目前正在研究 Java GUI 实现，对于我的下一个任务，我们将创建一个程序来模拟房屋的控制。我们几乎可以自由地按照我们喜欢的方式构建它（只要它是在 Java 中的）。我已经制定了这个模型：http: //i.imgur.com/9RtWL7b.jpg（如下所示），这就是我想要制作的。

程序样机： 程序样机

下面是我目前拥有的代码，它产生了这个http://i.imgur.com/XZLiwWx.jpg（下）

下面的示例代码： 程序示例

我的问题是；如何让三个按钮位于屏幕的左侧？我会以错误的方式解决这个问题吗？我觉得我下面的代码非常笨重且没有组织，我应该采取不同的方法吗？

让我知道是否需要更多信息。

import java.awt.*;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Image;

import javax.swing.ImageIcon;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JButton;

public class ImageTest {

    public static void main(String[] args) {
        ImagePanel panel            = new ImagePanel("program/assets/main_bg.jpg");

        TopTabButton buttonHome     = new TopTabButton("home");
        TopTabButton buttonSettings = new TopTabButton("settings");
        TopTabButton buttonHelp     = new TopTabButton("help");

        panel.add(buttonHome);
        panel.add(buttonSettings);
        panel.add(buttonHelp);


        panel.setPreferredSize(new Dimension(1000, 760));

        JFrame frame = new JFrame();
        frame.setBackground(new Color(53, 56, 64));
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        frame.getContentPane().add(panel);

        frame.pack();

        frame.setLocationRelativeTo(null);
        frame.setResizable(false);
        frame.setVisible(true);
    }

}

class TopTabButton extends JButton {

    public TopTabButton(String buttonCode) {
        setIcon(new ImageIcon("program/assets/top_tab_button_bg_" + buttonCode + "_inactive.png"));
        setRolloverIcon(new ImageIcon("program/assets/top_tab_button_bg_" + buttonCode + "_active.png"));
        setBorderPainted(false);
        setFocusPainted(false);
        setContentAreaFilled(true);
        setSize(new Dimension(126, 75));
     }

}

class ImagePanel extends JPanel {

    private Image img;

    public ImagePanel(String img) {
        this(Toolkit.getDefaultToolkit().createImage(img));
    }

    public ImagePanel(Image img) {
        this.img = img;
        Dimension size = new Dimension(img.getWidth(null), img.getHeight(null));
        setPreferredSize(size);
        setMinimumSize(size);
        setMaximumSize(size);
        setSize(size);
        setLayout(new GridBagLayout());
    }

    public void paintComponent(Graphics g) {
        g.drawImage(img, 0, 0, getWidth(), getHeight(), this);
    }
}

class ButtonPanelTest extends JPanel {

    private Image img;

    public ButtonPanelTest(String name) {
        Button Button1 = new Button(name);
        Dimension size = new Dimension(100, 50);
        setSize(size);
        setLayout(new GridBagLayout());
    }

}
4

2 回答 2

10

让我们从手头的问题开始......

JFrame默认情况下使用 a BorderLayout，doing会将其frame.getContentPane().add(panel);添加到窗口的中心位置。frame.getContentPane().add(panel, BorderLayout.NORTH);相反，请尝试

setSize呼入TapTabButton无关紧要。它的大小将由它添加到的容器的布局管理器确定...

不建议调用和setPreferredSize(size)，相反，您应该重写相应的方法并返回所需的大小。这将防止人们以后覆盖它们；）setMinimumSize(size)setMaximumSize(size)getXxxSize

另外，调用setSize是无关紧要的......

我会警惕的ImageIcon。它使用委托模型来加载图像（将其传递给另一个Thread），这意味着它实际上可能会返回getWidth，因为可能没有足够的数据加载来确定图像的大小。getHeight0

相反，使用ImageIO，这将在返回之前读取图像...

你必须调用super.paintComponent你的paintComponent方法！这非常重要，因为其中一项工作是为绘画paintComponent准备上下文Graphics

setSize在ButtonPanelTest...无关的

工作示例

好吧，玩了一点，但基本上，所有的setXxxSize电话都在搞事情......

在此处输入图像描述

import java.awt.BorderLayout;
import java.awt.Button;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.GridBagLayout;
import java.awt.Image;
import java.awt.Toolkit;
import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class ImageTest {

    public static void main(String[] args) {
        ImagePanel panel = new ImagePanel("program/assets/main_bg.jpg");

        TopTabButton buttonHome = new TopTabButton("home");
        TopTabButton buttonSettings = new TopTabButton("settings");
        TopTabButton buttonHelp = new TopTabButton("help");

        panel.add(buttonHome);
        panel.add(buttonSettings);
        panel.add(buttonHelp);


//        panel.setPreferredSize(new Dimension(1000, 760));

        JFrame frame = new JFrame();
        frame.setBackground(new Color(53, 56, 64));
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        frame.add(panel, BorderLayout.NORTH);

        frame.pack();

        frame.setLocationRelativeTo(null);
//        frame.setResizable(false);
        frame.setVisible(true);
    }

    class TopTabButton extends JButton {

        public TopTabButton(String buttonCode) {
            setText(buttonCode);
//        setIcon(new ImageIcon("program/assets/top_tab_button_bg_" + buttonCode + "_inactive.png"));
//        setRolloverIcon(new ImageIcon("program/assets/top_tab_button_bg_" + buttonCode + "_active.png"));
//        setBorderPainted(false);
//        setFocusPainted(false);
//        setContentAreaFilled(true);
//        setSize(new Dimension(126, 75));
        }
    }

    class ImagePanel extends JPanel {

        private Image img;

        public ImagePanel(String img) {
            this(Toolkit.getDefaultToolkit().createImage(img));
        }

        public ImagePanel(Image img) {
            this.img = img;
            Dimension size = new Dimension(img.getWidth(null), img.getHeight(null));
//        setPreferredSize(size);
//        setMinimumSize(size);
//        setMaximumSize(size);
//        setSize(size);
            setLayout(new GridBagLayout());
        }

        public void paintComponent(Graphics g) {
            super.paintComponent(g);
            g.drawImage(img, 0, 0, getWidth(), getHeight(), this);
        }
    }
//
//class ButtonPanelTest extends JPanel {
//
//    private Image img;
//
//    public ButtonPanelTest(String name) {
//        Button Button1 = new Button(name);
//        Dimension size = new Dimension(100, 50);
//        setSize(size);
//        setLayout(new GridBagLayout());
//    }
//}
}

是的，我可能会将 UI 的每个元素构建为单独的面板，而不是试图让它们在窗格中工作。

这隔离了控制和责任，并减少了布局拥塞和混乱......

于 2013-05-07T06:18:47.583 回答
6

您必须将窗口拆分为不同的面板，并在每个面板中提供不同类型的布局。

例如，在您的情况下，您必须将 BorderLayout 应用于窗口并将 3 个按钮的面板放置在 NORTH 位置。它会将您的按钮放在窗口的顶部（暂时位于中间）。您必须将布局应用于每个面板以选择元素在窗口中的位置。

检查此链接，它将向您解释布局的工作方式Visual Guide to Layouts

于 2013-05-07T06:18:37.183 回答