Android自定义View实现数字雨效果的全过程

目录
  • 效果图
  • 实现步骤
  • 总结

效果图

在安卓中多种类型的动画,有帧动画、补间动画、属性动画,除此之外,使用自定义的view结合数学公式,就可以绘制出复杂的界面或者动画。这篇文章记录的是仿照黑客帝国的数字雨,来看看效果吧。

实现步骤

准备工作,常量的配置信息

    // 文字的颜色值
    final int default_text_color = color.argb(255, 0, 255, 70);
    // 文字大小
    final int text_size = 24;
    // 普通画笔
    paint mpaint;
    // 高亮画笔
    paint mpaintlight;
    // 改变文字的间隔时间
    int switchinternal = interval[random.nextint(interval.length)];
    // 数字落下的速度
    int speed;

构建显示文本的内容,因为计算机都是由0和1组成,所以这里用0和1代表它的内容数据。

// 构建0和1的字符串
if (contentarray == null) {
    contentarray = new string[2];
    contentarray[0] = "0";
    contentarray[1] = "1";
} 

由于是随机显示,所以使用随机数获取内容

private string getchar() {
            return contentarray[random.nextint(2)];
        }

由于是自定义view,所以入口就在自定义view的构造函数中。

public numberview(context context, attributeset attrs, int defstyleattr) {
        super(context, attrs, defstyleattr);
        init();
    }

在init方法中对上面的配置信息进行初始化,比如创建具体的画笔颜色,文字大小等

private void init() {
        mpaint = new paint(paint.anti_alias_flag);
        mpaint.setargb(255, 0, 255, 70);
        mpaint.settextsize(text_size);
        a = textcolor >> 24 & 0xff;
        r = textcolor >> 16 & 0xff;
        g = textcolor >> 8 & 0xff;
        b = textcolor & 0xff;
        mpaint.setargb(a, r, g, b);

        mpaintlight = new paint(paint.anti_alias_flag);
        mpaintlight.setargb(255, 140, 255, 170);
        mpaintlight.settextsize(text_size);
    }

在onmeasure方法中测量view的大小,view本身大小多少,这由onmeasure()决定的。

@override
    protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
        super.onmeasure(widthmeasurespec, heightmeasurespec);
        int widthsize = measurespec.getsize(widthmeasurespec);
        int widthmode = measurespec.getmode(widthmeasurespec);
        int heightsize = measurespec.getsize(heightmeasurespec);
        int heightmode = measurespec.getmode(heightmeasurespec);
        if (widthmode == measurespec.exactly) {
            mwidth = widthsize;
        }
        if (heightmode == measurespec.exactly) {
            mheight = heightsize;
        }
        setmeasureddimension((int) mwidth, (int) mheight);
  }

ondraw()定义了如何绘制这个view,所以在ondraw方法中,必须要进行绘制操作,这样才能显示出来动画。

@override
    protected void ondraw(canvas canvas) {
        super.ondraw(canvas);
        render(canvas);
        rain();
    }
    
private void rain() {
    for (int j = 0; j < streams.length; j++) {
        symbol[] symbols = (symbol[]) streams[j];
        for (int i = 0; i < symbols.length; i++) {
            symbol symbol = symbols[i];
            symbol.y = symbol.y >= mheight ? 0 : symbol.y + symbol.speed;
        }
    }
}

无论是怎样的操作,自定义view总是离不开onmeasure onlayout ondraw的核心方法。比如我们要绘制一幅画,也需要这样设计,它的大小、位置、和绘制成什么样。就像这些代码的方法。 onmeasure:决定视图的大小 onlayout:决定视图的位置 ondraw:绝对如何画视图 本文章心血来潮想到了黑客帝国的动画,就在github上参考了这个项目,参考的代码在传送门,致敬。

总结

到此这篇关于android自定义view实现数字雨效果的文章就介绍到这了,更多相关android自定义view实现数字雨内容请搜索www.887551.com以前的文章或继续浏览下面的相关文章希望大家以后多多支持www.887551.com!

(0)
上一篇 2022年3月23日
下一篇 2022年3月23日

相关推荐