Writing a simple artboard in the Java language

Speaking of three overviews of the concept of the blog, today, we come to a little practical things. Let's explore How to write a simple drawing board in the java language.

First, demand analysis

No matter what language we use to write a project, our first step is always to analyze what the project needs to meet.

So what is the need for an artboard to meet? In other words, what function should we give it on the artboard? From our familiar drawing board, we need to implement functions such as pencils, erasers, airbrush, brushes, we can draw some rules of the graph, such as straight lines, rectangles, circles. It's best to adjust the color and thickness of the brush. Above, we hope that when we click on a button, we can achieve the corresponding function. The function of a simple artboard is probably that much, and some things about adding text boxes, magnifying glasses, etc. are not implemented on a simple artboard.

Second, the realization of the artboard

1. Drawing of basic graphics

Let's start with some basic drawings of the basics. There is a brush class graphics in Java, and the key to our ability to implement artboards is here. In the graphics of this brush class, there are several methods, such as: Draw Rectangle, circle, straight line. Knowing this, our thinking is coming. Next, we will take a step-by-step understanding of the entire process of achieving basic graphical drawing.

First, we need to instantiate a JFrame container and set the initial value for it. Secondly, we need to add some buttons on this container. Here is an example of a line, a rectangle, a circle. This part of the implementation is relatively simple, it should be noted that we can instantiate a string type of an array to store the contents of the button, and then by iterating through the array to achieve the establishment of multiple buttons, so as to reduce the number of lines of code. Give the following code:

Secondly, we need to use the event monitoring mechanism, MouseListener and ActionListener, because it involves the operation of mouse clicks and button clicks. Because they are both interfaces and cannot be instantiated, we need to create an event handler class to implement both interfaces and override the abstract methods. The specific code is as follows:

Of course, this alone is not enough. First, we need to add an event-handling mechanism to the event source, which is our button and artboard interface, by Addxxxlistener. Secondly, we also need to write the function we need to implement in the method body of the corresponding method. The brush class is an abstract class, so it cannot be instantiated, and we can only get brushes from JFrame or JPanel by getgraphics this method. Note that the brush is obtained after the interface is visible. After that, because we are going to use a paintbrush in the event handler class, we also need to pass the brush from our artboard interface to our event handler class, we can define a Setgraphics method in the event handler class, and define a graphics reference to receive the brush. The specific code is as follows:

The next step is to invoke the method in the brush. For example, when the content of the button we get is line, then we need to call the DrawLine method in the Paintbrush graphics, we need to give it the X, Y coordinates of the starting and ending points. So, in the Mousepressed method, we record the x, y coordinates of the starting point, record the XY coordinates of the release point in the mousereleased, and call the DrawLine method. Then we can connect to a straight line where we press and release. The code is implemented as follows:

This allows us to draw three basic graphs. Other, in the graphics brush class also has about arcs, polygons, fills the rectangle and so on the drawing method, here does not enumerate.

2, brush color and thickness of the change

There is a color class in Java that can be used as a setting for brush colors. In addition to the fixed color selection, such as color.black, we programmers can also adjust their own color. We know that each color, can be from the red, green, blue three colors by different degrees of deployment. In Java, there is a method of constructing color, passing in three int, the number range from 0 to 255, which corresponds to the degree of three colors of red, green and blue respectively. We can define the color we want by the color name =new color (int a,int b,int c). After that, we can assign our new color to our brushes by means of. SetColor.

As for the method of setting the brush thickness, it is not inside the graphics class, but in its subclass graphics2d. It is also an abstract class compared to graphics,graphics2d, but there are many new methods in it, such as the way to set the thickness of the brush setstroke. In Setstroke this method, the parameter you need to pass is a stroke type parameter, and the stroke is an interface, so we can not instantiate it, so we pass it a wrapper class Basicstroke for the stroke, It implements the stroke of this interface. Therefore, we set the weight in the following way: (graphics2d) G.setstroke (new Basicstroke (float width)).

If we need to achieve such a situation, in the artboard interface there are red, green, blue and other colors of the button, when the brush turned into the corresponding color, we can give the button to set the color of the way to deal with such problems. The way to set colors for a button or form is. SetBackground (color c).

3. The realization of pencil, brush, eraser and spray gun

