创建自定义视图在Android矩阵效果画布教程

介绍 下面是一个快速教程，教你如何在Android中创建自定义视图。自定义视图创建一个矩阵雨效果。 本教程发布在http://www.androidlearner.com/。 背景 下面是关于如何工作的小背景: 自定义视图 View是表示用户界面组件的基本构建块的类。有时候，没有人想使用Android提供的默认小部件，而想要一些花哨的组件。 因此，如何获得自定义组件是构建自己的。但是，我想尝试一下canvas。所以我决定创建矩阵雨的效果。下面是对矩阵效应的简要描述。 矩阵雨的影响 矩阵效应是一个流行的效果，随机字符从顶部落下，创造一个雨的效果。“简介”不是。 让我来解释一下如何设计矩阵雨效应 现在，在开始在canvas中编写视图代码之前，让我解释一下canvas矩阵效果的设计是如何工作的。看看下面的图片 搭建Android Studio 首先，让我们设置Android studio。我不会在这里解释如何安装Android studio。外面已经有很多资源了。 首先，让我们创建一个空活动项目。构建并运行应用程序以检查是否一切正常。 使用的代码 1. 创建一个矩阵效果类，扩展视图: 隐藏,复制Code

public class MatrixEffect extends View {

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

2. 让我们建立一些需要的初始变量: 隐藏,复制Code

int width = 1000000;     //default initial width
int height = 100;        //default initial height
Canvas canvas =null;     //default canvas
Bitmap canvasBitmap;     //Bitmap used to create the canvas
int fontSize = 15;       //font size of the text which will fall
int columnSize = width/fontSize;      //column size ; no of digit required to fill the screen
int parentWidth;
String text = "MATRIXRAIN";           // Text which need to be drawn
char[] textChar = text.toCharArray(); // split the character of the text
int textLength = textChar.length;     //length of the length text
Random rand = new Random();           //random generater

int[]  textPosition;                  // contain the position which will help to draw the text

3.现在让我们创建一个函数来绘制文本在位图上，这是我们的画布: 隐藏,复制Code

void drawText()
{
    //Set up the paint
    Paint paint = new Paint();
    paint.setStyle(Paint.Style.FILL);
    paint.setColor(Color.GREEN);
    paint.setTextSize(15);

    //loop and paint
    for(int i =0 ;i<textposition .length="" at="" bottom="" canvas.drawtext=""
        check="" draw="" fontsize="" has="" i=""
        if="" not="" or="" paint=""
        position="" rand.nextint="" random=""
        reached="" text="" textchar=""
        textlength="" textposition="" the=""> height && Math.random() > 0.975)
            textPosition[i] = 0;   // change text position to zero when 0 when text is at the bottom

        textPosition[i]++; //increment the position array
    }
}

上面的函数负责在画布上以随机的位置从上往下画文本，让它们下落，并检查文本是否到达底部位置。然后将文本位置更改为顶部。 4. 现在用alpha组件在位图上绘制文本: 隐藏,复制Code

public void canvasDraw()
{
    //set the paint for the canvas
    Paint paint = new Paint();
    paint.setColor(Color.BLACK);
    paint.setAlpha(5);
    paint.setStyle(Paint.Style.FILL);
    canvas.drawRect(0, 0, width, height, paint);//draw rect to clear the canvas

    drawText(); // draw the canvas
}

为了得到trail效果，我们将alpha组件添加到位图中，这样当一个位图被绘制到另一个trail效果上时就会出现。 5. 现在主要的绘制函数，将使绘制完成绘制周期，并使其位图可见的视图。我们已经覆盖了View类的Draw()函数。 隐藏,复制Code

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

Paint paint = new Paint();
    paint.setColor(Color.BLACK);

    canvas.drawBitmap(canvasBitmap,0,0,paint); //draw the bitmap to canvas

    canvasDraw(); // call the draw command
    //Redraw the canvas
    invalidate();
}

在这里,invalidate ();函数一次又一次地调用draw。因此，我们的位图会在画布上反复绘制。 6. 问题仍然是如何使视图以不同的大小运行。为此，我使用的解决方案是覆盖视图的onSizeChange方法。 隐藏,复制Code

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    width= w;
    height = h;
    super.onSizeChanged(w, h, oldw, oldh);
    //create a Bitmap
    canvasBitmap =  Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
    canvas = new Canvas(canvasBitmap); //set the canvas
    // init paint with black rectangle
    Paint paint = new Paint();
    paint.setColor(Color.BLACK);
    paint.setAlpha(255); //set the alpha
    paint.setStyle(Paint.Style.FILL);
    canvas.drawRect(0, 0, width, height, paint);

    columnSize = width/fontSize;
    //initalise the textposiotn to zero
    textPosition = new int[columnSize+1]; //add one more drop
    for(int x = 0; x < columnSize; x++)
        textPosition[x] = 1;
}

此方法创建与屏幕大小相同的画布。 7. 现在我们的自定义视图已经准备好了。让我们把它添加到布局中。 打开你的主活动布局文件并添加视图: 隐藏,复制Code< scrap.app.skd.matrixeffect。MatrixEffect android: layout_width = " match_parent " android: layout_height = " match_parent " /比; scrap.app.skd.matrixeffect。矩阵效应是视图的类。 8. 现在运行这个应用程序，在你的手机上看到矩阵雨。 要从github获取完整的画布源代码: https://github.com/sapandang/Android-Custom-View-Matrix-Rain-Effect 的兴趣点 那么，本教程对你有什么帮助呢?最有可能什么都没有。但是，你可以使用canvas来创建一个实时壁纸。: P 本文转载于：http://www.diyabc.com/frontweb/news30384.html