How to have a transparent JTextField?

This is my first post here, so I apologize if this is not the right way to ask. I would like suggestions to improve.

Coming to the question, I saw a youtube video(https://www.youtube.com/watch?v=2Ruc5rkDg1E) about transparent Jtextfield, but the same code isn't giving the same output.

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

    public class TextField3 {
       public TextField3() {
          ImageIcon icon = new ImageIcon("pic1.jpg");
          //JLabel l1 = new JLabel();
          //l1.setBounds(0, 0, 900, 500);
          //l1.setIcon(icon);

          Color back = new Color(0, 0, 0, 80);
          Color fore = new Color(255, 255, 255);
          Font font = new Font("Times New Roman", Font.BOLD, 24);

          JFrame f1 = new JFrame("My First TextField");
          f1.setBounds(150, 50, 900, 500);
          //f1.setVisible(true);
          f1.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
          f1.getContentPane().setLayout(null);

          JLabel l1 = new JLabel();
          l1.setBounds(0, 0, 900, 500);
          l1.setIcon(icon);

          JTextField tf = new JTextField("TextField");
          //tf.setOpaque(false);
          tf.setBounds(275, 150, 350, 60);
          tf.setVisible(true);
          tf.setHorizontalAlignment(JTextField.CENTER);

          tf.setBackground(back);
          tf.setForeground(fore);
          tf.setFont(font);

          f1.add(l1);
          f1.add(tf);
          f1.setVisible(true);
      }
      public static void main(String[] args) {
          TextField3 tf = new TextField3();
      }
    }

The output from the youtube video.

My output

The code above isn't exactly same as the video's code. Actually the code in the video generated a blank JFrame, then I moved the JLabel portion of the code below the JFrame's part, then it produced the output in the 2nd image.

I searched about this issue and found that setOpaque to false will solve this. But when I tried it, the JTextField disappears completely and only the background image is shown. Can someone help in solving this issue?

Solution

Swing was designed to be used with layout managers. You should NOT be using a null layout and you should NOT be using setBounds().

Swing is designed on a parent/child relationship. If you want the text field to appear on top of the label then don't add both components to the frame. Instead you need a structure like:

- frame
    - background label
        - text field

So your basic code should be something like:

JTextField textField = new JTextField("text");
textField.setBackground(...);

JLabel background = new JLabel(...);
label.setlayout( new GridBagLayout() );
label.add(textField, new GridBagConstraints());

frame.add(label, BorderLayout.CENTER);

Now you will see the text field in the center of the label.

However, you will still have a problem with the semi-transparent background of the text field, since Swing does not handle semi-transparency properly. For more information and a solution check out: Why does the alpha in this timer draw on top of itself in this Java Swing Panel?