Android自定义炫酷进度条(闪电能量条)

Android自定义进度条

借助Andorid5.0提供的cardView切圆角,使用切图叠加的形式,调整View的scrollY完成一个炫酷的进度条;

进度条代码

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
/**
 * Created by Administrator on 2017/9/29 0029.
 */

public class EnergyView extends RelativeLayout  {
    public static final String TAG = EnergyView.class.getSimpleName();
    private ImageView img;


    private View empty;

    public EnergyView(Context context) {
        this(context,null);
    }

    public EnergyView(Context context, AttributeSet attrs) {
        this(context, attrs,0);
    }
    public EnergyView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        LayoutInflater in = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        in.inflate(R.layout.energy_view, this, true);
        img = (ImageView) findViewById(R.id.img);
        empty = findViewById(R.id.img_empty);

    }
    private float currentProgress = 0;
    public void setProgress(int progress) {
        if(currentProgressint height = img.getHeight();
            float j = (float) Math.abs((currentProgress - maxProgress)) / (float) maxProgress;
            float k = height *j;
            float l = height-k;
            img.setScrollY((int) l);
        }

    }
    private int maxProgress = 100;
    public void setMaxProgress(int maxProgress) {
        this.maxProgress = maxProgress;
    }
    public int getCurrentProgress() {
        return (int) currentProgress;
    }
    public void clearProgress() {
        currentProgress = 0;
        img.setScrollY(0);
    }
    public void setEmptyVisibility(int visibility) {
        empty.setVisibility(visibility);
    }


}

布局文件代码


<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:clipChildren="false"
    android:background="@android:color/transparent">

    <android.support.v7.widget.CardView
        android:layout_centerInParent="true"
        android:id="@+id/energy_view_zhuti"
        app:cardBackgroundColor="@android:color/transparent"
        app:cardCornerRadius="15dp"
        app:cardElevation="0dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:src="@mipmap/icon_energy_0" />
        <android.support.v7.widget.CardView
            app:cardBackgroundColor="@android:color/transparent"
            android:layout_gravity="center"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardCornerRadius="8dp"
            >
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@mipmap/icon_energy_4" />
            <ImageView
                android:id="@+id/img"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"

                android:src="@mipmap/icon_energy_3" />
            <ImageView

                android:src="@mipmap/icon_energy_5"
                android:layout_gravity="center"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="10dp"
                android:src="@mipmap/icon_energy_2" />
            <ImageView
                android:layout_marginRight="2dp"
                android:layout_marginTop="4dp"
                android:src="@mipmap/icon_energy_1"
                android:layout_gravity="right"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
            <ImageView
                android:id="@+id/img_empty"
                android:src="@mipmap/icon_energy_empty"
                android:layout_gravity="center_horizontal"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
        android.support.v7.widget.CardView>
    android.support.v7.widget.CardView>

RelativeLayout>

源码地址

Android自定义炫酷进度条

你可能感兴趣的:(android)