2017-02-17 5 views
1

Ich versuche, ComposeShader mit LinearGradients zu machen, aber vielleicht habe ich ein paar Probleme.
1) Wenn ich nur einen LinearGradient wie
verwende lgA = neuer LinearGradient (0, 0, 0, h, 0xff000000, 0xffffffff, Shader.TileMode.CLAMP);
dann über einen Teil der Forderung richtig
2) Wenn die Verwendung ComposeShader dann nicht Ergebnis wie tatsächlichen BedarfWie man LinearGradients in ComposeShader einstellt

Actual Requirment:
enter image description here

Dann, wie ich dieses Problem irgendeine Hilfe lösen kann, bitte Ich für dieses Problem.

public class DrawGradient extends View { 

    Paint paint; 
    LinearGradient lgA; 
    LinearGradient lgB; 
    ComposeShader shader; 

    public DrawGradient(Context context) { 
     super(context); 
     initView(); 
    } 

    private void initView() { 
     setLayerType(View.LAYER_TYPE_SOFTWARE, null); 
     paint = new Paint(); 
     paint.setAntiAlias(true); 
     paint.setFilterBitmap(true); 

    } 

    @Override 
    protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
     super.onSizeChanged(w, h, oldw, oldh); 
     lgA = new LinearGradient(0, 0, w, h, 0xff000000, 0xffffffff, Shader.TileMode.CLAMP); 
     lgB = new LinearGradient(0, h, w, 0, 0xffffffff, 0xff000000, Shader.TileMode.CLAMP); 
     shader = new ComposeShader(lgA, lgB, PorterDuff.Mode.MULTIPLY); 
    } 

    @Override 
    protected void onDraw(Canvas canvas) { 
     super.onDraw(canvas); 
     paint.setShader(shader); 
     canvas.drawPaint(paint); 
    } 
} 

Code Ausgang:
enter image description here

Antwort

0

Seit diesen 4 Monaten ich das vorstellen, wird nun wenig hilfreich sein, aber hier ist es für jemanden anderen mit einem ähnlichen Problem.

Das Problem liegt in diesen beiden Linien:

lgA = new LinearGradient(0, 0, w, h, 0xff000000, 0xffffffff, Shader.TileMode.CLAMP); 
lgB = new LinearGradient(0, h, w, 0, 0xffffffff, 0xff000000, Shader.TileMode.CLAMP); 

Sie haben zwei linearen Gradienten erstellt; einer von links oben nach links unten, der andere von links unten nach oben rechts. Was Sie suchen, ist dies:

lgA = new LinearGradient(0, 0, 0, h/2, Color.BLACK, Color.WHITE, Shader.TileMode.CLAMP); 
lgB = new LinearGradient(0, h/2, 0, h, Color.WHITE, Color.BLACK, Shader.TileMode.CLAMP); 

Mit diesen Änderungen funktionierte es für mich. Es ist wichtig zu beachten, dass ComposeShader nicht ohne die Linie funktionieren würde:

setLayerType(View.LAYER_TYPE_SOFTWARE, null); 

Aus Gründen erklärt here.

ComposeShader scheint hauptsächlich zum Überlagern von Shadern wie LinearGradients verwendet zu werden, anstatt einen dreifarbigen Übergang zu erstellen, nach dem Sie suchen. Alternativ hätten Sie LinearGradient selbst verwenden können, aber mit dem anderen Konstruktor, der mehr als zwei verschiedene Farben haben kann. Z.B.

int[] colors = {Color.BLACK,Color.WHITE,Color.BLACK}; 
float[] pos = {0.0f,0.5f,1.0f}; 
paint.setShader(new LinearGradient(0,0,0,h,colors,pos,Shader.TileMode.CLAMP)); 

Dies hätte Ihnen den gleichen Effekt gegeben, ohne dass Sie ComposeShader benötigen. Allerdings verwendete ich diese Methode in meinem eigenen Projekt, aber mit Color.TRANSPARENT im Farbverlauf und es wurde schwarz statt transparent.