像游戏一样的进度条很常用到,我们简单制作如下:
(1)自定义控件:
package com.yiduoyun.tiku.view; import android.content.Context; import android.util.AttributeSet; import android.view.LayoutInflater; import android.view.View; import android.widget.FrameLayout; import android.widget.LinearLayout; import android.widget.TextView; import com.yiduoyun.tiku.R; import com.yiduoyun.tiku.util.CLog; /** * 条形进度条 * @author chenwenbiao * @date 2014-4-14 上午10:40:34 * @version V1.0 */ public class StripProgressBar extends FrameLayout{ private String TAG = getClass().getName(); private LinearLayout p1; private LinearLayout p2; private TextView textView; private float progressBarWidth = 0;//进度条的宽,使用这个宽来计算进度的 private String progressBarTips = null;//进度条上显示的字 private Context context = null; public StripProgressBar(Context context) { this(context , null , 0); } public StripProgressBar(Context context, AttributeSet attrs) { this(context , attrs , 0); } public StripProgressBar(Context context, AttributeSet attrs, int defStyle) { super(context , attrs, defStyle); this.context = context; // inflate(context, R.layout.strip_progress_barl, null); LayoutInflater.from(context).inflate(R.layout.strip_progress_bar,this,true); // TypedArray mTypedArray = context.obtainStyledAttributes(attrs, // R.styleable.StripProgressBar); // //获取自定义属性和默认值 // progressBarWidth = mTypedArray.getDimension(R.styleable.StripProgressBar_progressBarWidth, 200); // CLog.d(TAG , "====== StripProgressBar progressBarWidth======>" + progressBarWidth); // progressBarHeight = mTypedArray.getDimension(R.styleable.StripProgressBar_progressBarHeight, 40); // progressBarTips = mTypedArray.getString(R.styleable.StripProgressBar_progressTips); // mTypedArray.recycle(); // rootLayout = (RelativeLayout)findViewById(R.id.progress_bar1_root_layout); p1 = (LinearLayout)findViewById(R.id.strip_progress_bar1_layout); p2 = (LinearLayout)findViewById(R.id.strip_progress_bar2_layout); textView = (TextView)findViewById(R.id.strip_progress_text_tv); textView.setText(progressBarTips); } @Override public void onLayout(boolean changed, int left, int top, int right, int bottom){ super.onLayout(changed, left, top, right, bottom); progressBarWidth = p1.getWidth(); CLog.d(TAG , "====== onLayout progressBarWidth======>" + progressBarWidth); } @Override public void onWindowFocusChanged(boolean hasWindowFocus) { super.onWindowFocusChanged(hasWindowFocus); progressBarWidth = p1.getWidth(); CLog.d(TAG , "====== onWindowFocusChanged progressBarWidth======>" + progressBarWidth); } /** * 进度,从一到100数字来表示 * @param progress */ public void setProgress(int progress){ p2.setVisibility(View.VISIBLE); int w = (int) (progressBarWidth*progress/100.0); CLog.d(TAG , "======W=========>" + w); /** * 宽度太小,显示的圆弧就不成圆弧,所以这里搞一个最小值给它 */ CLog.d(TAG , "progress radius ==========> " + context.getResources().getDimension(R.dimen.progress_radius)); int min = (int) (context.getResources().getDimension(R.dimen.progress_radius) * 2); CLog.d(TAG , "min ==========> " + min); if( w < min / 2 ){//太小就不显示 w = 0; } else if(w < min) {//小于一半,不到一个最小长度,就设置成最小长度 w = min; } android.widget.RelativeLayout.LayoutParams params = (android.widget.RelativeLayout.LayoutParams)p2.getLayoutParams(); params.width = w; p2.setLayoutParams(params); } /** * 设置进度条显示的数字 * @param text */ public void setText(String text){ textView.setText(text); } }
(2)布局文件strip_progress_bar.xml:
<?xml version="1.0" encoding="utf-8"?> <!-- 条形进度条 --> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/progress_bar1_root_layout" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:background="#00000000" > <LinearLayout android:id="@+id/strip_progress_bar1_layout" android:layout_width="fill_parent" android:layout_height="20dp" android:background="@drawable/shape_progress_bar_1" android:orientation="horizontal" /> <LinearLayout android:id="@+id/strip_progress_bar2_layout" android:layout_width="fill_parent" android:layout_height="20dp" android:background="@drawable/shape_progress_bar_2" android:orientation="horizontal" android:visibility="invisible" /> <TextView android:id="@+id/strip_progress_text_tv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="Level:3" android:textColor="#fff" android:textSize="12sp" android:textStyle="bold" /> </RelativeLayout>
3 进度条背景shape_progress_bar_1.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 圆角 --> <corners android:radius="@dimen/progress_radius" /> <!-- 填充 --> <solid android:color="#ff098A82" /> <!-- 描边 --> <stroke android:width="2dp" android:color="#ff06674B" /> </shape>
4 进度条背景shape_progress_bar_2.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 圆角 --> <corners android:radius="@dimen/progress_radius" /> <!-- 填充 --> <!-- <solid android:color="#ffff9072" /> --> <!-- 渐变 --> <gradient android:startColor="#ffffcbbd" android:centerColor="#ffff653b" android:endColor="#ffffcbbd" android:angle="270" /> <!-- 描边 --> <stroke android:width="3dp" android:color="#008E8678" /> </shape>
5.dimens.xml
<resources> <dimen name="progress_radius">10dp</dimen> </resources>
6使用很简单:
<com.yiduoyun.tiku.view.StripProgressBar android:id="@+id/pb_exp" android:layout_width="100dp" android:layout_height="18dp" />
StripProgressBar pb_exp = (StripProgressBar) findViewById(R.id.pb_exp); pb_exp.setText("Level: " + level); //设置经验条中的等级信息 pb_exp.setProgress(PetExpAndLevelCount.getPercentFromExp(experience, level)); //设置当前进度
效果图如下: