gpt4 book ai didi

java - 我需要做什么来用渐变绘画复制这个组件?

转载 作者:塔克拉玛干 更新时间:2023-11-03 05:02:42 27 4
gpt4 key购买 nike

我试图复制这个组件(在帖子的底部),但我似乎无法让它看起来不错。

enter image description here

所以我想知道,如何复制这种渐变颜料?或者,如果不是渐变涂料,我该怎么做才能获得类似的结果?

与此组件相比,我的尝试结果是非常平坦的黑色。它还具有 JFrame 选项(关闭、最小化等),并且组件没有“圆形”外观。我正在寻找可以改进我所拥有的并解释我哪里出错的人。我知道我可以简单地使用已经制作好的外观,但我想让我的示例项目尽可能接近图像中的 BitDefender GUI,不包括文本。 (如果需要我可以提供代码)

另请注意,我跳过了背景和“病毒防护”、“自动扫描”、“我的 BitDefender”面板之间的面板。我这样做主要是因为我想让我的 SSCCE 尽可能小。

我还想指出,在 3 个 TopPanels 上将 insets 设置为 gbc.insets = new Insets(2,10,2,10); 使其看起来更接近 BitDefender GUI 的间距。 (我只是暂时没有时间上传图片。所以我保留了代码,但我确实意识到它可以更新到上面的插图。

enter image description here

编辑 - 更新了更多来源

这是我的代码/SSCCE(它是 3 个独立的类,但我将它们合并为一个 .java)

package testgui;

import java.awt.*;
import javax.swing.BorderFactory;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;


public class TestGui {

public TestGui() {
JFrame frame = new JFrame();
MidPanel midPanel = new MidPanel();
TopPanel topPanel1 = new TopPanel();
TopPanel topPanel2 = new TopPanel();
TopPanel topPanel3 = new TopPanel();
JLabel appName = new JLabel("MyApplication");
JLabel verNum = new JLabel("version 1.0");
Font verFont = new Font("Tahoma", Font.BOLD, 11);
Font nameFont = new Font("Tahoma", Font.BOLD, 14);

GridBagConstraints gbc = new GridBagConstraints();

appName.setForeground(Color.WHITE);
appName.setFont(nameFont);
verNum.setForeground(Color.WHITE);
verNum.setFont(verFont);

//add program name and version number
gbc.gridx = 0;
gbc.gridy = 0;
gbc.anchor = GridBagConstraints.WEST;
gbc.insets = new Insets(5, 5, 5, 5);
midPanel.add(appName, gbc);

gbc.gridx = 0;
gbc.gridy = 1;
gbc.anchor = GridBagConstraints.WEST;
gbc.insets = new Insets(5, 5, 5, 5);
midPanel.add(verNum, gbc);

//add 3 example top panels to midpanel
gbc.gridx = 0;
gbc.gridy = 2;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.insets = new Insets(1,2,1,2);
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1.0;
midPanel.add(topPanel1, gbc);

gbc.gridx = 0;
gbc.gridy = 3;
gbc.insets = new Insets(1,2,1,2);
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1.0;
midPanel.add(topPanel2, gbc);

gbc.gridx = 0;
gbc.gridy = 4;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.insets = new Insets(1,2,1,2);
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1.0;
midPanel.add(topPanel3, gbc);

//add panel to push other panels to top
gbc.gridx = 0;
gbc.gridy = 5;
gbc.fill = GridBagConstraints.VERTICAL;
gbc.weighty = 1.0;
JPanel invisPanel = new JPanel();
invisPanel.setOpaque(false);
midPanel.add(invisPanel, gbc);

frame.getContentPane().add(midPanel);
frame.pack();
frame.setVisible(true);
}

//test it out
public static void main(String[] args) {
new TestGui();
}

//class for the top 3 panels
private class TopPanel extends JPanel {

private int maxLength;
private boolean cyclic;


public TopPanel() {
initComponents();
setOpaque(false);
cyclic = true;
maxLength = 0;
}

@Override
public void paintComponent(Graphics g) {
if(isOpaque()) {
super.paintComponent(g);
return;
}

int width = getWidth();
int height = getHeight();

GradientPaint paint = null;

Color top = new Color(50, 50, 50);
Color btm = new Color(19, 19, 19);

paint = new GradientPaint(width / 2, 0, top, width / 2, maxLength > 0 ? maxLength : height, btm, cyclic);

if(paint == null) {
throw new RuntimeException("Invalid direction specified in GamerTagPanel");
}

Graphics2D g2d = (Graphics2D) g;
Paint oldPaint = g2d.getPaint();
g2d.setPaint(paint);
g2d.fillRect(0, 0, width, height);
g2d.setPaint(oldPaint);
super.paintComponent(g);
}

@Override
public Dimension getPreferredSize() {
return new Dimension(300, 200);
}

private void initComponents() {
GridBagConstraints gbc;
JLabel jLabel1 = new JLabel();
JLabel jLabel2 = new JLabel();

setBorder(BorderFactory.createLineBorder(new Color(204,204,204)));
setLayout(new GridBagLayout());

jLabel1.setFont(new Font("Tahoma", Font.BOLD, 11));
jLabel1.setForeground(new Color(255, 255, 255));
jLabel1.setText("Scanning...");
gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 0;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.insets = new Insets(5, 5, 5, 5);
add(jLabel1, gbc);

jLabel2.setFont(new java.awt.Font("Tahoma", Font.BOLD, 11));
jLabel2.setForeground(new java.awt.Color(255, 255, 255));
jLabel2.setText("C:\\Directory\\Folder\\SubFolder\\SpecificFolder\\File.file");
gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 1;
gbc.gridwidth = 2;
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.weightx = 1.0;
gbc.insets = new Insets(5, 5, 5, 5);
add(jLabel2, gbc);
}
}

public class MidPanel extends JPanel {

private int maxLength;
private boolean cyclic;

public MidPanel() {
setLayout(new GridBagLayout());
setOpaque(false);
maxLength = 0;
cyclic = false;
}

@Override
public void paintComponent(Graphics g) {
if(isOpaque()) {
super.paintComponent(g);
return;
}

int width = getWidth();
int height = getHeight();

GradientPaint paint = null;

Color top = new Color(75, 75, 75);
Color btm = new Color(19, 19, 19);

paint = new GradientPaint(width / 2, 0, top, width / 2, maxLength > 0 ? maxLength : height, btm, cyclic);

if(paint == null) {
throw new RuntimeException("Invalid direction specified in GamerTagPanel");
}

Graphics2D g2d = (Graphics2D) g;
Paint oldPaint = g2d.getPaint();
g2d.setPaint(paint);
g2d.fillRect(0, 0, width, height);
g2d.setPaint(oldPaint);
super.paintComponent(g);
}

@Override
public Dimension getPreferredSize() {
return new Dimension(300, 400);
}
}
}

感谢 JoopEggen 指出我在 GradientPaint 上的颜色问题。它帮了很多忙。我仍在寻找可以组装一个更好/更接近外观的示例的人。这是我第一次尝试以这种方式覆盖 paintComponent。

最佳答案

让我们先做一些逆向工程。在此过程中可以进行一些简化。此外,我认为还可以改善应用程序的外观,因为第一印象远非非常积极。

enter image description here

基本上可以在该设计背后找到以下元素:

  • 渐变
  • 正确选择颜色
  • 圆角
  • 大纲

enter image description here

请注意,圆角、轮廓很重要。顺便说一句,可以优化一些渐变以提供干净简单的设计。请查看The Battle Between Flat Design And Skeuomorphism以获得额外的动力。

您的示例已修改,如下所示(这只是一个视觉结果):

enter image description here

我使用了以下颜色:

enter image description here

代码:

public class TestGui {

public TestGui() {
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

MidPanel midPanel = new MidPanel();
TopPanel topPanel1 = new TopPanel();
TopPanel topPanel2 = new TopPanel();
TopPanel topPanel3 = new TopPanel();

JLabel appName = new JLabel("MyApplication");
JLabel verNum = new JLabel("version 1.0");
Font verFont = new Font("Tahoma", Font.BOLD, 11);
Font nameFont = new Font("Tahoma", Font.BOLD, 14);

GridBagConstraints gbc = new GridBagConstraints();

appName.setForeground(Color.WHITE);
appName.setFont(nameFont);
verNum.setForeground(new Color(0xFF9f9f9f));
verNum.setFont(verFont);

//add program name and version number
gbc.gridx = 0;
gbc.gridy = 0;
gbc.anchor = GridBagConstraints.WEST;
gbc.insets = new Insets(5, 5, 5, 5);
midPanel.add(appName, gbc);

gbc.gridx = 0;
gbc.gridy = 1;
gbc.anchor = GridBagConstraints.WEST;
gbc.insets = new Insets(5, 5, 5, 5);
midPanel.add(verNum, gbc);

//add 3 example top panels to midpanel
gbc.gridx = 0;
gbc.gridy = 2;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.insets = new Insets(1,2,1,2);
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1.0;
midPanel.add(topPanel1, gbc);

gbc.gridx = 0;
gbc.gridy = 3;
gbc.insets = new Insets(1,2,1,2);
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1.0;
midPanel.add(topPanel2, gbc);

gbc.gridx = 0;
gbc.gridy = 4;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.insets = new Insets(1,2,1,2);
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.weightx = 1.0;
midPanel.add(topPanel3, gbc);

//add panel to push other panels to top
gbc.gridx = 0;
gbc.gridy = 5;
gbc.fill = GridBagConstraints.VERTICAL;
gbc.weighty = 1.0;
JPanel invisPanel = new JPanel();
invisPanel.setOpaque(false);
midPanel.add(invisPanel, gbc);

frame.getContentPane().add(midPanel);
frame.pack();
frame.setVisible(true);
}

//test it out
public static void main(String[] args) {
new TestGui();
}

//class for the top 3 panels
private class TopPanel extends JPanel {

private int maxLength;
private boolean cyclic;


public TopPanel() {
super(true);
initComponents();
setOpaque(false);
cyclic = true;
maxLength = 0;
}


@Override
public void paintComponent(Graphics g) {
if(isOpaque()) {
super.paintComponent(g);
return;
}

int width = getWidth();
int height = getHeight();

GradientPaint paint = null;

//Color top = new Color(50, 50, 50);
//Color btm = new Color(19, 19, 19);

Color top = new Color(0xFF222222);
Color btm = new Color(0xFF0c0c0c);

paint = new GradientPaint(width / 2, 0, top, width / 2, maxLength > 0 ? maxLength : height, btm, cyclic);

if(paint == null) {
throw new RuntimeException("Invalid direction specified in GamerTagPanel");
}

Graphics2D g2d = (Graphics2D) g;
Paint oldPaint = g2d.getPaint();
g2d.setPaint(paint);
g2d.fillRect(0, 0, width, height);
g2d.setPaint(oldPaint);

super.paintComponent(g);
}

@Override
public Dimension getPreferredSize() {
return new Dimension(300, 200);
}

@Override
public void paintBorder(Graphics g) {
Dimension d = getSize();

g.setColor(new Color(0xFF484848));
g.drawRoundRect(1, 1, d.width-3, d.height-3, 10, 10);

g.setColor(Color.BLACK);
g.drawRoundRect(0, 0, d.width-1, d.height-1, 10, 10);
}

private void initComponents() {
GridBagConstraints gbc;
JLabel jLabel1 = new JLabel();
JLabel jLabel2 = new JLabel();

setBorder(BorderFactory.createLineBorder(new Color(204,204,204)));
setLayout(new GridBagLayout());

jLabel1.setFont(new Font("Tahoma", Font.BOLD, 11));
jLabel1.setForeground(new Color(255, 255, 255));
jLabel1.setText("Scanning...");
gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 0;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.insets = new Insets(5, 5, 5, 5);
add(jLabel1, gbc);

jLabel2.setFont(new java.awt.Font("Tahoma", Font.BOLD, 11));
jLabel2.setForeground(new Color(0xFF9f9f9f));
jLabel2.setText("C:\\Directory\\Folder\\SubFolder\\SpecificFolder\\File.file");
gbc = new GridBagConstraints();
gbc.gridx = 0;
gbc.gridy = 1;
gbc.gridwidth = 2;
gbc.fill = GridBagConstraints.HORIZONTAL;
gbc.anchor = GridBagConstraints.NORTHWEST;
gbc.weightx = 1.0;
gbc.insets = new Insets(5, 5, 5, 5);
add(jLabel2, gbc);
}
}

public class MidPanel extends JPanel {

private int maxLength;
private boolean cyclic;

public MidPanel() {
setLayout(new GridBagLayout());
setOpaque(false);
maxLength = 0;
cyclic = false;
}


// public void paintBorder(Graphics g) {
// g.setColor(Color.RED);
// Rectangle bounds = getBounds();
// g.drawRoundRect(bounds.x, bounds.y, bounds.width, bounds.height, 10, 10);
// }

@Override
public void paintComponent(Graphics g) {
if(isOpaque()) {
super.paintComponent(g);
return;
}

int width = getWidth();
int height = getHeight();

GradientPaint paint = null;

Color top = new Color(0xFF282828);
Color btm = new Color(0xFF0e0e0e);

paint = new GradientPaint(width / 2, 0, top, width / 2, maxLength > 0 ? maxLength : height, btm, cyclic);

if(paint == null) {
throw new RuntimeException("Invalid direction specified in GamerTagPanel");
}

Graphics2D g2d = (Graphics2D) g;
Paint oldPaint = g2d.getPaint();
g2d.setPaint(paint);
g2d.fillRect(0, 0, width, height);
g2d.setPaint(oldPaint);
super.paintComponent(g);
}

@Override
public Dimension getPreferredSize() {
return new Dimension(300, 400);
}
}
}

实现此 UI 的最佳方式

我认为唯一正确的方法是实现新的外观子集。看看project seaglass :

enter image description here

我用了什么

所有这些示例都是使用 Inkscape 准备的-- 一个开源 vector 图形编辑器。你可以下载我的SVG source

关于java - 我需要做什么来用渐变绘画复制这个组件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14898497/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com