6

我試圖實現類似的效果2種獨立的顏色這一項:顯示TextView中使用面具

enter image description here

什麼我現在做:

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

    p = new Paint(Paint.ANTI_ALIAS_FLAG); 
    p.setTextSize(25); 
    p.setColor(Color.GREEN); 

    pReplace = new Paint(p); 
    pReplace.setColor(Color.BLUE); 
    pReplace.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OVER)); 

    pMask = new Paint(); 
    int lightGradientColor = getResources().getColor(R.color.dailyGoalLowLight); 
    int darkGradientColor = getResources().getColor(R.color.dailyGoalLowDark); 
    Shader shader = new LinearGradient(0, 0, 150, 0, lightGradientColor, darkGradientColor, Shader.TileMode.CLAMP); 
    pMask.setShader(shader); 
    pMask.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR)); 
} 
@Override 
public void onDraw(Canvas canvas) { 
    super.onDraw(canvas); 
    canvas.save(); 
    if (!Utils.isEmpty(sText)) { 
     canvas.drawText(sText, 150, getHeight()/2, p); 
     canvas.drawRect(0, 0, 180, getHeight(), pMask); 
     canvas.drawText(sText, 150, getHeight()/2, pReplace); 
    } 
    canvas.restore(); 
} 

這導致:

enter image description here

關閉,問題他re是在設置pMask.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));時不顯示水平線性漸變。

如果我註釋掉該行我得到以下結果:再次

enter image description here

關閉,但現在的線性漸變完全覆蓋文本。有人可以幫我解決我在這裏失蹤的事。有沒有更好的方法來達到這個效果?

+0

有趣的問題。我也想知道。 – user1506104

回答

2

PorterDuff.Mode.SRC_IN也許有幫助。 並且setLayerType(View.LAYER_TYPE_SOFTWARE, null);應該被調用以使用SRC_IN

public class MaskedTextView extends View { 

    private final Paint pLeftBg; 
    private final Paint pText; 
    private final Paint pRightMask; 
    private String mText = "web"; 

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

     pLeftBg = new Paint(); 
     int lightGradientColor = ContextCompat.getColor(getContext(), R.color.dailyGoalLowLight); 
     int darkGradientColor = ContextCompat.getColor(getContext(), R.color.dailyGoalLowDark); 
     Shader shader = new LinearGradient(0, 0, 150, 0, lightGradientColor, darkGradientColor, Shader.TileMode.CLAMP); 
     pLeftBg.setShader(shader); 

     pText = new Paint(Paint.ANTI_ALIAS_FLAG); 
     pText.setTextSize(50); 
     pText.setColor(Color.WHITE); 

     pRightMask = new Paint(); 
     pRightMask.setColor(ContextCompat.getColor(getContext(), R.color.dailyGoalLowLight)); 
     pRightMask.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 

     setLayerType(View.LAYER_TYPE_SOFTWARE, null); 
    } 

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

     canvas.save(); 
     canvas.drawRect(0, 0, 100, getHeight(), pLeftBg); 
     canvas.drawText(mText, 50, getHeight()/2, pText); 
     canvas.drawRect(100, 0, getWidth(), getHeight(), pRightMask); 
     canvas.restore(); 
    } 
} 

輸出:

enter image description here

+0

我沒有意識到你需要調用'setLayerType(View.LAYER_TYPE_SOFTARE,null);'。謝謝你的提示! – pat