JFrame着色应该喜欢这张照片 [英] JFrame coloration should like to this picture

问题描述

我的问题有点奇怪。

我希望我创建的表单（带有JFrame）着色应该像这样的图片：

<请问我应该使用特殊的外观吗？

解决方案

我是否应该使用特殊外观和感觉？

根据我所知，没有这样的内置Look& Feel可用。但是对于Look& Feel，Look指的是GUI小部件（更正式地说，JComponents）的外观，而feel指的是小部件的行为方式。如果是这样，那么我们总是可以让我们的Swing组件在GUI中出现。

高级响应式应用程序，图形丰富的ooze酷，吸引用户从一开始就抓住了他们的兴奋之情。他们让用户告诉他们的朋友应用程序。

但是，要开发图形丰富的Swing应用程序，我们必须知道如何在组件上呈现自定义图形，使它们像我们一样出现想要（有光泽的颜色，漂亮的质地，动人的动画，漂亮的排版）。我们需要学习如何正确布局组件以将它们相对于另一个进行排列。从回答你的各种问题，我开始明白你想成为一个摇摆的怪人。好吧：

• 第一次，了解 Swing JComponent （ JPanel，JLabel，JButton，JList，JTable，JTextPane 等）和各种类型的事件监听器以及它们如何响应组件。


• 第二，了解 布局管理器 。还有其他高级布局管理器可以使生活更轻松，但首先要了解标准管理器。


• 第三次，了解在摆动组件和摆动喷涂机制上渲染自定义图形。然后是关于字体概念。


• 第四，了解 图形和 Graphics2D 类，用于渲染龋齿类型的几何对象，图像渲染，纹理，渐变绘画等。


• 五，了解 Swing中的并发性。 Swing不是线程安全的，它维护单线程规则。需要很好的线程知识，StackOverflow几乎每天都会出现Swing的线程问题。


• 六，收集肮脏的富客户端这本书，并在您完成上述所有操作后彻底阅读。

现在，您的演示示例：

我试图让应用程序尽可能简短。但是，如果您不知道它们是如何工作的，那么我已经做了一些事情来实现您所请求的GUI，您不应该这样做（例如覆盖 paint（） 功能）。在此示例中，我无法像您提供的图像一样收集纹理。但我使用了织物纹理。应用程序需要首先加载纹理图像。密切关注控制台。它将在运行应用程序之前显示以下消息：

请稍候，加载纹理：
http://www.brewsterwallcovering.com/data/default/images/catalog/original/ 289-5757.jpg

加载完成。开始演示！

我使用过： GridBagLayout 作为MainContainer的窗格布局经理。仔细看看代码并阅读相应的扩展（扩展JCompononent和JButton）以及我为实现更好的GUI而做的绘画（对许多评论家而言，这对于DEMO来说并不是那么好......）

演示源代码：

  import java.awt。*; 
 import java.awt.geom.Rectangle2D; 
 import java.awt.image.BufferedImage; 
 import java.io.IOException; 
 import java.net.URL; 
 import java.util.logging。*; 
 import javax.imageio.ImageIO; 
 import javax.swing。*; 
 import javax.swing.border。*; 
 
 ///用自定义外观创建Button 
 class CButton扩展JButton 
 {
 
 BasicStroke basicStroke = new BasicStroke（2.0f）; 
 public CButton（String txt）{
 super（txt）; 
 setForeground（Color.WHITE）; 
 setFont（getFont（）。deriveFont（Font.BOLD，13））; 
 setContentAreaFilled（false）; 
 setBorder（null）; 
 setCursor（new Cursor（Cursor.HAND_CURSOR））; 
} 
 
 @Override 
 protected void paintComponent（Graphics g）{
 Graphics2D g2d =（Graphics2D）g.create（）; 
 g2d.setColor（new Color（0xFFAA00））; 
 
 g2d.setRenderingHint（RenderingHints.KEY_ANTIALIASING，RenderingHints.VALUE_ANTIALIAS_ON）; 
 g2d.setStroke（basicStroke）; 
 
 int archH =（getHeight（） -  4）/ 2; 
 g2d.drawRoundRect（3,3，getWidth（） -  4，getHeight（） -  4，archH，archH）; 
 
 if（getModel（）。isRollover（））
 {
 g2d.fillRoundRect（3,3，getWidth（） -  4，getHeight（） -  4，archH，archH ）; 
 setForeground（Color.black）; 
 
} 
 else 
 {
 setForeground（Color.white）; 
} 
 g2d.dispose（）; 
 
 super.paintComponent（g）; //要更改生成方法的主体，请选择工具|模板。 
 
} 
 
 
 
} 
 
 / **使用自定义外观创建MainContainer面板** / 
 //使用paintComponent（Graphics g）和paint（Graphics g）自定义绘制
