Android中的自定义进度条?

时间:2011-01-03 03:01:57

标签: java android xml progress-bar progress

我还没知道如何做到这一点。我的进度条应该是云的形状。有人可以指导我阅读一本书,教程或只是给出正确的一步一步的方法吗?

感谢您的时间。

2 个答案:

答案 0 :(得分:15)

如图here所示,您可以使用图片视图来获得自定义滚动条效果。

该示例中自定义进度条的布局XML是:

<RelativeLayout android:id="@+id/RelativeLayout01"
    android:layout_width="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"
    android:gravity="center" android:layout_height="wrap_content"
    android:paddingLeft="30sp" android:paddingRight="30sp">
    <ImageView android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:src="@drawable/progress_1"
        android:id="@+id/imgOne" android:tag="1"></ImageView>
    <ImageView android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:src="@drawable/progress_2"
        android:id="@+id/imgTwo" android:layout_toRightOf="@id/imgOne"
        android:tag="2"></ImageView>
    <ImageView android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:src="@drawable/progress_3"
        android:id="@+id/imgThree" android:layout_toRightOf="@id/imgTwo"
        android:tag="3"></ImageView>
    <TextView android:id="@+id/TextView01" android:layout_height="wrap_content"
        android:layout_toRightOf="@id/imgThree" android:layout_width="wrap_content"
        android:layout_alignTop="@id/imgThree" android:layout_alignBottom="@id/imgThree"
        android:gravity="bottom" android:text="Please Wait..."></TextView>
</RelativeLayout>

然后他在类文件中创建了一个图像列表:

/**
 * Loads the layout and sets the initial set of images
 */
private void prepareLayout() {
    LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View view = inflater.inflate(R.layout.myprogressbar, null);
    addView(view);

    imageHolders = new ArrayList<ImageView>();
    imageHolders.add((ImageView) view.findViewById(R.id.imgOne));
    imageHolders.add((ImageView) view.findViewById(R.id.imgTwo));
    imageHolders.add((ImageView) view.findViewById(R.id.imgThree));

    // Prepare an array list of images to be animated
    images = new ArrayList<String>();

    images.add("progress_1");
    images.add("progress_2");
    images.add("progress_3");
    images.add("progress_4");
    images.add("progress_5");
    images.add("progress_6");
    images.add("progress_7");
    images.add("progress_8");
    images.add("progress_9");
}

然后他启动一个休眠0.3秒的线程并用handler.sendEmptyMessage(0);调用处理程序,最后在Handler中完成其余的图像工作:

@Override
public void handleMessage(Message msg) {
    int currentImage = 0;
    int nextImage = 0;
    // Logic to change the images
    for (ImageView imageView : imageHolders) {
        currentImage = Integer.parseInt(imageView.getTag().toString());
        if (currentImage < 9) {
            nextImage = currentImage + 1;
        } else {
            nextImage = 1;
        }
        imageView.setTag("" + nextImage);
        imageView.setImageResource(getResources().getIdentifier(
                images.get(nextImage - 1), "drawable",
                "com.beanie.example"));
    }
    super.handleMessage(msg);
}

另请查看herehere

答案 1 :(得分:1)

我最终使用Custom Progress Bar with Round Corners作为基础来挖掘Harry Joy推荐的内容。但是,如果您想要与Android的SDK版本相同的功能,例如ProgressBar类中的intermediate,我必须进行一些更改。我所做的更改使得可以定义和动画中间drawable。

请务必按照here的说明进行操作,但请将RoundProgress类替换为:

public class RoundProgress extends RelativeLayout {
private ImageView progressDrawableImageView;
private ImageView trackDrawableImageView;
private ImageView backGroundImageView;
private double max = 100;
private AttributeSet attrs2 ;
private Transformation mTransformation;
private AlphaAnimation mAnimation;
private int mBehavior;
private int mDuration;
private Interpolator mInterpolator;
private static Context ctx;
private int bgResource;

public int getMax() {
    Double d = new Double(max);
    return d.intValue();
}

public double getMaxDouble() {
    return max;
}

public void setMax(int max) {
    Integer maxInt = new Integer(max);
    maxInt.doubleValue();
    this.max = max;
}

public void setMax(double max) {
    this.max = max;
}

public RoundProgress(Context context, AttributeSet attrs) {
    super(context, attrs);
    LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    inflater.inflate(R.layout.round_progress, this);
    setup(context, attrs);
}

protected void setup(Context context, AttributeSet attrs)
{
    attrs2 = attrs;
    ctx = context;
    TypedArray a = context.obtainStyledAttributes(attrs,
        R.styleable.RoundProgress);
    //setBackgroundResource(R.drawable.custom_loading_bg);
    backGroundImageView = (ImageView) findViewById(R.id.background_image_view);
    backGroundImageView.setBackgroundResource(R.drawable.custom_loading_bg);


    final String xmlns="http://schemas.android.com/apk/res/com.digiphd.prospec";
   bgResource = attrs.getAttributeResourceValue(xmlns,
            "progressDrawable", 0);
    progressDrawableImageView = (ImageView) findViewById(
            R.id.progress_drawable_image_view);

    progressDrawableImageView.setBackgroundResource(bgResource);

    int trackResource = attrs.getAttributeResourceValue(xmlns, "track", 0);
    trackDrawableImageView = (ImageView) findViewById(R.id.track_image_view);
    trackDrawableImageView.setBackgroundResource(trackResource);

    int progress = attrs.getAttributeIntValue(xmlns, "progress", 0);
    setProgress(progress);
    int max = attrs.getAttributeIntValue(xmlns, "max", 100);
    setMax(max);

    int numTicks = attrs.getAttributeIntValue(xmlns, "numTicks", 0);

    a.recycle();

    ProgressBarOutline outline = new ProgressBarOutline(context);
    //addView(outline);


}

public void setProgress(Integer value)
{
    setProgress((double) value);
}

public void setProgress(double value) {
    ClipDrawable drawable = (ClipDrawable)
            progressDrawableImageView.getBackground();
    double percent = (double) value/ (double)max;
    int level = (int)Math.floor(percent*10000);

    drawable.setLevel(level);
}

public void setIntermediate(boolean t)
{
   if(t){
       progressDrawableImageView.setBackgroundResource(R.drawable.custom_intermediate_bg);
       startAnimation();
   }else{
       progressDrawableImageView.clearAnimation();
       progressDrawableImageView.setBackgroundResource(bgResource);

   }
}

/**
 * <p>Start the indeterminate progress animation.</p>
 */
void startAnimation() {
    int visibility = getVisibility();
    if (visibility != VISIBLE) {
        return;
    }
    Log.d("INTERMEDIATE","ANIMATION START!");
    mDuration = 1000;

        if (mInterpolator == null) {
            mInterpolator = new LinearInterpolator();
        }

        mTransformation = new Transformation();
        mAnimation = new AlphaAnimation(0.0f, 1.0f);
        mAnimation.setRepeatMode(Animation.REVERSE);
        mAnimation.setRepeatCount(Animation.INFINITE);
        mAnimation.setDuration(mDuration);
        mAnimation.setInterpolator(mInterpolator);
        mAnimation.setStartTime(Animation.START_ON_FIRST_FRAME);
        progressDrawableImageView.startAnimation(mAnimation);


}
}

现在,在您的活动中,您可以在需要时调用.setIntermediate(true或false)。