Documentation

The Java™ Tutorials
Trail: 2D Graphics

Lesson: Getting Started with Graphics课程:图形入门

The Java 2D API is powerful and complex. However, the vast majority of uses for the Java 2D API utilize a small subset of its capabilities encapsulated in the java.awt.Graphics class.Java2D API功能强大且复杂。然而,Java 2D API的绝大多数用途都利用了封装在java.awt.Graphics类中的一小部分功能。This lesson covers the most common needs of applications developers.本课程涵盖了应用程序开发人员最常见的需求。Less common needs are described later in the Advanced topics in the Java 2D API.不太常见的需求将在Java 2D API的高级主题中描述。

Most methods of the Graphics class can be divided into two basic groups:Graphics类的大多数方法可分为两个基本组:

Methods such as setFont and setColor define how draw and fill methods render.setFontsetColor等方法定义绘制和填充方法的渲染方式。

This figure illustrates how these methods relate to graphic objects:此图说明了这些方法与图形对象的关系:

This figure represents basic methods of the Graphics class

Drawing methods include:绘图方法包括:

Depending on your current need, you can choose one of several methods in the Graphics class based on the following criteria:根据您当前的需要,您可以根据以下条件在Graphics类中选择几种方法之一:

Fill methods apply to geometric shapes and include fillArc, fillRect, fillOval, fillPolygon.填充方法适用于几何形状,包括fillArcfillRectfillOvalfillPolygon

Whether you draw a line of text or an image, remember that in 2D graphics every point is determined by its x and y coordinates.无论是绘制文字线还是图像,请记住,在二维图形中,每个点都由其x和y坐标确定。All of the draw and fill methods need this information which determines where the text or image should be rendered.所有的绘制和填充方法都需要这些信息,这些信息决定了文本或图像的渲染位置。

For example, to draw a line, an application calls the following:例如,要画一条线,应用程序调用以下命令:

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

In this code (x1, y1) is the start point of the line, and (x2, y2) is the end point of the line.在此代码中,(x1, y1)是线的起点,(x2, y2)是线的终点。

So the code to draw a horizontal line is as follows:因此,绘制水平线的代码如下所示:

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

The demo below accumulates all mentioned techniques.下面的演示总结了所有提到的技术。Move the slider to display various weather types.移动滑块以显示各种不同的天气类型。


Note:注意:  If you don't see the applet running, you need to install at least the Java SE Development Kit (JDK) 7 release.如果您没有看到小程序正在运行,则至少需要安装JavaSE开发工具包(JDK)7版本。

The WeatherWizard demo uses the JSlider component as well as various graphics capabilities to generate and display a specified weather type.WeatherWizard演示使用JSlider组件以及各种图形功能来生成和显示指定的天气类型。 For more information about the JSlider class see the How to Use Sliders section of the Swing Tutorial.有关JSlider类的更多信息,请参阅Swing教程的“如何使用Slider”部分。

The paint method of the WeatherPainter class implements graphics features.WeatherPainter类的paint方法实现图形功能。The following code draws an image determined by using the setupWeatherReport() method.下面的代码绘制一个使用setupWeatherReport()方法确定的图像。

...
origComposite = g2.getComposite();
if (alpha0 != null) g2.setComposite(alpha0);
g2.drawImage(img0,
             0, 0, size.width, size.height,
             0, 0, img0.getWidth(null),
             img0.getHeight(null), null);
if (img1 != null) {
    if (alpha1 != null) g2.setComposite(alpha1);
    g2.drawImage(img1,
                 0, 0, size.width, size.height,
                 0, 0, img1.getWidth(null),
                 img1.getHeight(null), null);
} 
...

The setFont and drawString methods render the temperature and the weather condition.setFont方法和drawString方法渲染温度和天气条件。

...
// Freezing, Cold, Cool, Warm, Hot,
// Blue, Green, Yellow, Orange, Red
Font font = new Font("Serif", Font.PLAIN, 36);
g.setFont(font);
        
String tempString = feels + " " + temperature+"F";
FontRenderContext frc =
           ((Graphics2D)g).getFontRenderContext();
...
g.setColor(textColor);
int xTextTemp = rX-(int)boundsTemp.getX();
int yTextTemp = rY-(int)boundsTemp.getY();
g.drawString(tempString, xTextTemp, yTextTemp);
        
int xTextCond = rX-(int)boundsCond.getX();
int yTextCond = rY-(int)boundsCond.getY()
                   + (int)boundsTemp.getHeight();
g.drawString(condStr, xTextCond, yTextCond);

The fillRect method allows you to draw a rectangle filled with the specified color.fillRect方法允许您绘制用指定颜色填充的矩形。

...
Rectangle2D boundsTemp 
          = font.getStringBounds(tempString, frc);
Rectangle2D boundsCond 
          = font.getStringBounds(condStr, frc);
int wText = Math.max((int)boundsTemp.getWidth(),
            (int)boundsCond.getWidth());
int hText = (int)boundsTemp.getHeight()
            + (int)boundsCond.getHeight();
int rX = (size.width-wText)/2;
int rY = (size.height-hText)/2;
        
g.setColor(Color.LIGHT_GRAY);
g2.fillRect(rX, rY, wText, hText);
...

Try to modify the WeatherWizard demo to alter the graphical content.尝试修改WeatherWizard演示以更改图形内容。For example, use the fillRoundRect method instead of fillRect or apply another font size in the setFont method.例如,使用fillRoundRect方法代替fillRect,或者在setFont方法中应用另一种字体大小。Find the complete code for this applet in the WeatherWizard.java file.WeatherWizard.java文件中找到此小程序的完整代码。The demo also requires the following images: weather-cloud.png, weather-rain.png, weather-snow.png, and weather-sun.png located in the images directory.演示还需要以下图像:位于images目录中的weather-cloud.pngweather-rain.pngweather-snow.pngweather-sun.png


Previous page: Previous Lesson
Next page: Working with Geometry