Android 中的 DrawableView
在本文中,我们将展示 DrawableView 的实现。我们将像在笔记本电脑上一样实现绘画。让我们看看这个功能的实现。下面给出了一个示例视频,以了解我们将在本文中做什么。请注意,我们将使用Java语言来实现这个项目。
可用功能
- 增加描边宽度
- 减少描边宽度
- 更改笔触的颜色
- 撤消绘画
分步实施
第 1 步:创建一个新项目
要在 Android Studio 中创建新项目,请参阅如何在 Android Studio 中创建/启动新项目。请注意,选择Java作为编程语言。
第二步:添加依赖
导航到Gradle Scripts > build.gradle(Module:app)并在依赖项部分添加以下依赖项。
compile ‘me.panavtec:drawableview:0.6.0’
步骤 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();
}
});
}
}
输出: