Android 自定义带数字的圆形进度条和中间是文字的圆形进度条View

最新推荐文章于 2021-11-10 20:03:57 发布

ButterflyCabin

最新推荐文章于 2021-11-10 20:03:57 发布

阅读量4.6k

点赞数

分类专栏： Android 文章标签： Android Android自定义View

本文链接：https://blog.csdn.net/u013361668/article/details/50430174

版权

Android 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

这是一个自定义带数字的圆形进度条和中间是文字的圆形进度条View。自定义View的基本流程在这里就不多说了。（效果图在最后）

自定义View分好几种。我这个Demo主要用到了自己绘画的和组合的View。

首先看怎么自定义带数字的圆形进度条的View。注解读写在代码里了，在这里不多说。

类MyCirclePB自定义的View。具体代码如下：

package com.yehu.z01_circlepb;


import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.os.SystemClock;
import android.util.Log;
import android.view.View;
import android.widget.Toast;


import com.yehu.z01_circlepb.My_Cricle.My_CricleListern;


public class MainActivity extends Activity {


<span style="white-space:pre">	</span>private My_Cricle my_Cricle;
<span style="white-space:pre">	</span>private MyCirclePB myCirclePB;
<span style="white-space:pre">	</span>String[] strs = { "从未超越", "超越自我", "旗鼓相当" };


<span style="white-space:pre">	</span>@Override
<span style="white-space:pre">	</span>protected void onCreate(Bundle savedInstanceState) {
<span style="white-space:pre">		</span>super.onCreate(savedInstanceState);
<span style="white-space:pre">		</span>setContentView(R.layout.activity_main);
<span style="white-space:pre">		</span>// 圆形进条
<span style="white-space:pre">		</span>myCirclePB = (MyCirclePB) findViewById(R.id.my_criclePB);
<span style="white-space:pre">		</span>myCirclePB.setOnClickListener(new View.OnClickListener() {


<span style="white-space:pre">			</span>@Override
<span style="white-space:pre">			</span>public void onClick(View v) {
<span style="white-space:pre">				</span>myCirclePB.setEnabled(false);
<span style="white-space:pre">				</span>new Thread() {
<span style="white-space:pre">					</span>public void run() {
<span style="white-space:pre">						</span>int n = 1000;
<span style="white-space:pre">						</span>myCirclePB.setMax(n);
<span style="white-space:pre">						</span>for (int i = 0; i <= n; i++) {
<span style="white-space:pre">							</span>Log.e("TAG", "download i=" + i);
<span style="white-space:pre">							</span>myCirclePB.setProgress(i);
<span style="white-space:pre">							</span>if (myCirclePB.getProgress() == myCirclePB.getMax()) {
<span style="white-space:pre">								</span>handler.sendEmptyMessage(2);
<span style="white-space:pre">							</span>}
<span style="white-space:pre">							</span>SystemClock.sleep(5);
<span style="white-space:pre">						</span>}
<span style="white-space:pre">					</span>};
<span style="white-space:pre">				</span>}.start();
<span style="white-space:pre">			</span>}
<span style="white-space:pre">		</span>});
<span style="white-space:pre">		</span>// 文本 圆形框
<span style="white-space:pre">		</span>my_Cricle = (My_Cricle) findViewById(R.id.my_cricle);
<span style="white-space:pre">		</span>my_Cricle.init_view();
<span style="white-space:pre">		</span>my_Cricle.setOnClickListener(new View.OnClickListener() {


<span style="white-space:pre">			</span>@Override
<span style="white-space:pre">			</span>public void onClick(View v) {
<span style="white-space:pre">				</span>my_Cricle.setEnabled(false);
<span style="white-space:pre">				</span>final MyCirclePB circlePB = (MyCirclePB) (((My_Cricle) v)
<span style="white-space:pre">						</span>.getMyCirclePB());
<span style="white-space:pre">				</span>new Thread() {
<span style="white-space:pre">					</span>public void run() {
<span style="white-space:pre">						</span>int n = 1000;
<span style="white-space:pre">						</span>circlePB.setMax(n);
<span style="white-space:pre">						</span>for (int i = 0; i <= n; i++) {
<span style="white-space:pre">							</span>Log.e("TAG", "download i=" + i);
<span style="white-space:pre">							</span>circlePB.setProgress(i);
<span style="white-space:pre">							</span>String str = null;
<span style="white-space:pre">							</span>Message msg = Message.obtain();
<span style="white-space:pre">							</span>if (circlePB.getProgress() < circlePB.getMax() / 3) {
<span style="white-space:pre">								</span>str = strs[0];


<span style="white-space:pre">								</span>msg.what = 3;
<span style="white-space:pre">							</span>} else if (circlePB.getProgress() < circlePB
<span style="white-space:pre">									</span>.getMax() * 2 / 3) {
<span style="white-space:pre">								</span>str = strs[1];
<span style="white-space:pre">								</span>msg.what = 4;
<span style="white-space:pre">							</span>} else {
<span style="white-space:pre">								</span>str = strs[2];
<span style="white-space:pre">								</span>msg.what = 5;
<span style="white-space:pre">							</span>}
<span style="white-space:pre">							</span>msg.obj = str;
<span style="white-space:pre">							</span>handler.sendMessage(msg);
<span style="white-space:pre">							</span>if (circlePB.getProgress() == circlePB.getMax()) {
<span style="white-space:pre">								</span>handler.sendEmptyMessage(1);
<span style="white-space:pre">							</span>}
<span style="white-space:pre">							</span>SystemClock.sleep(5);
<span style="white-space:pre">						</span>}
<span style="white-space:pre">					</span>};
<span style="white-space:pre">				</span>}.start();
<span style="white-space:pre">			</span>}
<span style="white-space:pre">		</span>});
<span style="white-space:pre">	</span>}


<span style="white-space:pre">	</span>private Handler handler = new Handler() {
<span style="white-space:pre">		</span>public void handleMessage(android.os.Message msg) {
<span style="white-space:pre">			</span>String str = (String) msg.obj;
<span style="white-space:pre">			</span>int flag = msg.what;
<span style="white-space:pre">			</span>if (flag == 1) {
<span style="white-space:pre">				</span>my_Cricle.setEnabled(true);
<span style="white-space:pre">			</span>} else if (flag == 2) {
<span style="white-space:pre">				</span>myCirclePB.setEnabled(true);
<span style="white-space:pre">			</span>} else if (flag == 3) {
<span style="white-space:pre">				</span>my_Cricle.getText2().setText(str);
<span style="white-space:pre">				</span>my_Cricle.getText2().setTextColor(0xffff0000);
<span style="white-space:pre">			</span>} else if (flag == 4) {
<span style="white-space:pre">				</span>my_Cricle.getText2().setText(str);
<span style="white-space:pre">				</span>my_Cricle.getText2().setTextColor(0xff0000ff);
<span style="white-space:pre">			</span>} else if (flag == 5) {
<span style="white-space:pre">				</span>my_Cricle.getText2().setText(str);
<span style="white-space:pre">				</span>my_Cricle.getText2().setTextColor(0xff00ff00);
<span style="white-space:pre">			</span>}
<span style="white-space:pre">		</span>};
<span style="white-space:pre">	</span>};


}

