课程：图形入门

原文： https://docs.oracle.com/javase/tutorial/2d/basic2d/index.html

Java 2D API 功能强大且复杂。但是，Java 2D API 的绝大多数用途都使用了java.awt.Graphics类中封装的一小部分功能。本课程涵盖了应用程序开发人员的最常见需求。稍后将在 Java 2D API 的高级主题中描述不太常见的需求。

Graphics 类的大多数方法可分为两个基本组：

  • 绘制和填充方法，使您能够渲染基本形状，文本和图像
  • 属性设置方法，它们会影响绘图和填充的显示方式

诸如setFont和setColor之类的方法定义了绘制和填充方法的呈现方式。

该图说明了这些方法如何与图形对象相关：

This figure represents basic methods of the Graphics class

绘图方法包括：

  • drawString - 用于绘图文本

    1. g.drawString("Hello", 10, 10);

  • drawImage - 用于绘制图像

    1. g.drawImage(img, 
    2.             0, 0, width, height,
    3.             0, 0, imageWidth, imageHeight,
    4.             null);

  • drawLine，drawArc，drawRect，drawOval，drawPolygon - 用于绘制几何形状

    1. g2.draw(new Line2D.Double(0, 0, 30, 40));

根据您当前的需要，您可以根据以下条件从Graphics类中选择以下几种方法之一：

  • 是否要以指定位置以原始大小渲染图像，或者将其缩放以适合给定矩形
  • 您是喜欢用颜色填充图像的透明区域还是保持透明

填充方法适用于几何形状，包括fillArc，fillRect，fillOval，fillPolygon。

无论您是绘制一行文本还是图像，请记住在 2D 图形中，每个点都由其 x 和 y 坐标确定。所有绘制和填充方法都需要此信息，以确定文本或图像的呈现位置。

例如，要绘制一条线，应用程序将调用以下内容：

java.awt.Graphics.drawLine(int x1, int y1, int x2, int y2)

在此代码中（x1，y1）是该行的起点，（x2，y2）是该行的终点。

所以绘制水平线的代码如下：

Graphics.drawLine(20, 100, 120, 100);

下面的演示累积了所有提到的技术。移动滑块以显示各种天气类型。

<applet alt=”WeatherWizard example” archive=”examples/lib/2d_basic2d.jar” code=”WeatherWizard” height=”250” width=”400”><param name=”permissions” value=”sandbox”></applet>

Note: If you don’t see the applet running, you need to install at least the Java SE Development Kit (JDK) 7 release.

WeatherWizard演示使用JSlider组件以及各种图形功能来生成和显示指定的天气类型。有关JSlider类的更多信息，请参阅 Swing 教程的如何使用滑块部分。

WeatherPainter类的paint方法实现图形功能。以下代码绘制使用setupWeatherReport()方法确定的图像。

  1. ...
  2. origComposite = g2.getComposite();
  3. if (alpha0 != null) g2.setComposite(alpha0);
  4. g2.drawImage(img0,
  5.              0, 0, size.width, size.height,
  6.              0, 0, img0.getWidth(null),
  7.              img0.getHeight(null), null);
  8. if (img1 != null) {
  9.     if (alpha1 != null) g2.setComposite(alpha1);
  10.     g2.drawImage(img1,
  11.                  0, 0, size.width, size.height,
  12.                  0, 0, img1.getWidth(null),
  13.                  img1.getHeight(null), null);
  14. } 
  15. ...

setFont和drawString方法可以显示温度和天气状况。

  1. ...
  2. // Freezing, Cold, Cool, Warm, Hot,
  3. // Blue, Green, Yellow, Orange, Red
  4. Font font = new Font("Serif", Font.PLAIN, 36);
  5. g.setFont(font);
  7. String tempString = feels + " " + temperature+"F";
  8. FontRenderContext frc =
  9.            ((Graphics2D)g).getFontRenderContext();
  10. ...
  11. g.setColor(textColor);
  12. int xTextTemp = rX-(int)boundsTemp.getX();
  13. int yTextTemp = rY-(int)boundsTemp.getY();
  14. g.drawString(tempString, xTextTemp, yTextTemp);
  16. int xTextCond = rX-(int)boundsCond.getX();
  17. int yTextCond = rY-(int)boundsCond.getY()
  18.                    + (int)boundsTemp.getHeight();
  19. g.drawString(condStr, xTextCond, yTextCond);

fillRect方法允许您绘制填充指定颜色的矩形。

  1. ...
  2. Rectangle2D boundsTemp 
  3.           = font.getStringBounds(tempString, frc);
  4. Rectangle2D boundsCond 
  5.           = font.getStringBounds(condStr, frc);
  6. int wText = Math.max((int)boundsTemp.getWidth(),
  7.             (int)boundsCond.getWidth());
  8. int hText = (int)boundsTemp.getHeight()
  9.             + (int)boundsCond.getHeight();
  10. int rX = (size.width-wText)/2;
  11. int rY = (size.height-hText)/2;
  13. g.setColor(Color.LIGHT_GRAY);
  14. g2.fillRect(rX, rY, wText, hText);
  15. ...

尝试修改WeatherWizard演示以更改图形内容。例如，使用fillRoundRect方法代替fillRect或在setFont方法中应用其他字体大小。在 WeatherWizard.java 文件中找到此 applet 的完整代码。该演示还需要以下图像： weather-cloud.png ， weather-rain.png ， weather-snow.png 和 weather-sun.png 位于images目录。