如何勾勒出TextView?

时间:2013-02-26 14:36:49

标签: android fonts android-canvas draw stroke

我想做什么?(蓝色将更改为白色) enter image description here

我做了什么?
我找到了一个扩展TextView的类,它能够非常接近我想要的文本视图。问题是我无法将笔触颜色更改为任何颜色,它总是绘制为黑色。如何将边框颜色设置为白色?

我的输出是什么:
enter image description here

我的代码在哪里?

public class TypeFaceTextView extends TextView {

private static Paint getWhiteBorderPaint(){
    Paint p = new Paint(Color.WHITE);
    return p;
}

private static final Paint BLACK_BORDER_PAINT = getWhiteBorderPaint();

static {
    BLACK_BORDER_PAINT.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));
}

@Override
public void setText(CharSequence text, BufferType type) {

    super.setText(String.format(text.toString()), type);
}

private static final int BORDER_WIDTH = 1;

private Typeface typeface;

public TypeFaceTextView(Context context) {
    super(context);
}

public TypeFaceTextView(Context context, AttributeSet attrs) {
    super(context, attrs);

    setDrawingCacheEnabled(false);

    setTypeface(attrs);
}

private void setTypeface(AttributeSet attrs) {
    final String typefaceFileName = attrs.getAttributeValue(null, "typeface");
    if (typefaceFileName != null) {
        typeface = Typeface.createFromAsset(getContext().getAssets(), typefaceFileName);
    }

    setTypeface(typeface);
}

public TypeFaceTextView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);

    setTypeface(attrs);
}

@Override
public void draw(Canvas aCanvas) {
    aCanvas.saveLayer(null, BLACK_BORDER_PAINT, Canvas.HAS_ALPHA_LAYER_SAVE_FLAG
            | Canvas.FULL_COLOR_LAYER_SAVE_FLAG | Canvas.MATRIX_SAVE_FLAG);

    drawBackground(aCanvas, -BORDER_WIDTH, -BORDER_WIDTH);
    drawBackground(aCanvas, BORDER_WIDTH + BORDER_WIDTH, 0);
    drawBackground(aCanvas, 0, BORDER_WIDTH + BORDER_WIDTH);
    drawBackground(aCanvas, -BORDER_WIDTH - BORDER_WIDTH, 0);

    aCanvas.restore();
    super.draw(aCanvas);

}

private void drawBackground(Canvas aCanvas, int aDX, int aDY) {
    aCanvas.translate(aDX, aDY);
    super.draw(aCanvas);
}
}

6 个答案:

答案 0 :(得分:4)

1)创建textview对象扩展TextView

public class YourTextView extends TextView { .........

2)在其绘制方法上执行此操作

@Override
public void draw(Canvas canvas) {
        for (int i = 0; i < 5; i++) {
        super.draw(canvas);
    }
}

3)设置textview的xml端如下

android:shadowColor="@color/white"
android:shadowRadius="5"

答案 1 :(得分:1)

我的解决方案基于自定义 TextView

public class TextViewOutline extends TextView{
    int outline_color;
    float outline_width; //relative to font size

    public TextViewOutline( Context context, int outline_color, float outline_width ){
        super( context );
        this.outline_color = outline_color;
        this.outline_width = outline_width;
    }

    @Override
    protected void onDraw( Canvas canvas) {
        //draw standard text
        super.onDraw( canvas );
        //draw outline
        Paint paint = getPaint();
        paint.setStyle( Paint.Style.STROKE );
        paint.setStrokeWidth( paint.getTextSize()*outline_width );
        int color_tmp = paint.getColor();
        setTextColor( outline_color );
        super.onDraw( canvas );
        //restore
        setTextColor( color_tmp );
        paint.setStyle( Paint.Style.FILL );
    }
}

测试代码。

TextViewOutline tv = new TextViewOutline( this, 0xff0080ff, 0.04f);
tv.setText( "Simple TEST" );
tv.setTypeface( Typeface.create( Typeface.SERIF, Typeface.BOLD ) );
tv.setTextColor( 0xff000000 );
tv.setTextSize( 128 );
setContentView(tv);

tv.setOnClickListener( new View.OnClickListener(){
    @Override
    public void onClick( View view ){
        view.invalidate();
    }
} );

结果。

enter image description here

答案 2 :(得分:0)

不能这样,但尝试尝试:PorterDuff.Mode

http://developer.android.com/reference/android/graphics/PorterDuff.Mode.html

尝试将其更改为“ADD”或“CLEAR”,希望这会有所帮助。

答案 3 :(得分:0)

您需要将getWhiteBorderPaint()方法更改为以下内容:

private static Paint getWhiteBorderPaint(){
    Paint p = new Paint();
    p.setColor(Color.WHITE);
    return p;
}

Paint constructor仅使用位掩码标志,并且不支持任意整数作为参数。

答案 4 :(得分:0)

我发现了一种简单的方法来概述视图而无需继承 TextView 。 我编写了一个简单的库,该库使用Android的 Spannable 概述文本。 这种解决方案使只轮廓部分文本成为可能。

库:OutlineSpan

课程(您只能复制课程):OutlineSpan

答案 5 :(得分:0)

带有透明背景的文本轮廓

这是一种没有背景颜色的方法

public class CustomTextView extends androidx.appcompat.widget.AppCompatTextView {

float mStroke;

public CustomTextView(Context context, @Nullable AttributeSet attrs) {
    super(context, attrs);
    TypedArray a = context.obtainStyledAttributes(attrs,
            R.styleable.CustomTextView);
    mStroke=a.getFloat(R.styleable.CustomTextView_stroke,1.0f);
    a.recycle();
}

@Override
protected void onDraw(Canvas canvas) {
    TextPaint paint = this.getPaint();
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth(mStroke);
    
    super.onDraw(canvas);
}
}

那么你只需要在attrs.xml文件中添加以下内容

<declare-styleable name="CustomTextView">
    <attr name="stroke" format="float"/>
</declare-styleable>

现在您可以通过 app:stroke 设置笔触宽度,同时保留 TextView 的所有其他所需属性。我的解决方案只绘制没有填充的笔划。这使它比其他的简单一点。在深色背景上为我的 customtextview 设置自定义字体时,在屏幕截图中显示结果。

enter image description here