Android自定义带水滴的进度条样式(带渐变色效果)_Android

一、直接看效果

二、直接上代码

1.自定义控件部分

package com.susan.project.myapplication;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.View;
/**
* @author dahai
* @ClassName: ${type_name}
* @Description: ${todo}
* @date ${date} ${time}
* @email 202491024@qq.com
* @since $android 渐变 进度条
*/
public class ProgressSeek extends View {
/**
* 进度条的宽度
*/
private int view_width;
/**
* 画布的宽度
*/
private int view_base_width;
/**
* 控件的宽度
*/
private int view_edge_width;
/**
* 进度
*/
private int progress;
private Canvas cacheCanvas;
/**
* 背景颜色的画笔
*/
private Paint backgroundPaint;
/**
* 进度条的画笔
*/
private Paint progressPaint;
/**
* 进度末端的图
*/
private Bitmap bitmap;
private int bitmapWidth;
private int bitmapHeight;
private Context context;
//渐变色开始
private static final int DEFAULT_START_COLOR = Color.parseColor("#34DAB5");
//渐变色结束
private static final int DEFAULT_END_COLOR = Color.parseColor("#27A5FE");
/**
* 缓存图片
*/
private Bitmap cacheBitmap;
public ProgressSeek(Context context) {
super(context);
initView(context);
}
public ProgressSeek(Context context, AttributeSet attrs) {
super(context, attrs);
initView(context);
}
public ProgressSeek(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initView(context);
}
private void initView(Context context) {
this.context = context;
bitmap = BitmapFactory.decodeResource(context.getResources(), R.mipmap.thumb);
bitmapWidth = bitmap.getWidth();
bitmapHeight = bitmap.getHeight();
backgroundPaint = new Paint();
backgroundPaint.setStrokeWidth(bitmapWidth);
backgroundPaint.setColor(Color.parseColor("#cccccc"));
backgroundPaint.setDither(true);
backgroundPaint.setAntiAlias(true);
progressPaint = new Paint();
progressPaint.setStrokeWidth(bitmapWidth);
progressPaint.setDither(true);
progressPaint.setAntiAlias(true);
DisplayMetrics d = new DisplayMetrics();
((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(d);
view_base_width = d.widthPixels;
}
public void init(int progress) {
this.progress = progress;
if (view_width == 0) {//第一上来
/* DisplayMetrics d = new DisplayMetrics();
((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(d);
view_width = d.widthPixels*progress/100;*/
view_width = view_base_width * progress / 100;
} else {
view_width = view_edge_width * progress / 100;
}
if (cacheBitmap != null) {
if (!cacheBitmap.isRecycled()) {
cacheBitmap.recycle();
cacheBitmap = null;
}
cacheCanvas = null;
}
cacheBitmap = Bitmap.createBitmap(view_base_width, bitmapHeight * 2, Bitmap.Config.ARGB_8888);
if (cacheCanvas == null) {
cacheCanvas = new Canvas();
cacheCanvas.setBitmap(cacheBitmap);
}
/**
* 画背景
*/
RectF r = new RectF();
r.left = 0;
r.top = bitmapHeight;
r.right = view_base_width;
r.bottom = bitmapWidth + 10;
cacheCanvas.drawRoundRect(r, 5f, 5f, backgroundPaint);
if (progress > 0) {
LinearGradient lg = new LinearGradient(0, 0, view_width, bitmapWidth, DEFAULT_START_COLOR, DEFAULT_END_COLOR, Shader.TileMode.CLAMP);
progressPaint.setShader(lg);
RectF r1 = new RectF();
r.left = 0;
r.top = bitmapHeight;
r.right = view_width;
r.bottom = bitmapWidth + 10;
cacheCanvas.drawRoundRect(r, 5f, 5f, progressPaint);
cacheCanvas.drawBitmap(bitmap, view_width - bitmapWidth+8, bitmapHeight / 2 + 6, new Paint());
}
invalidate();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint bmpPaint = new Paint();
//将cacheBitmap绘制到该View组件
if (cacheBitmap != null) {
canvas.drawBitmap(cacheBitmap, 0, 0, bmpPaint);
}
view_edge_width = this.getWidth();
Log.e("打出来看看控件的宽度:", view_edge_width + "");
init(progress);
}
}

3. 布局文件部分

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.susan.project.myapplication.ProgressSeek
android:id="@+id/progress"
android:layout_width="match_parent"
android:layout_height="80dp">
</com.susan.project.myapplication.ProgressSeek>
<com.susan.project.myapplication.ProgressSeek
android:id="@+id/progress1"
android:layout_width="match_parent"
android:layout_height="80dp">
</com.susan.project.myapplication.ProgressSeek>
<com.susan.project.myapplication.ProgressSeek
android:id="@+id/progress2"
android:layout_width="match_parent"
android:layout_height="80dp">
</com.susan.project.myapplication.ProgressSeek>
<com.susan.project.myapplication.ProgressSeek
android:id="@+id/progress3"
android:layout_width="match_parent"
android:layout_height="80dp">
</com.susan.project.myapplication.ProgressSeek>
</LinearLayout>

4.Activity部分

package com.susan.project.myapplication;
import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity {
private ProgressSeek progress;
private ProgressSeek progress1;
private ProgressSeek progress2;
private ProgressSeek progress3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
progress = (ProgressSeek) findViewById(R.id.progress);
progress.init(0);
progress1 = (ProgressSeek) findViewById(R.id.progress1);
progress1.init(2);
progress2 = (ProgressSeek) findViewById(R.id.progress2);
progress2.init(50);
progress3 = (ProgressSeek) findViewById(R.id.progress3);
progress3.init(100);
}
}

以上所述是小编给大家介绍的Android自定义带水滴的进度条样式(带渐变色效果),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索android
, 渐变进度条
水滴渐变
安卓自定义进度条样式、qt自定义进度条样式、自定义进度条样式、水滴渐变、android 进度条渐变色,以便于您获取更多的相关知识。

时间: 2024-12-05 10:48:31

Android自定义带水滴的进度条样式(带渐变色效果)_Android的相关文章

Android中自定义水平进度条样式之黑色虚线_Android

以下内容给大家介绍Android中自定义水平进度条样式之黑色虚线,对代码实现方法感兴趣的朋友一起学习吧. 布局layout中使用: <ProgressBar android:id="@+id/progress_bar" style="?android:attr/progressBarStyleHorizontal" <!--必须设置为水平--> android:progressDrawable="@drawable/myprogress&

Android 自定义View时使用TypedArray配置样式属性详细介绍_Android

