Solución:
Recientemente me encontré con la necesidad de una barra de progreso vertical, pero no pude encontrar una solución utilizando el widget de barra de progreso existente. Las soluciones que encontré generalmente requerían una extensión de la barra de progreso actual o una clase completamente nueva en sí misma. No estaba convencido de que fuera necesario implementar una nueva clase para lograr un cambio de orientación simple.
Este artículo presenta una solución simple, elegante y, lo más importante, sin trucos para lograr una barra de progreso vertical. Voy a omitir la explicación y simplemente proporcionaré una solución de cortador de galletas. Si necesita más detalles, no dude en ponerse en contacto conmigo o dejar un comentario a continuación.
Cree un xml en su carpeta dibujable (no drawable-hdpi o drawable-mdpi – colóquelo en dibujable). Para este ejemplo, llamo a mi xml vertical_progress_bar.xml
Esto es lo que debe colocar en el archivo xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#ff9d9e9d"
android:centerColor="#ff5a5d5a"
android:centerY="0.75"
android:endColor="#ff747674"
android:angle="180"
/>
</shape>
</item>
<item android:id="@android:id/secondaryProgress">
<clip android:clipOrientation="vertical" android:gravity="bottom">
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#80ffd300"
android:centerColor="#80ffb600"
android:centerY="0.75"
android:endColor="#a0ffcb00"
android:angle="180"
/>
</shape>
</clip>
</item>
<item android:id="@android:id/progress">
<clip android:clipOrientation="vertical" android:gravity="bottom">
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#ffffd300"
android:centerColor="#ffffb600"
android:centerY="0.75"
android:endColor="#ffffcb00"
android:angle="180"
/>
</shape>
</clip>
</item>
</layer-list>
Cree un archivo xml llamado styles.xml y colóquelo en res / valores. Si su proyecto ya contiene styles.xml en res / valores, omita este paso.
Modifique su archivo styles.xml y agregue el siguiente código al final del archivo:
<style name="Widget">
</style>
<style name="Widget.ProgressBar">
<item name="android:indeterminateOnly">true</item>
<item name="android:indeterminateBehavior">repeat</item>
<item name="android:indeterminateDuration">3500</item>
<item name="android:minWidth">48dip</item>
<item name="android:maxWidth">48dip</item>
<item name="android:minHeight">48dip</item>
<item name="android:maxHeight">48dip</item>
</style>
<style name="Widget.ProgressBar.Vertical">
<item name="android:indeterminateOnly">false</item>
<item name="android:progressDrawable">@drawable/progress_bar_vertical</item>
<item name="android:indeterminateDrawable">@android:drawable/progress_indeterminate_horizontal</item>
<item name="android:minWidth">1dip</item>
<item name="android:maxWidth">12dip</item>
</style>
Agregue su nueva barra de progreso vertical a su diseño. He aquí un ejemplo:
<ProgressBar
android:id="@+id/vertical_progressbar"
android:layout_width="12dip"
android:layout_height="300dip"
style="@style/Widget.ProgressBar.Vertical"
/>
Eso debería ser todo lo que necesita hacer para utilizar una barra de progreso vertical en su proyecto. Opcionalmente, puede tener imágenes personalizadas de nueve parches dibujables que está utilizando para la barra de progreso. Debe realizar los cambios apropiados en el archivo progress_bar_vertical.xml. ¡Espero que esto te ayude en tu proyecto!
Tienes que crear tu propia barra de progreso personalizada.
En su xml agregue este diseño:
<com.example.component.VerticalProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:id="@+id/verticalRatingBar1"
android:layout_width="wrap_content"
android:progress="50"
android:layout_height="fill_parent" />
VerticalProgressBar.java
public class VerticalProgressBar extends ProgressBar{
private int x, y, z, w;
@Override
protected void drawableStateChanged() {
// TODO Auto-generated method stub
super.drawableStateChanged();
}
public VerticalProgressBar(Context context) {
super(context);
}
public VerticalProgressBar(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public VerticalProgressBar(Context context, AttributeSet attrs) {
super(context, attrs);
}
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
this.x = w;
this.y = h;
this.z = oldw;
this.w = oldh;
}
@Override
protected synchronized void onMeasure(int widthMeasureSpec,
int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}
protected void onDraw(Canvas c) {
c.rotate(-90);
c.translate(-getHeight(), 0);
super.onDraw(c);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
if (!isEnabled()) {
return false;
}
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
setSelected(true);
setPressed(true);
break;
case MotionEvent.ACTION_MOVE:
setProgress(getMax()
- (int) (getMax() * event.getY() / getHeight()));
onSizeChanged(getWidth(), getHeight(), 0, 0);
break;
case MotionEvent.ACTION_UP:
setSelected(false);
setPressed(false);
break;
case MotionEvent.ACTION_CANCEL:
break;
}
return true;
}
@Override
public synchronized void setProgress(int progress) {
if (progress >= 0)
super.setProgress(progress);
else
super.setProgress(0);
onSizeChanged(x, y, z, w);
}
}
O :
La solución de Jagsaund también está siendo perfecta.
Sé que es una publicación antigua pero encontré una solución muy simple a este problema que quizás pueda ayudar a alguien. Primero, cree un progress_drawable_vertical.xml como este:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:andro>
<item android:>
<color android:color="#777" />
</item>
<item android:>
<clip
android:clipOrientation="vertical"
android:gravity="bottom">
<shape>
<gradient
android:startColor="#00FF00"
android:centerColor="#FFFF00"
android:endColor="#FF0000"
android:angle="90" />
</shape>
</clip>
</item>
</layer-list>
Entonces solo usa esto en tu progressBar:
<ProgressBar
android:
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:max="100"
android:progress="33"
android:progressDrawable="@drawable/progress_drawable_vertical" />
También he creado un progress_drawable_horizontal.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:andro>
<item android:>
<color android:color="#777" />
</item>
<item android:>
<clip
android:clipOrientation="horizontal"
android:gravity="left">
<shape>
<gradient
android:startColor="#00FF00"
android:centerColor="#FFFF00"
android:endColor="#FF0000" />
</shape>
</clip>
</item>
</layer-list>
con el objetivo de mantener el mismo estilo definido en progress_drawable_vertical.xml
La clave aquí es el uso correcto de android:clipOrientation y android:gravity.
Encontré esta solución aquí y el núcleo de la solución es similar a jagsaund pero un poco más simple.