类MainContainer扩展JPanel 
 {
 
 public BufferedImage gradientImage = null; 
 public static BufferedImage textureImg; //为了方便而使它变为静态
 public static boolean loadingFinished = false; 
 
 public MainContainer（）{
 
 setBorder（new EmptyBorder（50,50,50,50））; //设置insets 
 //从关于LayoutManager的链接页面了解GridBagLayout 
 setLayout（new GridBagLayout（））; 
 
 JLabel usrNameLabel = new JLabel（用户名）; 
 changeCompFont（usrNameLabel）; 
 
 JTextField usrNameFeild = new JTextField（user name）; 
 changeCompFont（usrNameFeild）; 
 
 //创建带有左边填充的文本和密码字段的复合边框5 px 
 Border compundBorder = BorderFactory.createCompoundBorder（
 new LineBorder（Color.white，2），
 new EmptyBorder（2,5,2,2））; 
 usrNameFeild.setBorder（compundBorder）; 
 
 
 usrNameFeild.setOpaque（false）; 
 usrNameLabel.setLabelFor（usrNameFeild）; 
 
 JLabel passwordLabel = new JLabel（Password）; 
 changeCompFont（passwordLabel）; 
 
 JPasswordField passFeild = new JPasswordField（Password）; 
 changeCompFont（passFeild）; 
 passFeild.setBorder（compundBorder）; 
 
 passFeild.setOpaque（false）; 
 passwordLabel.setLabelFor（passFeild）; 
 
 //使用GridBagConstraints，请查看链接的在线教程
 GridBagConstraints labCnst = new GridBagConstraints（）; 
 GridBagConstraints txtCnst = new GridBagConstraints（）; 
 
 labCnst.insets = new Insets（0,0,5,10）; 
 txtCnst.insets = new Insets（0,0,5,10）; 
 
 labCnst.ipady = txtCnst.ipady = 10; 
 txtCnst.fill = labCnst.fill = GridBagConstraints.HORIZONTAL; 
 
 labCnst.gridx = 0; 
 txtCnst.gridx = 1; 
 
 labCnst.gridwidth = 1; 
 txtCnst.gridwidth = 2; 
 
 labCnst.weightx = 0.3; 
 txtCnst.weightx = 0.7; 
 
 txtCnst.gridy = labCnst.gridy = 0; 
 add（usrNameLabel，labCnst）; 
 add（usrNameFeild，txtCnst）; 
 
 
 txtCnst.gridy = labCnst.gridy = 1; 
 add（passwordLabel，labCnst）; 
 add（passFeild，txtCnst）; 
 
 labCnst.gridx = 2; 
 labCnst.gridy = 2; 
 labCnst.ipady = 13; 
 labCnst.insets = new Insets（0,0,0,150）; 
 JButton submitButt = new CButton（Log IN）; 
 add（submitButt，labCnst）; 
 
} 
 
 public void changeCompFont（JComponent comp）
 {
 comp.setForeground（Color.WHITE）; 
 comp.setFont（getFont（）。deriveFont（Font.BOLD，13））; 
} 
 
 //要涂抹部件上面的纹理，
 //不要在你完全理解绘画机制的情况下完成
 @Override 
 public void paint（Graphics g）{
 super.paint（g）; //要更改生成方法的主体，请选择工具|模板。 
 
 Graphics2D g2d =（Graphics2D）g.create（）; //克隆工作，它更安全aproach 
 Rectangle2D txRect = new Rectangle2D.Double（0,0，textureImg.getWidth（），textureImg.getHeight（））; 
 TexturePaint txPaint = new TexturePaint（textureImg，txRect）; 
 g2d.setPaint（txPaint）; 
 
 //使纹理透明
 g2d.setComposite（AlphaComposite.getInstance（AlphaComposite.SRC_OVER，0.3f））; 
 g2d.fillRect（0,0，getWidth（），getHeight（））; 
 g2d.dispose（）; //处理图形对象
} 
 
 @Override 
 protected void paintComponent（Graphics g）{
 super.paintComponent （G）; //要更改生成方法的主体，请选择工具|模板。 
 Graphics2D g2d =（Graphics2D）g.create（）; 
 
 if（gradientImage == null || gradientImage.getHeight（）！= getHeight（））
 {
 gradientImage = createGradientImg（）; 
} 
 
 g2d.drawImage（gradientImage，0,0，getWidth（），getHeight（），this）; 
 g2d.dispose（）; 
} 
 
 public BufferedImage createGradientImg（）
 {
 BufferedImage image = new BufferedImage（getWidth（），getHeight（），BufferedImage.TYPE_INT_RGB）; 
 ///背景渐变绘画，背景线性渐变绘画
 ///渐变绘画渲染可以更优化
 LinearGradientPaint lgrPaint = new LinearGradientPaint（0.0f，0.0f，getWidth（ ），getHeight（），
 new float [] {0.0f，0.5f，0.6f，1.0f}，
 new Color [] {new Color（0x002AFF），
 new Color（ 0x0CAAF9），
新颜色（0x0CAAF9），
新颜色（0x002AFF）}）; 
 
 
 Graphics2D g2d =（Graphics2D）image.getGraphics（）; 
 g2d.setPaint（lgrPaint）; 
 //g2d.shear(0.2,0）; 
 g2d.fillRect（0,0，getWidth（），getHeight（））; 
 
 g2d.dispose（）; 
 //g2d.drawImage（textureImg，0,0，getWidth（），getHeight（），null）; 
返回图片; 
} 
 
 
} 
 