 Android 自定义View时使用TypedArray配置样式属性详细介绍       在自定义view时为了提高复用性和扩展性,可以为自定义的view添加样式属性的配置,比如自定义图片资源.文字大小.控件属性等,就这需要用到TypedArray类,下面以一个自定义的可点击扩展和收缩的TextView为例记录下这个类的简单使用. 先上效果图: 点击以后为 再贴代码: 1.自定义view类: /** * @title ExpandTextView * @description 可扩展TextV

Android自定义View之圆形进度条总结

最近撸了一个圆形进度条的开源项目,算是第一次完完整整的使用自定义 View .在此对项目开发思路做个小结,欢迎大家 Star 和 Fork. 该项目总共实现了三种圆形进度条效果 CircleProgress:圆形进度条,可以实现仿 QQ 健康计步器的效果,支持配置进度条背景色.宽度.起始角度,支持进度条渐变 DialProgress:类似 CircleProgress,但是支持刻度 WaveProgress:实现了水波纹效果的圆形进度条,不支持渐变和起始角度配置,如需此功能可参考 CircleP

Android自定义view之圆形进度条

本节介绍自定义view-圆形进度条 思路: 根据前面介绍的自定义view内容可拓展得之: 1:新建类继承自View 2:添加自定义view属性 3:重写onDraw(Canvas canvas) 4:实现功能 下面上代码 1.自定义view代码: public class CustomView extends View { //背景圆环颜色 private int circleColor; //进度条颜色&字体颜色(为了美观,所以设计字体颜色和进度条颜色值一致) private int seco

Android 自定义漂亮的圆形进度条

这几天对Android中实现画圆弧及圆弧效果中所实现的效果进行了修改,改为进度圆心进度条,效果如图所示   TasksCompletedView.java 代码如下 import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.RectF; im

Android自定义View之圆形进度条式按钮_Android

介绍 今天上班的时候有个哥们问我怎么去实现一个按钮式的进度条,先来看看他需要实现的效果图. 和普通的圆形进度条类似,只是中间的地方有两个状态表示,未开始,暂停状态.而且他说圆形进度的功能已经实现了.那么我们只需要对中间的两个状态做处理就行了. 先来看看实现的效果图: 上面说了我们只需要处理中间状态的变化就可以了,对于进度的处理直接使用了弘洋文章中实现: http://blog.csdn.net/lmj623565791/article/details/43371299 下面开始具体实现. 具体实

Android自定义View之圆形进度条式按钮

介绍 今天上班的时候有个哥们问我怎么去实现一个按钮式的进度条,先来看看他需要实现的效果图. 和普通的圆形进度条类似,只是中间的地方有两个状态表示,未开始,暂停状态.而且他说圆形进度的功能已经实现了.那么我们只需要对中间的两个状态做处理就行了. 先来看看实现的效果图: 上面说了我们只需要处理中间状态的变化就可以了,对于进度的处理直接使用了弘洋文章中实现: http://blog.csdn.net/lmj623565791/article/details/43371299 下面开始具体实现. 具体实

Android自定义漂亮的圆形进度条

这几天对Android中实现画圆弧及圆弧效果中所实现的效果进行了修改,改为进度圆心进度条,效果如图所示 TasksCompletedView.java 代码如下 import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.RectF; impo

我的Android进阶之旅------&amp;gt;Android自定义View实现带数字的进度条(NumberProgressBar)

今天在Github上面看到一个来自于 daimajia所写的关于Android自定义View实现带数字的进度条(NumberProgressBar)的精彩案例,在这里分享给大家一起来学习学习!同时感谢daimajia的开源奉献! 第一步.效果展示 图1.蓝色的进度条 图2.红色的进度条 图3.多条颜色不同的进度条 图4.多条颜色不同的进度条 版权声明:本文为[欧阳鹏]原创文章,欢迎转载,转载请注明出处! [http://blog.csdn.net/ouyang_peng/article/deta