📜  Android 中的 DrawableView

📅  最后修改于: 2022-05-13 01:54:27.863000             🧑  作者: Mango

Android 中的 DrawableView

在本文中,我们将展示 DrawableView 的实现。我们将像在笔记本电脑上一样实现绘画。让我们看看这个功能的实现。下面给出了一个示例视频,以了解我们将在本文中做什么。请注意,我们将使用Java语言来实现这个项目。

可用功能

  • 增加描边宽度
  • 减少描边宽度
  • 更改笔触的颜色
  • 撤消绘画

分步实施

第 1 步:创建一个新项目

要在 Android Studio 中创建新项目,请参阅如何在 Android Studio 中创建/启动新项目。请注意,选择Java作为编程语言。

第二步:添加依赖



导航到Gradle Scripts > build.gradle(Module:app)并在依赖项部分添加以下依赖项。

步骤 3:使用 activity_main.xml 文件

导航到app > res > layout > activity_main.xml并将以下代码添加到该文件中。下面是activity_main.xml文件的代码。

XML


  
    
  
        


Java
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
  
import androidx.appcompat.app.AppCompatActivity;
  
import java.util.Random;
  
import me.panavtec.drawableview.DrawableView;
import me.panavtec.drawableview.DrawableViewConfig;
  
public class MainActivity extends AppCompatActivity {
  
    DrawableView drawableView;
    DrawableViewConfig config;
    Button increase, decrease, color, undo;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // initialise the value
        initiaselayout();
    }
  
    private void initiaselayout() {
          
        // initialise the layout
        drawableView = findViewById(R.id.paintView);
        increase = findViewById(R.id.increase);
        decrease = findViewById(R.id.decrease);
        color = findViewById(R.id.color);
        undo = findViewById(R.id.undo);
        config = new DrawableViewConfig();
          
        // set stroke color as black initially
        config.setStrokeColor(getResources().getColor(android.R.color.black));
  
        // If the view is bigger than canvas, 
        // with this the user will see the bounds (Recommended)
        config.setShowCanvasBounds(true);
  
        // set width as 20
        config.setStrokeWidth(20.0f);
        config.setMinZoom(1.0f);
        config.setMaxZoom(3.0f);
  
        // set canvas height
        config.setCanvasHeight(1080);
  
        // set canvas width
        config.setCanvasWidth(1920);
        drawableView.setConfig(config);
        increase.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // increase the stroke width by 10
                config.setStrokeWidth(config.getStrokeWidth() + 10);
            }
        });
        decrease.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // decrease stroke width by 10
                config.setStrokeWidth(config.getStrokeWidth() - 10);
            }
        });
        color.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // initialise Random
                Random random = new Random();
                // set the color using random
                config.setStrokeColor(Color.rgb(255, random.nextInt(256), random.nextInt(256)));
            }
        });
        undo.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // undo the most recent changes
                drawableView.undo();
            }
        });
    }
}


第 4 步:使用MainActivity。 Java文件

转到主活动。 Java文件,参考如下代码。下面是MainActivity的代码。 Java文件。代码中添加了注释以更详细地理解代码。

Java

import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
  
import androidx.appcompat.app.AppCompatActivity;
  
import java.util.Random;
  
import me.panavtec.drawableview.DrawableView;
import me.panavtec.drawableview.DrawableViewConfig;
  
public class MainActivity extends AppCompatActivity {
  
    DrawableView drawableView;
    DrawableViewConfig config;
    Button increase, decrease, color, undo;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
          
        // initialise the value
        initiaselayout();
    }
  
    private void initiaselayout() {
          
        // initialise the layout
        drawableView = findViewById(R.id.paintView);
        increase = findViewById(R.id.increase);
        decrease = findViewById(R.id.decrease);
        color = findViewById(R.id.color);
        undo = findViewById(R.id.undo);
        config = new DrawableViewConfig();
          
        // set stroke color as black initially
        config.setStrokeColor(getResources().getColor(android.R.color.black));
  
        // If the view is bigger than canvas, 
        // with this the user will see the bounds (Recommended)
        config.setShowCanvasBounds(true);
  
        // set width as 20
        config.setStrokeWidth(20.0f);
        config.setMinZoom(1.0f);
        config.setMaxZoom(3.0f);
  
        // set canvas height
        config.setCanvasHeight(1080);
  
        // set canvas width
        config.setCanvasWidth(1920);
        drawableView.setConfig(config);
        increase.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // increase the stroke width by 10
                config.setStrokeWidth(config.getStrokeWidth() + 10);
            }
        });
        decrease.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // decrease stroke width by 10
                config.setStrokeWidth(config.getStrokeWidth() - 10);
            }
        });
        color.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // initialise Random
                Random random = new Random();
                // set the color using random
                config.setStrokeColor(Color.rgb(255, random.nextInt(256), random.nextInt(256)));
            }
        });
        undo.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // undo the most recent changes
                drawableView.undo();
            }
        });
    }
}

输出: