电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術文章
文章詳情頁

Android實現類似ios滑動按鈕

瀏覽:79日期:2022-09-17 09:14:22

IOS的滑動按鈕菜單在UI設計里面絕對堪稱一絕,在學習了Android的自定義view后,我萌生了模仿它的想法。

Android實現類似ios滑動按鈕

Android實現類似ios滑動按鈕

實現上面的模擬需要自定義一個View;

1)、在View的OnDraw里畫出圓角矩形,分別為灰色圓角矩形,紅色圓角矩形,和綠色圓角矩形。然后計算相應的位置。

2)、本例中的寬高比為1:0.65,內部紅色矩形尺寸為外部矩形尺寸0.9,內部的圓的半徑為外部高的0.45倍。按照這個比例計算相應的坐標。

3)、本例中的動畫是用ValueAnimation實現的,具體實現在下部代碼中。

4)、本例中的透明度實現方法和運動動畫一樣。

5)、自定義View為外部提供了讀取和修改內部狀態的接口。

具體代碼如下,

1、界面的XML代碼:

<?xml version='1.0' encoding='utf-8'?><RelativeLayout xmlns:android='http://schemas.android.com/apk/res/android' xmlns:tools='http://schemas.android.com/tools' android: android:layout_width='match_parent' android:layout_height='match_parent' android:paddingBottom='@dimen/activity_vertical_margin' android:paddingLeft='@dimen/activity_horizontal_margin' android:paddingRight='@dimen/activity_horizontal_margin' android:paddingTop='@dimen/activity_vertical_margin' tools:context='com.example.app_switchbutton.SwitchButtonActivity'> <com.example.app_switchbutton.switchbutton android: android:layout_width='wrap_content' android:layout_height='wrap_content' android:layout_alignParentTop='true' android:layout_alignParentStart='true' /> <com.example.app_switchbutton.switchbutton android:layout_width='100dp' android:layout_height='wrap_content' android:layout_centerHorizontal='true' android:layout_alignParentBottom='true'/> </RelativeLayout>

2、實現自定義view的java代碼:

