A little more about 2D graphics for Android

Hello, readers Habra!

Not so long ago, I began to learn programming for Android and some time ago I ran into a problem that I want to share with anyone who has not started yet, but plans to devote himself to developing applications for this platform.

Some theory

1) Usually, when searching for the basics of 2D graphics for Android, you will find examples of the expansion of the View class. In this case, we, in fact, draw a static picture, or display an existing one.

2) Drawing is done using the Canvas class. If we turn to the analogy, then this is your canvas, on which you, as if an artist inspired by the muse, create your masterpieces. We will not create masterpieces in this topic, but we will try to designate the basics of interaction.
')
3) The image is displayed on the screen by adding an object of the created class to the screen.

Let me remind you that the basics of graphics in Android have already been discussed . Let's add a little to the existing article.

Problem

Passionately doing various interesting and not very assignments, I was faced with a task that put me in a dead end. Its essence was that it was necessary to bring our "masterpieces" directly to the already created area, change the pictures at the touch of a button, and other things that were quite trivial at first glance.

With a sigh of joy, I rushed to study manuals and did not find anything that would help me in this matter, because basically all the links were filled with the output of the class that expands View, rather than adding it to the existing area.

Now that we have defined the problem, let's proceed to its solution.

The solution of the problem

In order to illustrate the work, we formulate the task. Let the triangle be displayed on every press of the button.

So, for the beginning we are importing the necessary packages, although many, for sure, import them directly as needed:

import java.util.Random; import android.app.Activity; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.os.Bundle; import android.view.View; import android.view.ViewGroup.LayoutParams; 

Sumptuously. Now we need to create a button that we will click on. Go to /res/layout/activity_main.xml and append the necessary data. For example:

 <Button android:id="@+id/Button1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignLeft="@+id/TextView1" android:layout_below="@+id/TextView1" android:layout_marginTop="35dp" android:onClick="onClick" android:text="@string/click" /> 

Here TextView1 is a standard one, left over from the default project. Now, when you click on the button, the onClick method will be called, which will have to display a new triangle on the screen.

Having searched the web for some time, I could not find examples when a class that extends View would draw on an already existing layout, therefore, having broken my head, I decided to slightly rework an existing task.

To begin with, we will create a second class, naming it, for example, DrawTriangles, a constructor and an onDraw method, where, in fact, we will draw.

 import android.content.Context; import android.graphics.Canvas; import android.view.View; public class DrawTriangles extends View { public DrawTriangles(Context context) { super(context); } @Override public void onDraw(Canvas c) { super.onDraw(c); } } 

Now let's think about drawing a triangle. The task is rather trivial and does not require much stress. Add six coordinates and draw lines connecting them together.

 float x = 350; float y = 250; float x1 = 950; float y1 = 250; float x2 = 950; float y2 = 1050; paint.setColor(Color.BLUE); c.drawLine(x, y, x1, y1, paint); c.drawLine(x1, y1, x2, y2, paint); c.drawLine(x2, y2, x, y, paint); 

All preparations are ready, you can wield with the main class.

Add the onClick method:

 public void onClick(View v){ } 

Now we need to add a drawn triangle to the screen. Obviously, for this you need an object of class DrawTriangles

 DrawTriangles d = new DrawTriangles(this); 

Now you need to add the item to the screen. We know the setContentView method, but it does not add elements, but replaces everything else with them, therefore it does not suit us. Thinking, I came to the conclusion that, for sure, there is a method addContentView. And, oh really, such a method exists. Let's look at it:

 public void addContentView (View view, ViewGroup.LayoutParams params) 

The first element is what we will add, and the second is its display parameters. We need to derive a triangle, therefore we will not be particularly distorted:

 addContentView(d,new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT)); 

Sumptuously. Now it remains only to start the application and admire what happened.

results

And after pressing the button (I have another triangle displayed! In this topic, the construction of a right-angled triangle is described):



I hope that this will help someone who, like me, will look for the necessary material, but will not waste time on such manipulations. Success!