在Android中发光的TextView

在Android中显示文本是最常见的UI元素之一。虽然文本内容和字体样式都可以自由地设置，但如果想要使文本看起来更加吸引人，可以考虑在文本周围添加光晕效果。本文将介绍如何在Android中创建一个发光的TextView。

基本步骤

1. 定义一个自定义ViewGroup，并将TextView放入其中。
2. 在绘制文本之前，使用Paint创建一个光晕效果。
3. 使用Paint将光晕效果应用到文本周围。
4. 在 Paint 应用光晕效果后绘制文本内容。

下面是一个简单的示例代码，演示如何将以上步骤组合在一起实现发光的TextView：

<com.example.glowtextview.GlowTextView
    android:id="@+id/glow_text_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Glowing TextView"
    android:textColor="@color/colorPrimaryDark"
    android:textSize="24sp" />

public class GlowTextView extends RelativeLayout {

    private TextView mTextView;
    private Paint mGlowPaint;

    public GlowTextView(Context context) {
        super(context);
        init(context, null, 0);
    }

    public GlowTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);
    }

    public GlowTextView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init(context, attrs, defStyle);
    }

    private void init(Context context, AttributeSet attrs, int defStyle) {
        LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        params.addRule(CENTER_IN_PARENT);

        mTextView = new TextView(context, attrs, defStyle);
        mTextView.setLayoutParams(params);
        mTextView.setGravity(Gravity.CENTER);

        addView(mTextView);

        // Create paint with outer glow
        mGlowPaint = new Paint();
        mGlowPaint.setAntiAlias(true);
        mGlowPaint.setColor(Color.GREEN);
        mGlowPaint.setStyle(Paint.Style.STROKE);
        mGlowPaint.setStrokeWidth(10f);
        mGlowPaint.setMaskFilter(new BlurMaskFilter(10f, BlurMaskFilter.Blur.OUTER));
    }

    @Override
    protected void onDraw(Canvas canvas) {
        String text = mTextView.getText().toString();
        Rect bounds = new Rect();
        mTextView.getPaint().getTextBounds(text, 0, text.length(), bounds);

        // Apply glow effect to text
        canvas.drawText(text,
                (getWidth() - bounds.width()) / 2.0f,
                (getHeight() - bounds.height()) / 2.0f,
                mGlowPaint);

        // Draw text over the glow
        super.onDraw(canvas);
    }

    public void setText(CharSequence text) {
        mTextView.setText(text);
        invalidate();
    }
}

代码解析

以上代码定义了一个自定义的RelativeLayout，其中包含一个TextView作为子元素。其中，init() 方法用于初始化 GLOW Paint，并在 onDraw() 方法中将它应用到文字周围。setText() 方法用于更新文本内容。

在 init() 方法中，我们创建了一个具有 outer glow 的 Paint 对象，其中主要方法如下：

// Create paint with outer glow
mGlowPaint = new Paint();
mGlowPaint.setAntiAlias(true);
mGlowPaint.setColor(Color.GREEN);
mGlowPaint.setStyle(Paint.Style.STROKE);
mGlowPaint.setStrokeWidth(10f);
mGlowPaint.setMaskFilter(new BlurMaskFilter(10f, BlurMaskFilter.Blur.OUTER));

• setAntiAlias(true)使Paint对象抗锯齿，让边缘变得更平滑；
• setColor(Color.GREEN) 设置辉光的颜色；
• setStyle(Paint.Style.STROKE) 使辉光仅是描边而不填充。
• setStrokeWidth(10f) 定义描边的宽度
• setMaskFilter(new BlurMaskFilter(10f, BlurMaskFilter.Blur.OUTER)) 定义模糊遮罩来创建辉光效果。 BlurMaskFilter 的第一个参数是模糊半径，第二个参数定义了辉光类型。

在 onDraw() 方法中，我们获取文本并绘制它。然后，我们使用 Paint 将外发光应用到文本周围：

// Apply glow effect to text
canvas.drawText(text,
        (getWidth() - bounds.width()) / 2.0f,
        (getHeight() - bounds.height()) / 2.0f,
        mGlowPaint);

最后，我们使用 super.onDraw() 方法在绘制之后再次使用 Paint 将文本绘制在辉光上面：

super.onDraw(canvas);

这就是如何使用自定义ViewGroup创建带辉光效果的TextView的全部过程。

结论

在Android中发光的TextView可以使你的文本内容更具吸引力。通过使用自定义ViewGroup和Paint，我们可以轻松地向TextView添加辉光效果。此外，这个同样的过程也能适用于其他View元素，如Button和ImageView。