Now, we know how to draw a circle and draw a straight line. In realizing the function of pencil and other money, I want to ask a question first, how to draw a point? I have two ideas, one is that you can draw a dot by drawing a solid circle and give it a radius specified as a pixel, then the painted solid circle becomes a point. Second, you can draw a line, specify the starting position and release position is the same, then the draw is a point.

Next, we will talk about how to implement the function of the pencil. Here we need to introduce a new method of event monitoring, Mousemotionlistener. In this interface, there is a mouse to drag the monitoring method. We can use it to implement the pencil. Its working mechanism is to get the position of your mouse once every once in a while. Of course, this time is very short. In fact, we can observe the straight line on the drawing board. We will find that each irregular curve is constructed from a number of lines. So, in this drag process, we can record its XY coordinates at the beginning, and then each time we run the drag to change the XY coordinates of the beginning, then we implement the so-called pencil drawing function. Since our event handler class also inherits MouseListener, at the beginning of the drag process, we have actually done a single click, so we don't need to record the initial coordinates. Note that because it is a different listening method, it is important to remember to add a Mousemotionlistener listener to the artboard interface. The specific code of the Pencil is implemented as follows:

Realize the pencil, the brush is actually the case, we just have to copy the pencil implementation of this part of the code, and before adding a line to the brush bold code, bold pencil, is not our brush it? As for the eraser, we can also understand that, as long as we find a color similar to the artboard interface background, to the color of the brush, can not cover the original part of it?

The next step is the implementation of the airbrush. We can understand the airbrush, on the basis of the pencil (remove the trajectory of the pencil), for a point, within a certain range, randomly draw a number of points. Similar transformations, we can add the xy coordinates of a point to a range of unequal values, the effect is similar to the airbrush effect. The method of generating the random number is in the class of random, so we first need to instantiate a random class and then go through nextint (int a) to get a 0 to A-1. That way, we'll be able to implement the airbrush. The specific code is as follows:

4. Redraw

In this experiment, it is easy to find a problem, when we minimize or adjust the size of the form, the graphics we draw disappear, but the button is still there. What is this for? In fact, whenever we minimize or resize a form, our original form is closed, and the computer redraws a new form. So, we're not drawing any of our own graphics. So, why are our buttons still there? In fact, more than just buttons, the other elements in the swing package that we are familiar with, such as Account entry boxes, password entry boxes, and so on, are still there. In fact, every element, every form, has a redraw method. When the form changes size, when a new form is generated, the computer calls the redraw method, so you see that the buttons and other elements are still on the interface after changing the interface. So how do we make our own drawings like buttons that don't disappear as you change the form?

In fact, we just need to rewrite the redraw method on the drawing interface. That's why I have to inherit the JFrame class. Because we inherited the jframe, we can rewrite the paint method that it inherits, add the content we draw, and the content we draw is redrawn when the form is redrawn.

This is just the first step in redrawing. Because the content we draw can be too complex, how do we know what we are drawing in the main class? We can define a shape class and then define an array of shape types in the event handler class, each drawing a graph, then we'll use an array to store it, and then let index++. To simplify the content in the paint method, we can define a shape abstract class, which defines an abstract method draw, then declares the different graphs, allows them to inherit the shape class, and overrides the draw method. In this way, in the paint method, we can call the draw method directly instead of writing the various judgment statements. This simplifies our code.

The code is specifically implemented as follows:

Here only the definition of the class of Shapeline is given, and the definition of other types of patterns is not given, allowing spectators to scatter themselves.

5, to beautify the interface

Assuming we put all the buttons together, we'll find that the drawing interface is pretty ugly. To enhance the aesthetics of the interface, we can introduce the Panel method. We can put the basic graphic button in a panel, the color button is placed in a panel, and the Pencil and other functions are placed in a panel. At the same time, in order to distinguish between each interface, we can also in the redraw method, write such a statement g.drawline to add a border to the interface.

Completing the program with the desired functionality is only the first step. What we need to do then is to try to make our interface look beautiful, and some of the code that can be scaled down as much as possible, so that our code looks more streamlined.

Iii. Summary

An artboard, saying simple is simple, said complex is complex. In the future we will certainly be more complex procedures, we need to be more rigorous, it is best to add some comments (of course, I personally write code is not like to write comments, may also be because of the reason for writing less). The Board of the comparison is rough, you are welcome to correct the big God.

Writing a simple artboard in the Java language