需求:
在弹框中显示进度条,要求是显示进度,切进度也要随着滑动而滑动,样式需要自定义。
开发:
根据需求首先想到的是自定义seekbar,自定义样式如进度条的样式,原点的样式这些比较简单,网上也有很多,主要就是重新设置setProgressDrawable:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape>
<solid android:color="#ff51495e" />
</shape>
</item>
<item android:id="@android:id/secondaryProgress">
<clip>
<shape>
<solid android:color="#ff51495e" />
</shape>
</clip>
</item>
<item android:id="@android:id/progress">
<clip>
<shape>
<solid android:color="#ff996dfe" />
</shape>
</clip>
</item>
</layer-list>
重新设置圆圈:setThumb
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- 按下状态 --> <item android:drawable="@drawable/shape_seekbar" android:state_pressed="true" /> <!-- 焦点状态 --> <item android:drawable="@drawable/shape_seekbar" android:state_focused="true" /> <!-- 选择状态 --> <item android:drawable="@drawable/shape_seekbar" android:state_selected="true" /> <!-- 默认状态 --> <item android:drawable="@drawable/shape_seekbar" />
</selector>
这块比较容易些,主要是上方显示进度随着进度向右移动会难些,在网上也看到过有些自定义实现了,但很多是基于怎个屏幕宽度自定义的,通过屏幕宽度找出进度所在的x的数值,但现在是在dialog弹框上显示,所以就不能通过屏幕的宽度来定义,因为左右2边的空隙不好计算距离,也比较麻烦。
所以我的想法是:
private TextView mTvCurrent;
private TextView mTvMax;
private TextView mTvMin;
private SeekBar mSbProgress;
private int shapecircle;
private int back;
private int max;
private Context mcontext;
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser){
int w = mSbProgress.getMeasuredWidth()-WonderfulDpPxUtils.dip2px(mcontext, 10);
int twidth = mTvCurrent.getMeasuredWidth() / 2;
int left = (progress * w) / seekBar.getMax() - twidth;
int leftmargin = left < 0 ? 0 : left;
LayoutParams params = (LayoutParams) mTvCurrent.getLayoutParams();
params.leftMargin = leftmargin + WonderfulDpPxUtils.dip2px(mcontext, 10);
mTvCurrent.setLayoutParams(params);
mTvCurrent.setText(progress + "");
}
通过获取seekbar的宽度,然后计算出控件进度的长度,减去文字的一半就是文字距离seekbar左边的距离,然后设置文字距离左边框的距离从而定位文字的位置,需要注意的是,seekbar默认是有内边距的,所以在处理的时候需要减去左边距,我们最好自己设置内边距:
<SeekBar
android:id="@+id/sb_progress"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:max="100"
/>
这样的话就方便我们计算。