package com.example.app_switchbutton; import android.animation.ValueAnimator;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Rect;import android.graphics.RectF;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import android.widget.RadioButton; /** * Created by 盡途 on 2017/4/26. */ public class switchbutton extends View { private int widthSize; private int heightSize; private boolean isOn=false; private float WhiteRoundRect_width,WhiteRoundRect_height; private float Circle_X,Circle_Y,WhiteRoundRect_X,WhiteRoundRect_Y; private float Radius; private float currentValue; private int currentAlphaofGreen,currentAlphaofGray; public switchbutton(Context context){ super(context); } public switchbutton(Context context, AttributeSet attributeSet){ super(context,attributeSet); setLayerType(LAYER_TYPE_SOFTWARE,null); initData(); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { widthSize=MeasureSpec.getSize(widthMeasureSpec); heightSize=(int)(widthSize*0.65f); setMeasuredDimension(widthSize,heightSize); initData(); } void initData(){ if (isOn){ currentValue=widthSize-0.5f*heightSize; currentAlphaofGreen=255; currentAlphaofGray=0; } else { currentValue=0.5f*heightSize; currentAlphaofGreen=0; currentAlphaofGray=255; } } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if (isOn){ DrawBackGreenRoundRect(canvas); DrawCircle(canvas); } else { DrawBackGrayRoundRect(canvas); DrawBackWhiteRoundRect(canvas); DrawCircle(canvas); } } private void DrawBackGrayRoundRect(Canvas canvas){ Paint paint0=new Paint(); paint0.setStyle(Paint.Style.FILL); paint0.setColor(Color.GRAY); paint0.setAntiAlias(true); paint0.setAlpha(currentAlphaofGray); RectF roundRect=new RectF(0,0,widthSize,heightSize); canvas.drawRoundRect(roundRect,heightSize*0.5f,heightSize*0.5f,paint0); } private void DrawBackGreenRoundRect(Canvas canvas){ Paint paint1=new Paint(); paint1.setStyle(Paint.Style.FILL); paint1.setColor(Color.GREEN); paint1.setAntiAlias(true); paint1.setAlpha(currentAlphaofGreen); RectF roundRect=new RectF(0,0,widthSize,heightSize); canvas.drawRoundRect(roundRect,heightSize*0.5f,heightSize*0.5f,paint1); } private void DrawCircle(Canvas canvas){ Circle_Y=heightSize*0.5f; Radius=heightSize*0.45f; Paint paint2=new Paint(); paint2.setStyle(Paint.Style.FILL); paint2.setColor(Color.WHITE); paint2.setAntiAlias(true); canvas.drawCircle(currentValue,Circle_Y,Radius,paint2); } private void DrawBackWhiteRoundRect(Canvas canvas){ Paint paint3=new Paint(); paint3.setStyle(Paint.Style.FILL); paint3.setColor(Color.RED); paint3.setAntiAlias(true); paint3.setAlpha(currentAlphaofGray); WhiteRoundRect_X=heightSize*0.05f; WhiteRoundRect_Y=heightSize*0.05f; WhiteRoundRect_width=widthSize-0.05f*heightSize; WhiteRoundRect_height=heightSize*0.95f; RectF rectf=new RectF(WhiteRoundRect_X,WhiteRoundRect_Y,WhiteRoundRect_width,WhiteRoundRect_height); canvas.drawRoundRect(rectf,WhiteRoundRect_height*0.5f,WhiteRoundRect_height*0.5f,paint3); } /** * 添加了過渡值動畫,實現了平緩運動 * @param startValue * @param endValue */ private void setAnimation(float startValue,float endValue){ ValueAnimator valueAnimator=ValueAnimator.ofFloat(startValue,endValue); valueAnimator.setDuration(1500); valueAnimator.setTarget(currentValue); valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) {currentValue=(float)animation.getAnimatedValue();invalidate(); } }); valueAnimator.start(); } private void setAlphaAnimationofGray(int startValue,int endValue){ ValueAnimator valueAnimator=ValueAnimator.ofInt(startValue,endValue); valueAnimator.setDuration(1500); valueAnimator.setTarget(currentAlphaofGray); valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) {currentAlphaofGray=(int)animation.getAnimatedValue();invalidate(); } }); valueAnimator.start(); } private void setAlphaAnimationofGreen(int startValue,int endValue){ ValueAnimator valueAnimator=ValueAnimator.ofInt(startValue,endValue); valueAnimator.setDuration(1500); valueAnimator.setTarget(currentAlphaofGreen); valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) {currentAlphaofGreen=(int)animation.getAnimatedValue();invalidate(); } }); valueAnimator.start(); } @Override public boolean onTouchEvent(MotionEvent event) { switch (event.getAction()){ case MotionEvent.ACTION_DOWN:return true; case MotionEvent.ACTION_MOVE:return false; case MotionEvent.ACTION_UP:isOn=!isOn;invalidate();break; default:break; } if (isOn){ float startCircle_X=0.5f*heightSize; float endCircle_X=widthSize-0.5f*heightSize; setAnimation(startCircle_X,endCircle_X); setAlphaAnimationofGray(255,0); setAlphaAnimationofGreen(0,255); }else { float startCircle_X=widthSize-0.5f*heightSize; float endCircle_X=heightSize*0.5f; setAnimation(startCircle_X,endCircle_X); setAlphaAnimationofGray(0,255); setAlphaAnimationofGreen(255,0); } return super.onTouchEvent(event); } public void writeSwitchButtonState(boolean isOn){ this.isOn=isOn; } public boolean readSwitchButtonState(){ return isOn; }}

模仿的不是很到位,請大家見諒。

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持好吧啦網。