公共类CustomApp {
 
 public static void main（String [] args）抛出IOException {
 
 //加载纹理资源图像
 System.out.println（请等待，加载纹理：http：//www.brewsterwallcovering.com/data/default/images/catalog /original/289-5757.jpg）; 
 MainContainer.textureImg = ImageIO.read（新网址（http://www.brewsterwallcovering.com/data/default/images/catalog/original/289-5757.jpg））; 
 System.out.println（加载完成。开始演示！）; 
 
 MainContainer.textureImg = MainContainer.textureImg.getSubimage（0,0,200,200）; 
 
 //在EDT中启动Swing GUI，了解它
 SwingUtilities.invokeLater（new Runnable（）{
 
 @Override 
 public void run（）{
 JFrame frame = new JFrame（Demo：LogIn Dialogue）; 
 
 //将帧大小设置为Demo perposes，否则不建议使用
 frame.setSize（ new Dimension（500,300））; 
 MainContainer container = new MainContainer（）; 
 
 frame.add（new MainContainer（））; 
 frame.setDefaultCloseOperation（JFrame.EXIT_ON_CLOSE） ）; 
 frame.setVisible（true）; 
 
} 
}）; 
} 
} 
  

My question is a bit strange.

I want my created form (with JFrame) coloration should be like to this picture:

Should i use a special look and feel ?

解决方案

Should i use a special look and feel ?

there is no such built-in Look&Feel available as much as i know. However for "Look&Feel", "Look" refers to the appearance of GUI widgets (more formally, JComponents) and "feel" refers to the way the widgets behave. If so, then we can always make our Swing component to be appeared as we want in the GUI.

Advanced responsive applications which are graphically rich ooze cool, sucking users in from the outset and hang onto them with a death grip of excitement. They make users tell their friends about the applications.

However, to develop graphically rich Swing application we must know how to render custom graphics on component, making them to appear as we want( with shiny color, beautiful texture, moving animation, nice typography). We need to learn how to layout the component properly to arrange them one relative to another. From answering your various question, i came to understand that you want to be a swing geek. Well:

• First, Learn about the Swing JComponent(JPanel, JLabel, JButton, JList, JTable, JTextPane etc) and various type of Event listeners and how they responds with the component.
• Second, Learn about the Layout Managers. There are other advanced level layout manager available which makes life easier but learn about the standard managers first.
• Third, Learn about rendering custom graphics on swing components and swing painting mechanism. Then about the Font Concept.
• Fourth, Learn about Graphics and Graphics2D class for rendering carious type of geometric object, image rendering, texturing, gradient painting etc.
• Five, Learn about Concurrency in Swing. Swing is not thread safe, it maintain single threading rules. A good knowledge about threading is required, StackOverflow overflowed almost every day with the threading issues with Swing.
• Six, collect the book Filthy Rich Clients and read it thoroughly when you will have nearly finished all of the above.

