通過自定義view實(shí)現(xiàn)仿iOS實(shí)現(xiàn)滑動兩端的點(diǎn)選擇時間的效果
創(chuàng)新互聯(lián)主營崆峒網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,手機(jī)APP定制開發(fā),崆峒h5重慶小程序開發(fā)公司搭建,崆峒網(wǎng)站營銷推廣歡迎崆峒等地區(qū)企業(yè)咨詢
效果圖
自定義的view代碼
public class Ring_Slide2 extends View { private static final double RADIAN = 180 / Math.PI; private int max_progress; // 設(shè)置最大進(jìn)度 private int cur_progress; //設(shè)置錨點(diǎn)1當(dāng)前進(jìn)度 private int cur_progress2; //設(shè)置錨點(diǎn)2進(jìn)度 private int bottom_color;//設(shè)置底色 private int circle_color; //設(shè)置圓的顏色(錨點(diǎn)) private int slide_color; //設(shè)置滑動過的顏色 private float ring_width; //圓環(huán)的寬度 private double cur_Angle; //當(dāng)前錨點(diǎn)1旋轉(zhuǎn)角度 private double cur_Angle2; //當(dāng)前錨點(diǎn)2的旋轉(zhuǎn)角度 private float ring_Radius;//圓環(huán)的半徑 private final int[] arrColorCircle = new int[]{0xFFFFde37, 0xFFFFa400}; private int main_width; //圓的寬度 private float mWheelCurX, mWheelCurY; //圓的位置 private float mWheelCurX2, mWheelCurY2; //圓2的位置 private Paint circle_Paint; //圓環(huán)的畫筆 private Paint select_Paint;//選中的畫筆 private Paint dot1; //圓點(diǎn)1 private Paint dot2; //圓點(diǎn)2 private Context context; private OnSeekBarChangeListener changeListener,changeListener2; public Ring_Slide2(Context context) { this(context,null); } public Ring_Slide2(Context context, AttributeSet attrs) { this(context, attrs,0); } public Ring_Slide2(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); this.context=context; initAttrs(attrs,defStyleAttr); initPadding(); //初始化畫筆 initPaints(); } //初始化屬性 private void initAttrs(AttributeSet attrs, int defStyle){ TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.Cricle_slide, defStyle, 0); max_progress=typedArray.getInt(R.styleable.Cricle_slide_max_progress,720); cur_progress=typedArray.getInt(R.styleable.Cricle_slide_cur_progress,420); cur_progress2=typedArray.getInt(R.styleable.Cricle_slide_cur_progress2,540); if (cur_progress > max_progress) cur_progress = max_progress; if (cur_progress2 > max_progress) cur_progress2 = max_progress; Bitmap bitmap = BitmapFactory.decodeResource(context.getResources(), R.mipmap.select_sun_bg2); main_width= bitmap.getWidth(); ring_width=typedArray.getFloat(R.styleable.Cricle_slide_Ring_Width,main_width); bottom_color=typedArray.getColor(R.styleable.Cricle_slide_bottom_color,getColor(R.color.select_main_bg_color)); circle_color=typedArray.getColor(R.styleable.Cricle_slide_circle_color,getColor(R.color.duration)); slide_color=typedArray.getColor(R.styleable.Cricle_slide_slide_color,getColor(R.color.time)); typedArray.recycle(); } //初始化邊距 private void initPadding(){ int paddingLeft = getPaddingLeft(); int paddingTop = getPaddingTop(); int paddingRight = getPaddingRight(); int paddingBottom = getPaddingBottom(); int paddingStart = 0, paddingEnd = 0; if (Build.VERSION.SDK_INT >= 17) { paddingStart = getPaddingStart(); paddingEnd = getPaddingEnd(); } int maxPadding = Math.max(paddingLeft, Math.max(paddingTop, Math.max(paddingRight, Math.max(paddingBottom, Math.max(paddingStart, paddingEnd))))); setPadding(maxPadding, maxPadding, maxPadding, maxPadding); } private void initPaints(){ /* 圓環(huán)的畫筆 */ circle_Paint=new Paint(Paint.ANTI_ALIAS_FLAG); circle_Paint.setAntiAlias(true); circle_Paint.setColor(bottom_color); circle_Paint.setStyle(Paint.Style.STROKE); circle_Paint.setStrokeWidth(ring_width); /* 選中區(qū)域的畫筆 */ select_Paint=new Paint(Paint.ANTI_ALIAS_FLAG); select_Paint.setShader(new SweepGradient(0, 0, arrColorCircle, null)); /*select_Paint.setColor(circle_color);*/ select_Paint.setAntiAlias(true); select_Paint.setStyle(Paint.Style.STROKE); select_Paint.setStrokeWidth(ring_width); // 畫錨點(diǎn) dot1 = new Paint(Paint.ANTI_ALIAS_FLAG); dot1.setColor(circle_color); dot1.setAntiAlias(true); dot1.setStyle(Paint.Style.FILL); // 畫錨點(diǎn)2 dot2 = new Paint(Paint.ANTI_ALIAS_FLAG); dot2.setColor(slide_color); dot2.setAntiAlias(true); dot2.setStyle(Paint.Style.FILL); } //獲取寬度 private float getDimen(int dimenId) { return getResources().getDimension(dimenId); } //獲取顏色 @TargetApi(Build.VERSION_CODES.M) private int getColor(int colorId) { final int version = Build.VERSION.SDK_INT; if (version >= 23) { return getContext().getColor(colorId); } else { return ContextCompat.getColor(getContext(), colorId); } } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); Bitmap bitmap = BitmapFactory.decodeResource(context.getResources(), R.mipmap.setalarm_colock_bg); int height = bitmap.getHeight()+main_width*2; int width = bitmap.getWidth()+main_width*2; int min = Math.min(height, width); setMeasuredDimension(min,min); initposition(); } private void initposition(){ //轉(zhuǎn)換為360度 cur_Angle=(double) cur_progress / max_progress*360.0; cur_Angle2=(double)cur_progress2 / max_progress*360.0; //計(jì)算初始化旋轉(zhuǎn)的角度 double cos = -Math.cos(Math.toRadians(cur_Angle)); double cos2 = -Math.cos(Math.toRadians(cur_Angle2)); //根據(jù)旋轉(zhuǎn)的角度來確定位置 MakeCurPosition(cos); MakeCurPosition2(cos2); //確定圓環(huán)的半徑 ring_Radius=(getMeasuredWidth() - getPaddingLeft() - getPaddingRight() - ring_width) / 2; } private void MakeCurPosition(double cos){ //根據(jù)旋轉(zhuǎn)的角度來確定圓的位置 //確定x點(diǎn)的坐標(biāo) mWheelCurX = calcXLocationInWheel(cur_Angle, cos); //確定y點(diǎn)的坐標(biāo) mWheelCurY=calcYLocationInWheel(cos); } private void MakeCurPosition2(double cos2){ //根據(jù)旋轉(zhuǎn)的角度來確定圓的位置 //確定x點(diǎn)的坐標(biāo) mWheelCurX2 = calcXLocationInWheel(cur_Angle2, cos2); //確定y點(diǎn)的坐標(biāo) mWheelCurY2=calcYLocationInWheel(cos2); } //確定x點(diǎn)的坐標(biāo) private float calcXLocationInWheel(double angle,double cos){ if (angle < 180) { return (float) (getMeasuredWidth() / 2 + Math.sqrt(1 - cos * cos) * ring_Radius); //Math.sqrt正平分根 9-3 } else { return (float) (getMeasuredWidth() / 2 - Math.sqrt(1 - cos * cos) * ring_Radius); } } //確定y點(diǎn)的坐標(biāo) private float calcYLocationInWheel(double cos) { return getMeasuredWidth() / 2 + ring_Radius * (float) cos; } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); float left = getPaddingLeft() + ring_width / 2; float top = getPaddingTop() + ring_width / 2; float right = canvas.getWidth() - getPaddingRight() - ring_width / 2; float bottom = canvas.getHeight() - getPaddingBottom() - ring_width / 2; float centerX = (left + right) / 2; float centerY = (top + bottom) / 2; float wheelRadius = (canvas.getWidth() - getPaddingLeft() - getPaddingRight()) / 2 - ring_width / 2; canvas.drawCircle(centerX, centerY, wheelRadius, circle_Paint); //畫選中區(qū)域 // canvas.drawArc(new RectF(left, top, right, bottom), (float) (Math.PI * RADIAN + Math.acos(cur_Angle) * RADIAN), (float) (Math.abs(cur_Angle-cur_Angle2)), false, select_Paint); Log.i("TAG","第一個的角度="+cur_Angle); Log.i("TAG","第一個的角度2="+cur_Angle2); float begin=0; //圓弧的起點(diǎn)位置 float stop=0; if(cur_Angle>180 && cur_Angle>cur_Angle2 ){ //180 -- 360 begin=(float) (-Math.abs(cur_Angle-360)-90); stop=(float) Math.abs(Math.abs(cur_Angle-360)+cur_Angle2); Log.i("TAG","begin="+begin); Log.i("TAG","stop="+stop); }else if(cur_Angle>cur_Angle2){ begin=(float) cur_Angle-90; stop=(float)(360-(cur_Angle-cur_Angle2)); }else { begin=(float) cur_Angle-90; stop=(float) Math.abs(cur_Angle-cur_Angle2); } canvas.drawArc(new RectF(left, top, right, bottom), begin,stop, false, select_Paint); //畫錨點(diǎn) 畫圓 canvas.drawCircle(mWheelCurX, mWheelCurY, ring_width/2, dot1); //畫錨點(diǎn) 畫圓 canvas.drawCircle(mWheelCurX2, mWheelCurY2, ring_width/2, dot2); Log.i("TAG","錨點(diǎn)1Y"+mWheelCurY+"錨點(diǎn)1X"+mWheelCurX); Log.i("TAG","錨點(diǎn)2Y"+mWheelCurY2+"錨點(diǎn)1X"+mWheelCurX2); } @Override public boolean onTouchEvent(MotionEvent event) { float x = event.getX(); float y = event.getY(); int flag=0; //判斷是否觸控到兩個點(diǎn)中的其中某個點(diǎn) if(isMovedot2(x,y)){ flag=2; }else if(isMovedot1(x,y)){ flag=1; } /* if(isMovedot1(x,y)){ flag=1; }else if(isMovedot2(x,y)){ flag=2; }*/ if(event.getAction()==MotionEvent.ACTION_MOVE || isMovedot1(x,y) ==true || isMovedot2(x,y)==true ){ Log.i("TAG","進(jìn)入X="+x+"進(jìn)入Y="+y); //通過觸摸點(diǎn)算出cos角度值 float cos = calculateCos(x, y); // 通過反三角函數(shù)獲得角度值 double angle; //獲取滑動的角度 if (x < getWidth() / 2) { // 滑動超過180度 angle = Math.PI * RADIAN + Math.acos(cos) * RADIAN; //通過計(jì)算得到滑動的角度值 } else { // 沒有超過180度 angle = Math.PI * RADIAN - Math.acos(cos) * RADIAN; //PI 周長比直徑 返回弧角度的余弦值 } if(flag==1){ cur_Angle=angle; cur_progress=getSelectedValue(cur_Angle); MakeCurPosition(cos); if (changeListener != null) { changeListener.onChanged(this, cur_progress); } }else if(flag==2){ cur_Angle2=angle; cur_progress2=getSelectedValue(cur_Angle2); MakeCurPosition2(cos); if (changeListener2 != null) { changeListener2.onChanged(this, cur_progress2); } } invalidate(); return true; }else { return super.onTouchEvent(event); } } private boolean isMovedot1(float x,float y){ float dot1x = Math.abs(mWheelCurX - x); float dot1y = Math.abs(mWheelCurY - y); if(dot1x<30 && dot1y<30){ return true; }else{ return false; } } private boolean isMovedot2(float x,float y){ float dot1x = Math.abs(mWheelCurX2 - x); float dot1y = Math.abs(mWheelCurY2 - y); if(dot1x<30 && dot1y<30){ return true; }else{ return false; } } //拿到切斜角的cos值 private float calculateCos(float x, float y){ float width = x - getWidth() / 2; float height = y - getHeight() / 2; float slope = (float) Math.sqrt(width * width + height * height); return height / slope; } private int getSelectedValue(double mCurAngle) { //角度轉(zhuǎn)進(jìn)度 return Math.round(max_progress * ((float) mCurAngle / 360)); //四舍五入 } public void setOnSeekBarChangeListener(OnSeekBarChangeListener listener) { changeListener = listener; } public void setOnSeekBarChangeListener2(OnSeekBarChangeListener listener) { changeListener2 = listener; } public void initRadian(int pro1,int pro2){ this.cur_progress=pro1; this.cur_progress2=pro2; invalidate(); } public interface OnSeekBarChangeListener { void onChanged(Ring_Slide2 seekbar, int curValue); } }
自定義stayle樣式,在values下新建sttrs.xml文件
//設(shè)置最大進(jìn)度 //設(shè)置當(dāng)前進(jìn)度 //設(shè)置當(dāng)前進(jìn)度 //設(shè)置底色 //設(shè)置圓的顏色 //設(shè)置滑動的顏色 //圓環(huán)的寬度 (dimension是代表尺寸值)
以上所述是小編給大家介紹的Android自定義View仿IOS圓盤時間選擇器,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對創(chuàng)新互聯(lián)網(wǎng)站的支持!