How to make JFrame same shape as Image with transparent Background?

Question

I am a Beginner in Java using NetBeans as my IDE...

I am trying to make a custom shaped JFrame that is shaped like the Image I will be creating... I found a solution here and here but I can't figure out how to apply it in Netbeans..

Took me hours and hours of research but to no avail.. So I asked it here hoping someone would enlighten me... I also hope you explain the codes used and how it worked so I would also learn and just copy pasting...

For my money, I wouldn't bother with the window shape, I'd just make it transparent for [example](http://stackoverflow.com/questions/13906687/how-can-i-smooth-my-jframe-shape/13906713#13906713), [example](http://stackoverflow.com/questions/13588786/jframe-the-same-shape-as-an-image-program-running-in-background/13594794#13594794), [example](http://stackoverflow.com/questions/15982431/java-swing-transparent-png-permanently-captures-original-background/15983717#15983717), [example](http://stackoverflow.com/questions/25394366/custom-round-skin-gui/25395267#25395267) — MadProgrammer, Mar 21 '16 at 21:07
The main reason is, you lose control over the antialiasing and the image looks gagared and unpleasent :P — MadProgrammer, Mar 21 '16 at 21:08
@MadProgrammer I made your code work on NetBeans but my problem is when I add a component, it doesn't show up... Can you suggest another solution? I just want the main `JFrame` transparent, add a `JPanel` and put every components there... Preferably, I want the `JPanel` transparent also so I can design the window using `JLabel` with an icon(image).. — Karyuu Ouji, Mar 21 '16 at 23:38
Well, generally speaking, I've supplied 4 runnable examples most of which add at least one component to the frame — MadProgrammer, Mar 21 '16 at 23:41
@MadProgrammer I already read all that example before I asked the question.. Most of those are made purely out of code, which is good, but as I stated on my question, I like to use the IDE for easier adding of components.. Anyway... I played with NetBeans while waiting for an answer and reading some other topics related to this one... I happen to make a much simpler approach, but I am not sure if it's good enough or what.. — Karyuu Ouji, Mar 22 '16 at 01:30
Eventually, you're going to need to get your hand dirty, especially with something as complex as shaped/transparent windows — MadProgrammer, Mar 22 '16 at 01:31
What I did was very easy... I created a new `Java Application` without setting(generating) a `Main` Class.. I added a `Package` and added a `JPanel` Form... I coded the `main` method and created a new `JFrame`... I add the `JPanel` in the frame and set some properties... From the component pallet, I added a `JLabel` and loaded my image on it's `Icon` property.. I then set the size of `JPanel` and `JLabel` same as the image... I will post the code later... P.S. Where should I put the code? — Karyuu Ouji, Mar 22 '16 at 01:54

score 1 · Answer 1 · answered Mar 21 '16 at 15:25

1

I also hope you explain the codes used and how it worked

That is the benefit of a tutorial. Read the section from the Swing tutorial on How to Create Translucent and Shaped Windows for information and working examples.

I can't figure out how to apply it in Netbeans

Don't use the IDE to generate your code. If you ever switch IDE's then you need to learn a new one. Instead spend the time learning Java/Swing, not the IDE.

answered Mar 21 '16 at 15:25

camickr

321,443
19
166
288

I have finished reading the [How to Create Translucent and Shaped Windows](http://docs.oracle.com/javase/tutorial/uiswing/misc/trans_shaped_windows.html).... I like to use the IDE for easy designing of forms... Code wise, I tend to view and read the generated code so as to know their function and how they work... Thanks for the tip anyway.. – Karyuu Ouji Mar 21 '16 at 16:14

score 0 · Accepted Answer · answered Mar 22 '16 at 03:11

After a couple of hours Playing around with NetBeans after reading and watching couple of tutorials I have found, I finally got a simple solution...

Here is the code:

package testPack;

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

/**
 *
 * @author Karyuu Ouji
 */
public class TestPanel extends javax.swing.JPanel {

    /**
     * Creates new form TestPanel
     */
    public TestPanel() {

        initComponents();
        this.setPreferredSize(new Dimension(704,182));
        this.setOpaque(false);
        this.setDoubleBuffered(true);

    }

    /**
     * This method is called from within the constructor to initialize the form.
     * WARNING: Do NOT modify this code. The content of this method is always
     * regenerated by the Form Editor.
     */
    @SuppressWarnings("unchecked")
    // <editor-fold defaultstate="collapsed" desc="Generated Code">                          
    private void initComponents() {

        jButton1 = new javax.swing.JButton();
        jLabel1 = new javax.swing.JLabel();

        setLayout(null);

        jButton1.setText("Close");
        jButton1.addMouseListener(new java.awt.event.MouseAdapter() {
            public void mouseReleased(java.awt.event.MouseEvent evt) {
                jButton1MouseReleased(evt);
            }
        });
        add(jButton1);
        jButton1.setBounds(593, 0, 110, 23);

        jLabel1.setIcon(new javax.swing.ImageIcon(getClass().getResource("/testPack/sao.png"))); // NOI18N
        jLabel1.setText("jLabel1");
        add(jLabel1);
        jLabel1.setBounds(0, 0, 704, 180);
    }// </editor-fold>                        

    private void jButton1MouseReleased(java.awt.event.MouseEvent evt) {                                       
        System.exit(0);
    }                                      

    public static void main(String[] args) {

        JFrame frmMain = new JFrame();
        frmMain.setUndecorated(true);
        frmMain.setBackground(new Color(0,0,0,0));
        frmMain.add(new TestPanel());
        frmMain.pack();
        frmMain.setLocationRelativeTo(null);
        frmMain.setVisible(true);

    }


    // Variables declaration - do not modify                     
    private javax.swing.JButton jButton1;
    private javax.swing.JLabel jLabel1;
    // End of variables declaration                   
}

Note: Most of the code are generated by NetBeans

All I did was add a JLabel from the component pallet and set the size of the JPanel and JLabel the same as the image size.

Then I put on the image in the JLabel via the Icon property.

Setting Icon/Image

And here is what it looks like when I run the app.

Running

I hope this will help someone like me in the future... :)

How to make JFrame same shape as Image with transparent Background?

2 Answers2