Now, A Demo Example for you:

I have tried to make the application as much short and simple as possible. But there are somethings i have done to achieve your requested GUI, which you should not do, if you don't know how they work, (for example overriding the paint() function). In this example i could not collect a texture as the image you have provided. But i have used a fabric texture. The application needs to load the texture image first. keep your eye on the console. It will show following message prior to run the application:

Please wait, Loading Texture : http://www.brewsterwallcovering.com/data/default/images/catalog/original/289-5757.jpg

Loading finished. Starting the Demo!

I have used: GridBagLayout as the MainContainer's pane layout manager. Have a look at the code thoroughly and read about corresponding extension(extending JCompononent and JButton) and painting i have made to achieve a nicer GUI(Well not so much nicer to many critics, but for DEMO....)

Demo Source code:

import java.awt.*;
import java.awt.geom.Rectangle2D;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.net.URL;
import java.util.logging.*;
import javax.imageio.ImageIO;
import javax.swing.*;
import javax.swing.border.*;

/// creating the Button with custom look
class CButton extends JButton
{

    BasicStroke basicStroke = new BasicStroke(2.0f);
    public CButton(String txt) {
        super(txt);
        setForeground(Color.WHITE);
        setFont(getFont().deriveFont(Font.BOLD, 13));
        setContentAreaFilled(false);
        setBorder(null);
        setCursor(new Cursor(Cursor.HAND_CURSOR));
    }

    @Override
    protected void paintComponent(Graphics g) {
        Graphics2D g2d = (Graphics2D) g.create();
        g2d.setColor(new Color(0xFFAA00));

        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        g2d.setStroke(basicStroke);

        int archH =  (getHeight()-4)/2;
        g2d.drawRoundRect(3, 3, getWidth()-4, getHeight()-4, archH, archH);

        if(getModel().isRollover())
        {
            g2d.fillRoundRect(3, 3, getWidth()-4, getHeight()-4, archH, archH);
            setForeground(Color.black);

        }
        else 
        {
            setForeground(Color.white);
        }
        g2d.dispose();

        super.paintComponent(g); //To change body of generated methods, choose Tools | Templates.

    }



}

/** creating the MainContainer panel with custom look **/
// custom painting to with paintComponent(Graphics g) and paint(Graphics g)
class MainContainer extends JPanel
{

    public BufferedImage gradientImage = null;
    public static BufferedImage textureImg; // made it static just for easyness
    public static boolean loadingFinished = false;

    public MainContainer() {

        setBorder(new EmptyBorder(50, 50, 50, 50)); // setting the insets 
        // learn about GridBagLayout from the linked page about LayoutManager
        setLayout(new GridBagLayout()); 

        JLabel usrNameLabel = new JLabel("User Name");
        changeCompFont(usrNameLabel);

        JTextField usrNameFeild = new JTextField("user name");
        changeCompFont(usrNameFeild);

        // create compund border for text and password feild with left padding 5 px
        Border compundBorder = BorderFactory.createCompoundBorder(
                                            new LineBorder(Color.white, 2), 
                                            new EmptyBorder(2, 5, 2, 2));
        usrNameFeild.setBorder(compundBorder);


        usrNameFeild.setOpaque(false);
        usrNameLabel.setLabelFor(usrNameFeild);

        JLabel passwordLabel = new JLabel("Password");
        changeCompFont(passwordLabel);

        JPasswordField passFeild = new JPasswordField("Password");
        changeCompFont(passFeild);
        passFeild.setBorder(compundBorder);

        passFeild.setOpaque(false);
        passwordLabel.setLabelFor(passFeild);

        // working with GridBagConstraints, please check out the linked online tutorial 
        GridBagConstraints labCnst = new GridBagConstraints();
        GridBagConstraints txtCnst = new GridBagConstraints();

        labCnst.insets = new Insets(0, 0, 5, 10);
        txtCnst.insets =  new Insets(0, 0, 5, 10);

        labCnst.ipady = txtCnst.ipady = 10;
        txtCnst.fill = labCnst.fill = GridBagConstraints.HORIZONTAL;

        labCnst.gridx = 0;
        txtCnst.gridx = 1;

        labCnst.gridwidth = 1;
        txtCnst.gridwidth = 2;

        labCnst.weightx = 0.3;
        txtCnst.weightx = 0.7;

        txtCnst.gridy = labCnst.gridy = 0;
        add(usrNameLabel, labCnst);
        add(usrNameFeild, txtCnst);


        txtCnst.gridy = labCnst.gridy = 1;
        add(passwordLabel, labCnst);
        add(passFeild, txtCnst);

        labCnst.gridx = 2;
        labCnst.gridy = 2;
        labCnst.ipady = 13;
        labCnst.insets = new Insets(0, 0, 0, 150);
        JButton submitButt = new CButton("Log IN");
        add(submitButt, labCnst);

    }

