Jak programowo utworzyć lub zmienić rysowanie z linii o różnych kolorach

Question

Muszę narysować linię 3dp do przedstawienia poziomu w grze quizów.

Linia musi składać się z 2 kolorów. Na przykład, jeśli użytkownik ukończy 40% poziomu, linia będzie czerwona dla pierwszych 40% linii, a pozostałe 60% z szarości.

udało mi się zrobić z rozciągliwej:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <shape android:shape="line" > 
      <size android:height="3dp" android:width="40dp"/> 
      <stroke 
       android:width="1dp" 
       android:color="#FFFC10" /> 
     </shape> 
    </item> 
    <item android:left="40dp"> 
     <shape android:shape="line" > 
      <size android:height="3dp" android:width="60dp" /> 
      <stroke 
       android:width="1dp" 
       android:color="#DDDDDD" /> 
     </shape> 
    </item> 
</layer-list> 

a potem wyświetlić go z ImageView:

<ImageView 
       android:id="@+id/row_completion_bar" 
       android:src="@drawable/completion_bar" 
       android:layout_width="100dp" 
       android:layout_height="3dp" /> 

... ale teraz muszę oczywiście być w stanie zmień tę zależność 40%/60% w zależności od ukończenia użytkownika actuel.

Pierwsze pytanie: jaki jest najlepszy najbardziej wydajny sposób na zrobienie tego? Zmienić losowanie w czasie wykonywania? lub utworzyć nowy program do rysowania w środowisku wykonawczym w Javie?

Drugie pytanie: jak to zrobić? Próbowałem obu sposobów (odtworzyć ten rozciągliwej w kodzie Java/zmieniać rozciągliwej xml w czasie wykonywania) i nie udało :-(

Każda pomoc będzie mile widziana.

Answer 1

więc jest to zwyczaj rozciągliwej MOŻESZ używać:

class LineDrawable extends Drawable { 
    private Paint mPaint; 

    public LineDrawable() { 
     mPaint = new Paint(); 
     mPaint.setStrokeWidth(3); 
    } 

    @Override 
    public void draw(Canvas canvas) { 
     int lvl = getLevel(); 
     Rect b = getBounds(); 
     float x = b.width() * lvl/10000.0f; 
     float y = (b.height() - mPaint.getStrokeWidth())/2; 
     mPaint.setColor(0xffff0000); 
     canvas.drawLine(0, y, x, y, mPaint); 
     mPaint.setColor(0xff00ff00); 
     canvas.drawLine(x, y, b.width(), y, mPaint); 
    } 

    @Override 
    protected boolean onLevelChange(int level) { 
     invalidateSelf(); 
     return true; 
    } 

    @Override 
    public void setAlpha(int alpha) { 
    } 

    @Override 
    public void setColorFilter(ColorFilter cf) { 
    } 

    @Override 
    public int getOpacity() { 
     return PixelFormat.TRANSLUCENT; 
    } 
} 

i kodu testowego.

View v = new View(this); 
final LineDrawable d = new LineDrawable(); 
d.setLevel(4000); 
v.setBackgroundDrawable(d); 
setContentView(v); 
OnTouchListener l = new OnTouchListener() { 
    @Override 
    public boolean onTouch(View v, MotionEvent event) { 
     int lvl = (int) (10000 * event.getX()/v.getWidth()); 
     d.setLevel(lvl); 
     return true; 
    } 
}; 
v.setOnTouchListener(l); 

Answer 2

Znalazłem sposób to zrobić nie wiem, czy to jest to najbardziej skuteczny sposób, ale tutaj jest:

Użyłem RelativeLayout do superumiejętności ImageViews z kolorem tła.

w layout.xml:

<RelativeLayout style="@style/CompletionBar"> 

<ImageView 
    android:id="@+id/row_completion_bar_0" 
    style="@style/CompletionBar0" /> 

<ImageView 
    android:id="@+id/row_completion_bar_1" 
    style="@style/CompletionBar1" />  

</RelativeLayout> 

w styles.xml:

<!-- Completion Bar (Relative Layout) --> 
<style name="CompletionBar"> 
    <item name="android:layout_width">wrap_content</item> 
    <item name="android:layout_height">wrap_content</item> 
</style> 

<!-- Completion Bar 0 (ImageView) --> 
<style name="CompletionBar0"> 
    <item name="android:layout_width">100dp</item> 
    <item name="android:layout_height">2dp</item> 
    <item name="android:background">#CCCCCC</item> 
</style> 

<!-- Completion Bar 1 (ImageView) --> 
<style name="CompletionBar1"> 
    <item name="android:layout_width">40dp</item> 
    <item name="android:layout_height">2dp</item> 
    <item name="android:background">#555555</item> 
</style> 

w pliku Java:

ImageView cb1 = (ImageView)row.findViewById(R.id.row_completion_bar_1); 
cb1.getLayoutParams().width = 40; /* Value in pixels, must convert to dp */ 

Answer 3

Jak o użyciu paska postępu? Styl znaczników Sporządzono i Zadania można ustawić programowo lub za pomocą plików xml. Twój kod będzie również bardziej czytelny/obsługiwany, ponieważ będziesz używał właściwego widgetu do pracy. Twój układ będzie zawierał:

<ProgressBar 
    android:id="@+id/progressBar" 
    android:layout_height="3dip" 
    android:layout_width="match_parent" 
    android:progressDrawable="@drawable/progress_bar" /> 

można zaktualizować pasek z kodu za pomocą np

ProgressBar bar = (ProgressBar)findViewById(R.id.progressBar); 
bar.setProgress(40); 

Przykład ten zasłania styl bar (zgodnie z zaleceniami atrybutu progressDrawable), stosując res /drawable/progress_bar.xml plik - zawartość poniżej.Ta ma dodatkowe odcienie gradientu i zaokrąglone rogi; dostosować zgodnie z potrzebami:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
    <item android:id="@android:id/background"> 
    <shape> 
     <corners android:radius="5dip" /> 
     <gradient 
     android:angle="270" 
     android:centerColor="#ff5a5d5a" 
     android:centerY="0.5" 
     android:endColor="#ff747674" 
     android:startColor="#ff9d9e9d" /> 
    </shape> 
    </item> 
    <item android:id="@android:id/progress"> 
    <clip> 
     <shape> 
     <corners android:radius="5dip" /> 
      <gradient 
      android:angle="0" 
      android:endColor="#ff009900" 
      android:startColor="#ff000099" /> 
     </shape> 
    </clip> 
    </item> 
</layer-list> 

kredytową do http://www.tiemenschut.com/how-to-customize-android-progress-bars/, która daje dużo więcej szczegółów, w jaki sposób dostosować paski postępu.

Answer 4

Ten fragment będzie działać dla wszystkich API

użyj:

Drawable drawable = editText.getBackground(); 
drawable.setColorFilter(editTextColor, PorterDuff.Mode.SRC_ATOP); 
if(Build.VERSION.SDK_INT > 16) { 
    editText.setBackground(drawable); 
}else{ 
    editText.setBackgroundDrawable(drawable); 
}