Android实现LED灯显示效果

Android实现LED灯显示效果

项目地址

EZLedView项目地址

效果图a

原理

广告牌中经常能看到上面这种显示效果，使用LED灯实现文字甚至是图片的显示，那如何在Android中实现这种效果呢？

通常的做法应该是获取字体的点阵信息，然后经过计算在对应的位置绘制圆点，但是这样太麻烦了，于是我使用了一种比较偷懒的做法，原理是这样的：

1.首先将文字转换为Bitmap，既得到一张跟文字显示效果一样的图片;
2.按照一定的间隔点获取该图片中对应的像素点是否有颜色，如果有，则在该点绘制LED灯，否则不绘制。

使用这种方法的一个好处是，即便是图片也可以轻松转换成LED显示。

代码实现

Read the fucking source code!

废话不多说，下面看看如何具体实现代码。

1.首先我们将要显示的文字转换为Bitmap

    private Bitmap renderText(CharSequence text, Paint paint) {
        Bitmap bitmap = Bitmap.createBitmap(mDrawableWidth, mDrawableHeight, Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        int yPos = (int) ((canvas.getHeight() / 2) - ((paint.descent() + paint.ascent()) / 2));
        canvas.drawText(text.toString(),0,yPos,paint);
        return bitmap;
    }

2.根据LED灯的半径和LED的间距，生成一个所有LED灯所在位置的List，这个List存储我们计算好的所有LED灯的位置

   List circlePoint = new ArrayList<>();
   private void measurePoint(int width, int height) {
        int halfBound = ledRadius + ledSpace / 2;
        int x = halfBound;
        int y = halfBound;
        for (; ; ) {
            for (; ; ) {
                circlePoint.add(new Point(x, y));
                y += halfBound * 2;
                if (y > height) {
                    y = halfBound;
                    break;
                }
            }
            x += halfBound * 2;
            if (x > width) {
                break;
            }
        }
    }

3.根据已经生成的文字Bitmap和LED等的位置，生成LED图

    // 获取Bitmap指定位置的颜色，
    // 这个方法比较长，我简化了一下，
    // 详细代码请移步项目地址查看源码
    private int isInRange(Bitmap bitmap, int x, int y) {
        ...
        int color = bitmap.getPixel(x - ledRadius, y);
        ....
        return color;
    }

    // 根据Led等的位置和原始的TextBitmap生成LedBitmap
    private Bitmap generateLedBitmap(Bitmap src) {
        Bitmap bitmap = Bitmap.createBitmap(src.getWidth(), src.getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        for (Point point : circlePoint) {
            // Detect if the px is in range of our led position
            int color = isInRange(src, point.x, point.y);
            if (color != 0) {
                    canvas.drawCircle(point.x, point.y, ledRadius, paint);
            }
        }
        return bitmap;
    }

4.最后我们在onDraw()方法中将这个Bitmap绘制到Canvas中即可，有一点需要注意的是，如果这个Bitmap的尺寸超过 4 * 1024在有的手机上会报OpenGL Texture最大尺寸不能超过4096像素的错误，所以在绘制的时候检查一下Bitmap的尺寸是否超过，如果是，则将这个Bitmap拆分成多个Bitmap进行绘制。

EZLedView项目地址