🎨 Custom Components and Painting in Java Swing 🎨

---

📝 What Are Custom Components in Java Swing?

In Java Swing, you can customize your user interface by creating custom components. These components are typically used when the standard Swing components (like JButton, JLabel, etc.) don't fully meet your needs. By creating custom components, you can have complete control over the appearance and behavior of elements in your GUI.

Additionally, painting in Swing allows you to draw on components, such as adding custom graphics, shapes, and images to your UI.

---

🎯 Key Concepts:

1. Custom Component: A component that is created by extending an existing Swing component or JComponent.
2. Painting: The process of rendering custom graphics (lines, shapes, text, images) onto a component.
3. Graphics Class: This class provides methods for drawing shapes, text, and images.

---

📚 Step 1: Creating a Custom Component

To create a custom component, you generally extend a Swing component (such as JPanel, JButton, etc.) and override the paintComponent(Graphics g) method to draw custom graphics.

📝 Example: Custom Rectangle Component

Let's create a custom component that draws a rectangle.

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

public class CustomComponentExample extends JPanel {

    // Override paintComponent method to draw custom graphics
    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);  // Call the superclass method to ensure proper rendering
        g.setColor(Color.BLUE);    // Set the drawing color
        g.fillRect(50, 50, 200, 100);  // Draw a filled rectangle at position (50, 50) with width 200 and height 100
    }

    public static void main(String[] args) {
        JFrame frame = new JFrame("Custom Component Example");
        CustomComponentExample customComponent = new CustomComponentExample();

        frame.add(customComponent);   // Add custom component to the frame
        frame.setSize(300, 200);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setVisible(true);
    }
}

🎨 Explanation:

1. Extending JPanel: We create a custom class CustomComponentExample that extends JPanel. Panels are often used for grouping components or drawing custom graphics.
2. Overriding paintComponent(Graphics g): The paintComponent() method is overridden to define how we want to draw on the component.
   • super.paintComponent(g) ensures that the panel is properly rendered before our custom drawing.
   • g.setColor(Color.BLUE) sets the drawing color.
   • g.fillRect() draws a filled rectangle.
3. Adding to JFrame: The custom component is added to a JFrame, just like any other Swing component.

---

👩‍🎨 Output:

• When you run the code, a window will open with a blue rectangle drawn on the custom panel.

---

📚 Step 2: Painting Shapes and Text

You can draw various shapes and text using the Graphics object passed to the paintComponent() method.

📝 Example: Drawing Multiple Shapes and Text

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

public class CustomPaintingExample extends JPanel {

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);

        // Draw a rectangle
        g.setColor(Color.RED);
        g.fillRect(30, 30, 150, 80);

        // Draw an oval
        g.setColor(Color.GREEN);
        g.fillOval(200, 30, 150, 80);

        // Draw a line
        g.setColor(Color.BLACK);
        g.drawLine(30, 150, 380, 150);

        // Draw text
        g.setColor(Color.BLUE);
        g.setFont(new Font("Arial", Font.BOLD, 16));
        g.drawString("Hello, Custom Painting!", 100, 200);
    }

    public static void main(String[] args) {
        JFrame frame = new JFrame("Custom Painting Example");
        CustomPaintingExample customPanel = new CustomPaintingExample();

        frame.add(customPanel);
        frame.setSize(500, 300);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setVisible(true);
    }
}

🎨 Explanation:

1. Shapes: We use g.fillRect(), g.fillOval(), and g.drawLine() to draw a rectangle, an oval, and a line, respectively.
2. Text: We set the text color with g.setColor(Color.BLUE) and specify the font using g.setFont(). We then use g.drawString() to render the text.
3. Adding the Custom Component: Just like in the previous example, the custom component is added to a JFrame to display it.

---

👩‍🎨 Output:

• When you run the code, you'll see a window displaying a red rectangle, a green oval, a black line, and some text "Hello, Custom Painting!" in blue.

---

📚 Step 3: Custom Components with Images

You can also draw images onto your components. This is useful when you want to display images as part of your custom components.

📝 Example: Drawing an Image on a Custom Component

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

public class ImageComponentExample extends JPanel {

    private Image image;

    // Load an image in the constructor
    public ImageComponentExample() {
        try {
            URL imageURL = new URL("https://www.example.com/someimage.png");
            image = Toolkit.getDefaultToolkit().getImage(imageURL);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        if (image != null) {
            g.drawImage(image, 50, 50, this);  // Draw the image at position (50, 50)
        }
    }

    public static void main(String[] args) {
        JFrame frame = new JFrame("Image Component Example");
        ImageComponentExample imageComponent = new ImageComponentExample();

        frame.add(imageComponent);
        frame.setSize(400, 400);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setVisible(true);
    }
}

🎨 Explanation:

1. Loading an Image: We load an image from a URL using Toolkit.getDefaultToolkit().getImage().
2. Drawing the Image: In paintComponent(), we use g.drawImage() to display the image at a specific location on the panel.
3. Error Handling: If the image fails to load, the catch block ensures that any errors are printed to the console.

---

👩‍🎨 Output:

• When you run the code, a window will appear displaying the image loaded from the URL.

---

📚 Step 4: Customizing Components with Graphics2D

For more advanced drawing, you can use Graphics2D, a subclass of Graphics that provides more powerful drawing features, such as gradients, transformations, and advanced shapes.

📝 Example: Using Graphics2D for Advanced Custom Drawing

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

public class Graphics2DExample extends JPanel {

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);

        // Cast Graphics object to Graphics2D
        Graphics2D g2d = (Graphics2D) g;

        // Set anti-aliasing for smoother edges
        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);

        // Draw a gradient-filled ellipse
        GradientPaint gradient = new GradientPaint(50, 50, Color.RED, 200, 100, Color.BLUE);
        g2d.setPaint(gradient);
        g2d.fill(new Ellipse2D.Double(50, 50, 200, 100));

        // Draw a rotated rectangle
        g2d.setColor(Color.BLACK);
        g2d.rotate(Math.toRadians(45), 250, 250);
        g2d.fillRect(200, 200, 100, 50);
    }

    public static void main(String[] args) {
        JFrame frame = new JFrame("Graphics2D Example");
        Graphics2DExample graphicsPanel = new Graphics2DExample();

        frame.add(graphicsPanel);
        frame.setSize(400, 400);
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setVisible(true);
    }
}

🎨 Explanation:

1. Graphics2D: We cast the Graphics object to Graphics2D to access more advanced drawing features.
2. Anti-Aliasing: RenderingHints.KEY_ANTIALIASING is set to improve the smoothness of the graphics.
3. Gradient and Rotation: We draw a gradient-filled ellipse and a rotated rectangle to showcase some of the advanced features of Graphics2D.

---

👩‍🎨 Output:

• When you run the code, a window will appear displaying a gradient-filled ellipse and a rotated rectangle.

---

🎯 Summary

✅ Custom Components: By extending existing components (like JPanel), you can create custom components tailored to your needs.
✅ Painting: Use paintComponent() and Graphics to draw custom shapes, text, and images in your Swing application.
✅ Graphics2D: For advanced drawing features like gradients, rotations, and anti-aliasing, use Graphics2D instead of Graphics.