Swing - 布局管理器问题解决方案

Question

我正在尝试使用Java Swing制作聊天应用程序，但是在聊天气泡方面遇到了问题。我成功地实现了气泡效果，但似乎无法正确放置它们。以下是我的代码：

            package messagebubble;

import java.awt.BorderLayout;

import javax.swing.BoxLayout;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextArea;

import messagebubble.RoundedBorder;

public class Main {

public static void main(String[] args) {

    JFrame window = new JFrame();

    JPanel chat = new JPanel();
    chat.setLayout(new BoxLayout(chat, BoxLayout.PAGE_AXIS));

    JPanel painel = new JPanel(new BorderLayout());
    JPanel painel2 = new JPanel(new BorderLayout());

    JTextArea msg = new JTextArea();
    msg.setLineWrap(true);
    msg.setWrapStyleWord(true);

    msg.setText("ola tudo bem meus caros amigos, como estão? há muito que não vos via por estas bandas haha lol");
    msg.setBorder(new RoundedBorder());
    msg.setColumns(msg.getLineCount());

    JTextArea msg2 = new JTextArea();
    msg2.setLineWrap(true);
    msg2.setWrapStyleWord(true);

    msg2.setText("ola tudo bem");
    msg2.setBorder(new RoundedBorder());

    painel.add(msg,BorderLayout.NORTH);

    chat.add(painel);
    painel2.add(msg2,BorderLayout.NORTH);

    chat.add(painel2);

    window.add(chat);

    window.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    window.setSize(400, 500);
    window.setVisible(true);



    }

}

这里是圆角边框

package GUI;

import java.awt.Color;
import java.awt.Component;
import java.awt.Container;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Insets;
import java.awt.geom.Area;
import java.awt.geom.Rectangle2D;
import java.awt.geom.RoundRectangle2D;

import javax.swing.border.AbstractBorder;

public class RoundedBorder extends AbstractBorder {



@Override
public void paintBorder(Component c, Graphics g, int x, int y, int width,
        int height) {

    Graphics2D graph = (Graphics2D) g.create();
    RoundRectangle2D round = new RoundRectangle2D.Float(x, y, width - 1,
            height - 1, 30, 30);
    Container parent = c.getParent();

    if (parent != null) {
        graph.setColor(parent.getBackground());
        Area canto = new Area(new Rectangle2D.Float(x,y,width,height));
        canto.subtract(new Area(round));
        graph.fill(canto);
    }

    graph.setColor(Color.GRAY);
    graph.draw(round);
    graph.dispose();

}

@Override
public Insets getBorderInsets(Component c) {
    return new Insets(5, 10, 5, 10);
}

@Override
public Insets getBorderInsets(Component c, Insets insets) {
    insets.left = 10;
    insets.right = insets.left;
    insets.top = 5;
    insets.bottom = insets.top;
    return insets;
}

输出结果看起来像这样Output。我无法去除消息之间的空白空格或底部JTextArea中的空白空格。

我还尝试将面板的最大大小设置为其首选大小，它看起来像这样Output2，太窄了。

有什么想法可以解决这个问题吗？我想要实现的是这样的东西ideal

- ggpfc

---

请考虑创建并发布以下两个内容：1）您的 [mcve]（请阅读链接），2）当前和期望 GUI 的图像。 - Hovercraft Full Of Eels

你想要输出看起来怎么样？顶部有一个大的输出框，底部有一个小的输入行吗？还是每个消息都有一个全宽度的条形框？ - tobias_k

@tobias_k 我添加了一个理想的输出。基本上我希望它看起来像 Android 消息应用程序，但现在我只想去掉额外的空格。 - ggpfc

@tobias_k 我认为他想要的是FROM消息在右侧有一个边距，而TO消息在左侧有一个边距（这是现今聊天应用程序中的常见约定）。 - James Wierzba

@ggpfc 请提供可运行的代码示例，没有更多上下文很难提供帮助。 - James Wierzba

@JamesWierzba 让它可以运行。 - ggpfc

Answer 1

我建议：

• 使用单个BorderLayout来容纳所有组件
• 在BorderLayout.PAGE_START位置添加另一个使用BoxLayout PAGE_AXIS的JPanel。
• 将聊天添加到BoxLayout JPanel中。
• 请注意，大多数人没有您的圆角矩形边框实用程序，因此无法测试此功能。

例如：

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import javax.swing.*;


public class MainPanel extends JPanel {

    private static final int PREF_W = 400;
    private static final int PREF_H = 500;
    private JPanel msgHoldingPanel = new JPanel();