    public void changeCompFont(JComponent comp)
    {
        comp.setForeground(Color.WHITE);
        comp.setFont(getFont().deriveFont(Font.BOLD, 13));
    }

    // To PAINT THE TEXTURE ABOVE THE COMPONENTS, 
    //DON'T DO IT UNTIL YOU UNDERSTAND PAINTING MECHANISM FULLY
    @Override
    public void paint(Graphics g) {
         super.paint(g); //To change body of generated methods, choose Tools | Templates.

        Graphics2D g2d = (Graphics2D)g.create(); // cloning to work, it is safer aproach
        Rectangle2D txRect = new Rectangle2D.Double(0, 0, textureImg.getWidth(), textureImg.getHeight());
        TexturePaint txPaint = new TexturePaint(textureImg, txRect);
        g2d.setPaint(txPaint);

        //make the texture transparent
        g2d.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.3f));
        g2d.fillRect(0, 0, getWidth(), getHeight());
        g2d.dispose();// disposing the graphics object 
    }

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g); //To change body of generated methods, choose Tools | Templates.
        Graphics2D g2d = (Graphics2D) g.create();

        if(gradientImage==null || gradientImage.getHeight() != getHeight())
        {
            gradientImage = createGradientImg();
        }

        g2d.drawImage(gradientImage, 0, 0, getWidth(), getHeight(), this);
        g2d.dispose();
    }

    public BufferedImage createGradientImg()
    {
       BufferedImage image = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_RGB);
       /// background gradient paint, linear gradient paint for the background
       /// Gradient paint rendering could be made more optimized
            LinearGradientPaint lgrPaint =  new LinearGradientPaint(0.0f, 0.0f, getWidth(), getHeight(),
                                                                new float[] { 0.0f, 0.5f, 0.6f, 1.0f },
                                                                new Color[] { new Color(0x002AFF),
                                                                new Color(0x0CAAF9),
                                                                new Color(0x0CAAF9),
                                                                new Color(0x002AFF) });


            Graphics2D g2d = (Graphics2D) image.getGraphics();
            g2d.setPaint(lgrPaint);
            //g2d.shear(0.2, 0);
            g2d.fillRect(0, 0, getWidth(), getHeight());

            g2d.dispose();
            //g2d.drawImage(textureImg, 0, 0, getWidth(), getHeight(), null);
            return image;
    }


}

public class CustomApp {

    public static void main(String[] args) throws IOException {

        // load the texture resource image
        System.out.println("Please wait, Loading Texture : http://www.brewsterwallcovering.com/data/default/images/catalog/original/289-5757.jpg");
        MainContainer.textureImg = ImageIO.read(new URL("http://www.brewsterwallcovering.com/data/default/images/catalog/original/289-5757.jpg"));
        System.out.println("Loading finished. Starting the Demo!");

        MainContainer.textureImg = MainContainer.textureImg.getSubimage(0, 0, 200, 200);

        // Starting the Swing GUI in the EDT, learn about it
        SwingUtilities.invokeLater(new Runnable() {

            @Override
            public void run() {
                JFrame frame = new JFrame("Demo: LogIn Dialogue");

                // set frame size as Demo perposes, otherwise not recommended
                frame.setSize(new Dimension(500, 300)); 
                MainContainer container = new MainContainer();

                frame.add(new MainContainer());
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.setVisible(true);

            }
        });
    }
}

这篇关于JFrame着色应该喜欢这张照片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！