自定义带数字的圆形进度条View基本就完事了。写一个XML布局就可以使用了。在这里就不单个写了，布局都整合在一起了，后面补上。

这个是一个组合View。

先写布局吧！my_cricle.xml布局如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <com.yehu.z01_circlepb.MyCirclePB
        android:id="@+id/mycirlepb"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="5dp" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/text1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="aaa" />

        <TextView
            android:id="@+id/text2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:text="aaaa" />

        <TextView
            android:id="@+id/text3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="aaa" />
    </LinearLayout>

</RelativeLayout>

类My_Cricle具体代码如下：

package com.yehu.z01_circlepb;

import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.RelativeLayout;
import android.widget.TextView;

public class My_Cricle extends RelativeLayout {

	private Context context;
	private View v;
	private TextView text2;
	private MyCirclePB myCirclePB;

	public MyCirclePB getMyCirclePB() {
		return myCirclePB;
	}

	/**
	 * 这里写一些事件的回调
	 * @author sunmj
	 *
	 */
	public interface My_CricleListern {
		public void back(String name);
	}

	public My_Cricle(Context context) {
		this(context, null);
		init(context);
	}

	public My_Cricle(Context context, AttributeSet attrs) {
		super(context, attrs);
		init(context);

	}

	private void init(Context context) {
		// TODO Auto-generated method stub
		this.context = context;
		v = LayoutInflater.from(context).inflate(R.layout.my_cricle, this, true);
		text2 = (TextView) v.findViewById(R.id.text2);
	}

	/**
	 * 这个方法里面写一些配置的文件例如
	 */
	public void init_view() {
		myCirclePB = (MyCirclePB) v.findViewById(R.id.mycirlepb);
		int n = 100;
		myCirclePB.setMax(n);
		myCirclePB.setRoundColor(Color.GRAY);
		myCirclePB.setRoundProgressColor(Color.RED);
		myCirclePB.setRoundWidth(40);
		myCirclePB.setProgress(0);
		myCirclePB.setShowProgress(false);
		
	}
	