標簽: IOS
相關文章:
主站蜘蛛池模板: 橡胶粉碎机_橡胶磨粉机_轮胎粉碎机_轮胎磨粉机-河南鼎聚重工机械制造有限公司 | 合肥制氮机_合肥空压机厂家_安徽真空泵-凯圣精机 | 广州展览设计公司_展台设计搭建_展位设计装修公司-众派展览装饰 广州展览制作工厂—[优简]直营展台制作工厂_展会搭建资质齐全 | 防火板_饰面耐火板价格、厂家_品牌认准格林雅 | 全自动端子机|刺破式端子压接机|全自动双头沾锡机|全自动插胶壳端子机-东莞市傅氏兄弟机械设备有限公司 | 电磁流量计_智能防腐防爆管道式计量表-金湖凯铭仪表有限公司 | 耐高温风管_耐高温软管_食品级软管_吸尘管_钢丝软管_卫生级软管_塑料波纹管-东莞市鑫翔宇软管有限公司 | 硬齿面减速机_厂家-山东安吉富传动设备股份有限公司 | 广东教师资格网-广东教师资格证考试网 | 发光字|标识设计|标牌制作|精神堡垒 - 江苏苏通广告有限公司 | 免联考国际MBA_在职MBA报考条件/科目/排名-MBA信息网 | 木材烘干机,木炭烘干机,纸管/佛香烘干设备-河南蓝天机械制造有限公司 | 焊缝跟踪系统_激光位移传感器_激光焊缝跟踪传感器-创想智控 | 步进电机_agv电机_伺服马达-伺服轮毂电机-和利时电机 | 3A别墅漆/3A环保漆_广东美涂士建材股份有限公司【官网】 | 冷却塔降噪隔音_冷却塔噪声治理_冷却塔噪音处理厂家-广东康明冷却塔降噪厂家 | LED投光灯-工矿灯-led路灯头-工业灯具 - 山东普瑞斯照明科技有限公司 | 防爆型气象站_农业气象站_校园气象站_农业四情监测系统「山东万象环境科技有限公司」 | 压力控制器,差压控制器,温度控制器,防爆压力控制器,防爆温度控制器,防爆差压控制器-常州天利智能控制股份有限公司 | 陕西高职单招-陕西高职分类考试网| 涂层测厚仪_光泽度仪_uv能量计_紫外辐照计_太阳膜测试仪_透光率仪-林上科技 | 神超官网_焊接圆锯片_高速钢锯片_硬质合金锯片_浙江神超锯业制造有限公司 | 礼仪庆典公司,礼仪策划公司,庆典公司,演出公司,演艺公司,年会酒会,生日寿宴,动工仪式,开工仪式,奠基典礼,商务会议,竣工落成,乔迁揭牌,签约启动-东莞市开门红文化传媒有限公司 | 低温等离子清洗机(双气路进口)-嘉润万丰 | 气力输送_输送机械_自动化配料系统_负压吸送_制造主力军江苏高达智能装备有限公司! | 老城街小面官网_正宗重庆小面加盟技术培训_特色面馆加盟|牛肉拉面|招商加盟代理费用多少钱 | 赛尔特智能移动阳光房-阳光房厂家-赛尔特建筑科技(广东)有限公司 | 优考试_免费在线考试系统_培训考试系统_题库系统_组卷答题系统_匡优考试 | 芜湖厨房设备_芜湖商用厨具_芜湖厨具设备-芜湖鑫环厨具有限公司 控显科技 - 工控一体机、工业显示器、工业平板电脑源头厂家 | 超声波清洗机_细胞破碎仪_实验室超声仪器_恒温水浴-广东洁盟深那仪器 | 磁力链接搜索神器_BT磁力狗_CILIMAO磁力猫_高效磁力搜索引擎2024 | 数码管_LED贴片灯_LED数码管厂家-无锡市冠卓电子科技有限公司 | 涡轮流量计_LWGY智能气体液体电池供电计量表-金湖凯铭仪表有限公司 | 防潮防水通风密闭门源头实力厂家 - 北京酷思帝克门窗 | 金环宇|金环宇电线|金环宇电缆|金环宇电线电缆|深圳市金环宇电线电缆有限公司|金环宇电缆集团 | 真石漆,山东真石漆,真石漆厂家,真石漆价格-山东新佳涂料有限公司 | 电缆桥架生产厂家_槽式/梯式_热镀锌线槽_广东东莞雷正电气 | 合肥展厅设计-安徽展台设计-合肥展览公司-安徽奥美展览工程有限公司 | 铝箔袋,铝箔袋厂家,东莞铝箔袋,防静电铝箔袋,防静电屏蔽袋,防静电真空袋,真空袋-东莞铭晋让您的产品与众不同 | 空调风机,低噪声离心式通风机,不锈钢防爆风机,前倾皮带传动风机,后倾空调风机-山东捷风风机有限公司 | NM-02立式吸污机_ZHCS-02软轴刷_二合一吸刷软轴刷-厦门地坤科技有限公司 |