    public MainPanel() {
        JTextArea msg = new JTextArea();
        msg.setLineWrap(true);
        msg.setWrapStyleWord(true);

        msg.setText("ola tudo bem meus caros amigos, como estão? há muito que não vos via por estas bandas haha lol");

        // !! msg.setBorder(new RoundedBorder());
        msg.setBorder(BorderFactory.createLineBorder(Color.blue));

        msg.setColumns(msg.getLineCount());

        JTextArea msg2 = new JTextArea();
        msg2.setLineWrap(true);
        msg2.setWrapStyleWord(true);

        msg2.setText("ola tudo bem");
        msg2.setBorder(BorderFactory.createLineBorder(Color.blue));

        msgHoldingPanel.setLayout(new BoxLayout(msgHoldingPanel, BoxLayout.PAGE_AXIS));
        msgHoldingPanel.add(msg);
        msgHoldingPanel.add(Box.createVerticalStrut(3));
        msgHoldingPanel.add(msg2);

        setLayout(new BorderLayout());
        add(msgHoldingPanel, BorderLayout.PAGE_START);
    }


    @Override
    public Dimension getPreferredSize() {
        if (isPreferredSizeSet()) {
            return super.getPreferredSize();
        }
        return new Dimension(PREF_W, PREF_H);
    }

    private static void createAndShowGui() {
        JFrame frame = new JFrame("MainPanel");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.getContentPane().add(new MainPanel());
        frame.pack();
        frame.setLocationRelativeTo(null);
        frame.setVisible(true);
    }

    public static void main(String[] args) {
        SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                createAndShowGui();
            }
        });
    }
}

- Hovercraft Full Of Eels

---

这样可以完美地解决对齐问题，但我还希望JTextArea适应文本内容，当我添加较短的消息时不会变得更大。这就是为什么我尝试将最大宽度设置为首选宽度的原因。 - ggpfc

Answer 2

import java.awt.Component;
import java.awt.Dimension;
import java.awt.Graphics;

import javax.swing.BoxLayout;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextArea;
import javax.swing.border.Border;
import javax.swing.border.CompoundBorder;
import javax.swing.border.EmptyBorder;

public class Main {

    public static void main(String[] args) {

    Border left = new CompoundBorder(new EBorder(0, 0, 0, 100), new RoundedBorder());
    Border right = new CompoundBorder(new EBorder(0, 100, 0, 0), new RoundedBorder());

    JFrame window = new JFrame();

    JPanel chat = new JPanel();
    chat.setLayout(new BoxLayout(chat, BoxLayout.Y_AXIS));

    JTextArea msg = new Message();
    msg.setLineWrap(true);
    msg.setWrapStyleWord(true);

    msg.setText("ola tudo bem meus caros amigos, como estão? há muito que não vos via por estas bandas haha lol");
    msg.setBorder(left);

    JTextArea msg2 = new Message();
    msg2.setLineWrap(true);
    msg2.setWrapStyleWord(true);

    msg2.setText("ola tudo bem");
    msg2.setBorder(right);

    chat.add(msg);
    chat.add(msg2);

    window.add(chat);

    window.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    window.setSize(400, 500);
    window.setVisible(true);

    }

    static class Message extends JTextArea {
    private static final long serialVersionUID = -2226104809841941057L;

    @Override
    public Dimension getMaximumSize() {
        return new Dimension(super.getMaximumSize().width, getPreferredSize().height);
    }
    }

    static class EBorder extends EmptyBorder {

    private static final long serialVersionUID = 1265703863790826185L;

    public EBorder(int top, int left, int bottom, int right) {
        super(top, left, bottom, right);
    }

    @Override
    public void paintBorder(Component c, Graphics g, int x, int y, int width, int height) {
        g.setColor(c.getParent().getBackground());
        g.fillRect(x, y, left, height);
        g.fillRect(x + width - right, y, right, height);
    }
    }
}

- andronix

---

这样可以完美地解决对齐问题，但我还希望JTextArea适应文本内容，当我添加较短的消息时不会变得更大。这就是为什么我尝试将最大宽度设置为首选宽度的原因。 - ggpfc

您可以调整EmptyBorder的宽度。 - andronix

Answer 3

你最好在聊天面板上使用GridBagLayout，不需要使用另外两个JPanels。

可以像这样：

JPanel pane = new JPanel(new GridBagLayout());
GridBagConstraints c = new GridBagConstraints();
c.anchor = GridBagConstraints.LINE_START;
JTextArea msg = new JTextArea();
msg.setText("ola tudo bem meus caros amigos, como estão? há muito que não vos via por estas bandas haha lol");
pane.add(msg , c);

// Now change the side of the placement on the layout manager
c.anchor = GridBagConstraints.LINE_END;
JTextArea msg2 = new JTextArea();
msg.setText("AGORA VAI RAPÁ!");
pane.add(msg , c);

- Cristiano Fontes