利用Canvas实现绘图功能（绘制五角星）

要求

利用Canvas编程实现在屏幕上随机位置绘制10个随机大小（边长为20-100dp）的五角星。

过程

一、绘制五角星

首先要解决的问题就是绘制五角星，有了五角星 才能谈其他的，绘制五角星有很多种办法，可以利用圆，可以用线段旋转等等。这里用简单的方式即用canvas实现线段的绘制，并通过线段的选转来实现五角星的绘制，话不多说 上代码：

canvas.drawLine(1, 5,7, 5, paint);
canvas.translate(1, 5);
canvas.rotate(36);
canvas.drawLine(0, 0, 6 , 0, paint);
canvas.translate(6 , 0);
canvas.rotate(36);
canvas.drawLine(0, 0, -6 , 0, paint);
canvas.translate(-6 , 0);
canvas.rotate(36);
canvas.drawLine(0, 0, 6 , 0, paint);
canvas.translate(6 , 0);
canvas.rotate(36);
canvas.drawLine(0, 0, -6 , 0, paint);

这样就可以绘制成一个五角星了。然而，这个五角星是固定长度，固定位置的。

二、生成随机数

其次，要实现两个随机 。随机位置、随即大小。这个时候 就可以用ramdom来实现随机数的生成，从而改变五角星的大小和位置。生成随机数一般如下：

int x = new Random().nextInt(100);

但是，题目中有要求，五角星大小为20-100dp(懵懵懂懂的我就认为，生成的随机数为20-100)代码如下：

int min=20;
int max=100;
Random random = new Random();
int x = random.nextInt(max)%(max-min+1) + min;

三、利用循环，生成10个五角星

当解决了以上两个问题之后，接下来要做的就是实现10个五角星的生成，这一步也是最简单的一步，可以直接利用for循环，while循环，或者do……while循环来实现，这里用的for循环：

for(int i =0;i<10;i++){循环体……}

四、完整代码

activity_main.xml，这里要注意组件的应用

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">

        <com.example.myexperiment5515.CanvasView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
</LinearLayout>

MainActivity.java

package com.example.myexperiment5515;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

CanvasView.java实现五角星绘制的主要代码在里面

package com.example.myexperiment5515;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.view.View;

import java.util.Random;

import static java.lang.Math.sin;

public class CanvasView extends View {

    public CanvasView(Context context, AttributeSet attrs) {
        super(context);
    }

    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        for(int i =0;i<10;i++){
            int min=20;
            int max=100;
            Random random = new Random();
            int x = random.nextInt(max)%(max-min+1) + min;

            Paint paint = new Paint();//定义一个画笔对象
            paint.setAntiAlias(true);//设置抗锯齿
            paint.setStyle(Paint.Style.STROKE);//设置画笔风格
            paint.setStrokeWidth(5);//设置画笔粗细
            paint.setColor(Color.GREEN);//设置颜色
            paint.setTextSize(40);//设置文字显示大小
            //绘制五角星
            canvas.drawLine(2 * x, 5 * x, 8 * x, 5 * x, paint);
            canvas.translate(2 * x, 5 * x);
            canvas.rotate(36);
            canvas.drawLine(0, 0, 6 * x, 0, paint);
            canvas.translate(6 * x, 0);
            canvas.rotate(36);
            canvas.drawLine(0, 0, -6 * x, 0, paint);
            canvas.translate(-6 * x, 0);
            canvas.rotate(36);
            canvas.drawLine(0, 0, 6 * x, 0, paint);
            canvas.translate(6 * x, 0);
            canvas.rotate(36);
            canvas.drawLine(0, 0, -6 * x, 0, paint);
        }
    }
}

存在的问题

这样做完以后，五角星出来了，也随机生成了。但是，生成的五角星不一定在屏幕内 如下图：

在这里，小白跪求路过的大佬直到一下，如何能让它不往屏幕外边跑；