具有背景图像的JPanel上具有渐变和圆角边缘的JButton

时间:2018-11-16 15:33:24

标签: jpanel background-image jbutton gradient rounded-corners

我正在尝试在具有背景图像的JPanel上使用带有渐变的圆形JButton。我将背景图像加载到JPanel上,并且JButton显示带有渐变和圆角的边缘。但是,当我将鼠标移到按钮上时,拐角处显示了按钮下方矩形区域的边界。我尝试将空的mouseEntered和mouseExited事件添加到我的JGradientButton类中,但这没有帮助。我在Raspberry Pi 3上的Windows 10 Pro和Raspbian上都得到了相同的结果。

这是我的代码...

package roundbutton;

import java.awt.Color;
import java.awt.Dimension;
import java.awt.GradientPaint;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.GridBagLayout;
import java.awt.Image;
import java.awt.Point;
import java.io.InputStream;
import javax.imageio.ImageIO;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class RoundButton {
    private static JFrame homeFrame;
    private static JPanel homePanel;
    private static JGradientButton homeGetStartedButton;
    private static InputStream isBackground;

    public static void main(String[] args) {
        javax.swing.SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                try {
                    isBackground = this.getClass().getResourceAsStream("Beautiful-Gradient-Wallpaper.jpg");
                    //https://wallpaper.wiki/wp-content/uploads/2017/06/Beautiful-Gradient-Wallpaper.jpg
                } catch (Exception ex) {
                    isBackground = null;
                    System.out.println("getResource exception: " + ex.getMessage());
                }
                createAndShowGUI();
            }
        });
    }
    private static class JGradientButton extends JButton {
        private JGradientButton() {
            super("Gradient Button");
        }

        @Override
        protected void paintComponent(Graphics g) {
            Color blueGradientTop = new Color(0,55,128);
            Color blueGradientBottom = new Color(0,177,224);
            final Graphics2D g2 = (Graphics2D) g.create();
            g2.setPaint(new GradientPaint(
                    new Point(0, 0), blueGradientTop,
                    new Point(getWidth(), getHeight()), blueGradientBottom));
            g2.fillRoundRect(0, 0, getWidth(), getHeight(), 100, 100);
            //g2.fillRect(0, 0, getWidth(), getHeight());
            g2.dispose();
            super.paintComponent(g);
        }

        protected void mouseEntered(java.awt.event.MouseEvent evt) {
        }

        protected void mouseExited(java.awt.event.MouseEvent evt) {
        }

        public static JGradientButton newInstance() {
            return new JGradientButton();
        }
    }

    private static class myPanel extends JPanel {
        public myPanel() {
        }

        @Override
        protected void paintComponent(Graphics g) {
            super.paintComponent(g);
            if(isBackground != null) {
                try {
                    Image backImage = ImageIO.read(isBackground);
                    final Graphics2D g2 = (Graphics2D) g.create();
                    g2.drawImage(backImage, 0, 0, getWidth(), getHeight(), this);
                    g2.dispose();
                } catch (Exception ex) {
                    System.out.println("backImage exception: " + ex.getMessage());
                }
            }
        }
    }
    private static void createAndShowGUI() {
        homeFrame = new JFrame("Rounded Button Test");
        homeFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        homeFrame.setBounds(0, 0, 1024, 768);

        homePanel = new myPanel();
        homePanel.setLayout(new GridBagLayout());
        homePanel.setOpaque(false);
        homePanel.setFocusable(false);
        homePanel.setMaximumSize(new Dimension(1024, 768));
        homePanel.setMinimumSize(new Dimension(1024, 768));
        homePanel.setPreferredSize(new Dimension(1024, 768));
        homeFrame.add(homePanel);

        homeGetStartedButton = new JGradientButton();
        homeGetStartedButton.setText("<html><p align=\"center\">Touch Here To<br>Get Started</p></html>");
        homeGetStartedButton.setFont(new java.awt.Font("Arial", 0, 72));
        homeGetStartedButton.setForeground(Color.white);
        homeGetStartedButton.setContentAreaFilled(false);
        homeGetStartedButton.setBorderPainted(false);
        homeGetStartedButton.setFocusPainted(false);
        homeGetStartedButton.setFocusable(false);
        homeGetStartedButton.setMaximumSize(new Dimension(676, 507));
        homeGetStartedButton.setMinimumSize(new Dimension(676, 507));
        homeGetStartedButton.setPreferredSize(new Dimension(676, 507));
        homePanel.add(homeGetStartedButton);

        homeFrame.setVisible(true);
     }    
}

这是我启动程序时显示的内容... Screen capture at program start

一旦鼠标移到按钮上,它就会变成这样... Screen capture after mouse moves over the button

我正在Windows 10上进行代码工作,但是我正在处理的程序将在Raspberry Pi 3上使用。我最初是使用JavaFX来实现这一目的的,这使得GUI的编写变得容易。但是,Raspbian不再直接支持该功能。我找到了允许我使JavaFX代码在Pi3上运行的链接,但GUI不稳定。在运行该程序一小段时间(10-15分钟)后,屏幕将开始从下方显示工件(CPU监视器图,时钟,桌面图标等)。

我是要解决这个错误问题,还是干脆做到这一点?欢迎任何建议,在此先谢谢您!

0 个答案:

没有答案