最近项目上用到一个密码加锁功能,需要一个数字密码界面,就想着封装成一个视图来方便管理和使用。
废话不多说,先上最终效果图:
<>强思路
整体可分为2个部分来实现,1。顶部是4个密码位的填充;2。数字键盘部分。整体可以是一个纵向LinearLayout, 4个密码位用横向LinearLayout即可,键盘由于是宫格形式,因此可用GridLayout来布局。由于密码位和键盘数字都是以圆圈为背景,这里采用自定义一个圆形背景ImageView来使用。
<>强实现
首先定义一个圆形背景的ImageView,由于最终实现的效果是点击的时候要填充圆背景,非点击状态下是空心圆,因此可通过改变画的风格来动态更改显示:
/* *
*圆形背景ImageView(设置实心或空心)
*/公开课CircleImageView延伸ImageView {
私人油漆mPaint;
私人int mWidth;
私人int mHeight;
公共CircleImageView(上下文语境){
这(上下文,null);
}
公共CircleImageView(上下文语境,AttributeSet attrs) {
这(上下文、attrs 0);
}
公共CircleImageView(上下文语境、AttributeSet attrs int defStyleAttr) {
超级(上下文、attrs defStyleAttr);
initView(上下文);
}
公共空间initView(上下文语境){
mPaint=new油漆();
mPaint.setStyle (Paint.Style.STROKE);
mPaint.setColor (mPanelColor);
mPaint.setStrokeWidth (mStrokeWidth);
mPaint.setAntiAlias(真正的);
}
@Override
保护空白>
inputResultView=new LinearLayout(上下文);
for (int i=0;i<4;我+ +){
CircleImageView mResultItem=new CircleImageView(上下文);
mResultIvList.add (mResultItem);
LinearLayout。LayoutParams params=新LinearLayout。LayoutParams (mResultIvRadius mResultIvRadius);
参数个数。leftMargin=dip2px(上下文,4);
参数个数。rightMargin=dip2px(上下文,4);
mResultItem。setPadding (dip2px(上下文,2),dip2px(上下文,2),dip2px(上下文,2),dip2px(上下文,2));
mResultItem.setLayoutParams (params);
inputResultView.addView (mResultItem);
}
LinearLayout。LayoutParams params=new LinearLayout.LayoutParams (ViewGroup.LayoutParams。WRAP_CONTENT ViewGroup.LayoutParams.WRAP_CONTENT);
参数个数。重力=Gravity.CENTER_HORIZONTAL;
参数个数。页下空白=dip2px(上下文,34);
inputResultView.setLayoutParams (params);
addView (inputResultView);之前
接着添加数字键盘部分的布局:
GridLayout numContainer=new GridLayout(上下文);
numContainer.setColumnCount (3);
for (int i=0;iAndroid自定义观点实现数字密码锁