	public TextView getText2() {
		return text2;
	}

	//回调回去
	public void set_listern(My_CricleListern nCricleListern)
	{
		nCricleListern.back("1111");
	}
}

到这里基本就实现了带数字的圆形进度条，和中间是文字的圆形进度条。下面就是具体的使用了。

主布局activity_main.xml如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="圆形进度条"
        android:textSize="16sp" />

    <com.yehu.z01_circlepb.MyCirclePB
        android:id="@+id/my_criclePB"
        android:layout_width="240dp"
        android:layout_height="200dp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="圆形文本框"
        android:textSize="16sp" />

    <com.yehu.z01_circlepb.My_Cricle
        android:id="@+id/my_cricle"
        android:layout_width="180dp"
        android:layout_height="220dp" />

</LinearLayout>

类MainActivity具体代码如下：

package com.yehu.z01_circlepb;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.os.SystemClock;
import android.util.Log;
import android.view.View;
import android.widget.Toast;

import com.yehu.z01_circlepb.My_Cricle.My_CricleListern;

public class MainActivity extends Activity {

	private My_Cricle my_Cricle;
	private MyCirclePB myCirclePB;
	String[] strs = { "从未超越", "超越自我", "旗鼓相当" };

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		// 圆形进条
		myCirclePB = (MyCirclePB) findViewById(R.id.my_criclePB);
		myCirclePB.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				myCirclePB.setEnabled(false);
				new Thread() {
					public void run() {
						int n = 1000;
						myCirclePB.setMax(n);
						for (int i = 0; i <= n; i++) {
							Log.e("TAG", "download i=" + i);
							myCirclePB.setProgress(i);
							if (myCirclePB.getProgress() == myCirclePB.getMax()) {
								handler.sendEmptyMessage(2);
							}
							SystemClock.sleep(5);
						}
					};
				}.start();
			}
		});
		// 文本 圆形框
		my_Cricle = (My_Cricle) findViewById(R.id.my_cricle);
		my_Cricle.init_view();
		my_Cricle.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				my_Cricle.setEnabled(false);
				final MyCirclePB circlePB = (MyCirclePB) (((My_Cricle) v)
						.getMyCirclePB());
				new Thread() {
					public void run() {
						int n = 1000;
						circlePB.setMax(n);
						for (int i = 0; i <= n; i++) {
							Log.e("TAG", "download i=" + i);
							circlePB.setProgress(i);
							String str = null;
							Message msg = Message.obtain();
							if (circlePB.getProgress() < circlePB.getMax() / 3) {
								str = strs[0];

								msg.what = 3;
							} else if (circlePB.getProgress() < circlePB
									.getMax() * 2 / 3) {
								str = strs[1];
								msg.what = 4;
							} else {
								str = strs[2];
								msg.what = 5;
							}
							msg.obj = str;
							handler.sendMessage(msg);
							if (circlePB.getProgress() == circlePB.getMax()) {
								handler.sendEmptyMessage(1);
							}
							SystemClock.sleep(5);
						}
					};
				}.start();
			}
		});
	}

	private Handler handler = new Handler() {
		public void handleMessage(android.os.Message msg) {
			String str = (String) msg.obj;
			int flag = msg.what;
			if (flag == 1) {
				my_Cricle.setEnabled(true);
			} else if (flag == 2) {
				myCirclePB.setEnabled(true);
			} else if (flag == 3) {
				my_Cricle.getText2().setText(str);
				my_Cricle.getText2().setTextColor(0xffff0000);
			} else if (flag == 4) {
				my_Cricle.getText2().setText(str);
				my_Cricle.getText2().setTextColor(0xff0000ff);
			} else if (flag == 5) {
				my_Cricle.getText2().setText(str);
				my_Cricle.getText2().setTextColor(0xff00ff00);
			}
		};
	};

}

代码的不怎么简洁，一直在努力中……

具体的效果图如下：

ButterflyCabin

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
Android 自定义带数字的圆形进度条和中间是文字的圆形进度条View

这是一个自定义带数字的圆形进度条和中间是文字的圆形进度条View。自定义View的基本流程在这里就不多说了。（效果图在最后）自定义View分好几种。我这个Demo主要用到了自己绘画的和组合的View。首先看怎么自定义带数字的圆形进度条的View。注解读写在代码里了，在这里不多说。类MyCirclePB自定义的View。具体代码如下：package com.yehu.z01_circ
复制链接

扫一扫

专栏目录