自定义view之自定义电池效果

电池电量效果

实现思路：progressBar覆盖ImageVIew

   <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/img" />
        <ProgressBar
            android:id="@+id/pb"
            android:layout_marginTop="5dp"
            android:layout_marginLeft="4dp"
            style="@style/StyleProgressBarMini"
            android:layout_width="55dp"
            android:layout_height="29dp"
            android:max="100" />
    </RelativeLayout>

style.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!--style属性-->
    <style name="StyleProgressBarMini" parent="Widget.AppCompat.ProgressBar.Horizontal">
        <item name="android:progressDrawable">@drawable/shape_progressbar</item>
    </style>
</resources>

shape_progressbar.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--progressbar的背景颜色-->
<!--    <item android:id="@android:id/background">-->
<!--        <shape>-->
<!--            <corners android:radius="5dip" />-->
<!--            <gradient-->
<!--                android:startColor="@color/black"-->
<!--                android:centerColor="@color/blue"-->
<!--                android:endColor="@color/black"-->
<!--                android:angle="270"-->
<!--                />-->
<!--        </shape>-->
<!--    </item>-->
    <!--progressBar的缓冲进度颜色-->
<!--    <item android:id="@android:id/secondaryProgress">-->
<!--        <clip>-->
<!--            <shape>-->
<!--                <corners android:radius="5dip" />-->
<!--                <gradient-->
<!--                    android:startColor="@color/white"-->
<!--                    android:centerColor="@color/white"-->
<!--                    android:endColor="@color/white"-->
<!--                    android:angle="270"-->
<!--                    />-->
<!--            </shape>-->
<!--        </clip>-->
<!--    </item>-->
    <!--progressBar的最终进度颜色-->
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                    android:startColor="@color/teal_200"
                    android:centerColor="@color/teal_200"
                    android:endColor="@color/teal_200"
                    android:angle="270"
                    />
            </shape>
        </clip>
    </item>
</layer-list>

public class MainActivity extends AppCompatActivity {
    
    
    private ProgressBar pb;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    
    
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        pb = (ProgressBar) findViewById(R.id.pb);

        Log.e("wy", "onCreate: "+ getString(R.string.hello) );
    }

    public void click(View v){
    
    
        int i = pb.getProgress();//获取一个progress当前的进度
        i = i+10;
        pb.setProgress(i);//根据设置的int值设置ProgressBar的进度
    }

public class MainActivity extends AppCompatActivity {
    
    
    private ProgressBar pb;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    
    
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        pb = (ProgressBar) findViewById(R.id.pb);

        Log.e("wy", "onCreate: "+ getString(R.string.hello) );
    }

    public void click(View v){
    
    
        int i = pb.getProgress();//获取一个progress当前的进度
        i = i+10;
        pb.setProgress(i);//根据设置的int值设置ProgressBar的进度
    }
    }