Как программно создавать или изменять чертежи из линий разных цветов

Question

Мне нужно нарисовать линию 3dp, чтобы представить завершение уровня в игре с quizz.

Эта линия должна быть двух цветов. Например, если пользователь выполнил 40% уровня, линия будет красной для первых 40% линии, остальные 60% будут серыми.

мне удалось сделать это с растяжимой:

<?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> 

А затем отобразить его с ImageView:

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

... но теперь, я, конечно, должны быть в состоянии измените этот рацион 40%/60% в зависимости от завершения действия пользователя.

Первый вопрос: какой лучший наиболее эффективный способ сделать это? Измените вытягиваемый во время выполнения? или создать новую версию во время выполнения в Java?

Второй вопрос: как это сделать? Я попробовал оба пути (воссоздать эту вытяжку в Java коде/изменить XML вытяжку во время выполнения) и не удался :-(

Любой помощь будет высоко оценен.

Answer 1

так это обычай вытяжкой вы можешь Применение:

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; 
    } 
} 

и тестовый код:.

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

Я нашел способ сделать это не знаю, если это самый эффективный способ, но здесь это:

Я использовал RelativeLayout, чтобы накладывать ImageViews на цвет фона.

в 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> 

в 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> 

в 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

Как насчет использования прогресс бар? Стиль сделанных и выполняемых маркеров может быть установлен либо программно, либо через файлы xml. Ваш код также будет более читабельным/обслуживаемым, потому что вы будете использовать правильный виджет для задания. Ваш макет будет содержать:

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

Вы можете обновить строку из кода, используя, например:

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

Этот пример переопределяет стиль бара (в соответствии с указаниями progressDrawable атрибута), используя Рез /drawable/progress_bar.xml - содержимое ниже.У этого есть дополнительная привлекательность, как затенение градиента и закругленные углы; настроить по своему усмотрению:

<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> 

Кредита http://www.tiemenschut.com/how-to-customize-android-progress-bars/, что дает гораздо более подробную информацию о том, как настроить прогресс бары.

Answer 4

Этот фрагмент кода будет работать для всех апи

Использование этого:

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