java - 如何实现椭圆渐变画？

Question

我们知道RadialGradientPaint在 Java 中有一个类，我们可以用它来绘制圆形的渐变画。

但我想要一个椭圆形（椭圆）GradientPaint。如何实现椭圆GradientPaint？

Answer 1

AffineTransform绘制时使用RadialGradientPaint. 这将需要转换的比例实例。它可能最终看起来像这样：

import java.awt.*;
import java.awt.MultipleGradientPaint.CycleMethod;
import java.awt.geom.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.border.EmptyBorder;

public class OvalGradientPaint {

    public static void main(String[] args) {
        Runnable r = new Runnable() {

            @Override
            public void run() {
                // the GUI as seen by the user (without frame)
                JPanel gui = new JPanel(new BorderLayout());
                gui.setBorder(new EmptyBorder(2, 3, 2, 3));

                gui.add(new OvalGradientPaintSurface());
                gui.setBackground(Color.WHITE);

                JFrame f = new JFrame("Oval Gradient Paint");
                f.add(gui);
                f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                // See http://stackoverflow.com/a/7143398/418556 for demo.
                f.setLocationByPlatform(true);

                // ensures the frame is the minimum size it needs to be
                // in order display the components within it
                f.pack();
                // should be done last, to avoid flickering, moving,
                // resizing artifacts.
                f.setVisible(true);
            }
        };
        // Swing GUIs should be created and updated on the EDT
        // http://docs.oracle.com/javase/tutorial/uiswing/concurrency/initial.html
        SwingUtilities.invokeLater(r);
    }
}

class OvalGradientPaintSurface extends JPanel {

    public int yScale = 150;
    public int increment = 1;
    RadialGradientPaint paint;
    AffineTransform moveToOrigin;

    OvalGradientPaintSurface() {
        Point2D center = new Point2D.Float(100, 100);
        float radius = 90;
        float[] dist = {0.05f, .95f};
        Color[] colors = {Color.RED, Color.MAGENTA.darker()};
        paint = new RadialGradientPaint(center, radius, dist, colors,CycleMethod.REFLECT);
        moveToOrigin = AffineTransform.
                getTranslateInstance(-100d, -100d);
        ActionListener listener = new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent ae) {
                if (increment < 0) {
                    increment = (yScale < 50 ? -increment : increment);
                } else {
                    increment = (yScale > 150 ? -increment : increment);
                }
                yScale += increment;
                repaint();
            }
        };

        Timer t = new Timer(15, listener);
        t.start();
    }

    @Override
    public void paintComponent(Graphics g) {
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D)g;
        AffineTransform moveToCenter = AffineTransform.
                getTranslateInstance(getWidth()/2d, getHeight()/2d);
        g2.setPaint(paint);
        double y = yScale/100d;
        double x = 1/y;
        AffineTransform at = AffineTransform.getScaleInstance(x, y);

        // We need to move it to the origin, scale, and move back.
        // Counterintutitively perhaps, we concatentate 'in reverse'.
        moveToCenter.concatenate(at);
        moveToCenter.concatenate(moveToOrigin);
        g2.setTransform(moveToCenter);

        // fudge factor of 3 here, to ensure the scaling of the transform
        // does not leave edges unpainted.
        g2.fillRect(-getWidth(), -getHeight(), getWidth()*3, getHeight()*3);
    }

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

原始图像： 应用程序的原始静态（无聊）“屏幕截图”。

Answer 2

RadialGradientPaint提供了两种将自身绘制为椭圆而不是圆形的方法：

1. 在构造时，您可以指定渐变的变换。例如，如果您提供以下变换：AffineTransform.getScaleInstance(0.5, 1)，您的渐变将是一个直立的椭圆（x 维度将是 y 维度的一半）。

2. 或者，您可以使用需要Rectangle2D提供的构造函数。将创建适当的变换以使渐变椭圆边界与提供的矩形边界匹配。我发现类文档很有帮助： RadialGradientPaint API。特别是，请参阅此构造函数的文档。