热门标签 | HotTags
当前位置:  开发笔记 > 运维 > 正文

Android自定义实现淘宝下拉刷新效果

这篇文章主要为大家详细介绍了Android自定义实现淘宝下拉刷新效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

概述

目前下拉刷新的样式是多饰多样,今天我们一起来自定义淘宝下拉刷新,其实淘宝下拉刷新比较的简单就是一个圆环和一个小箭头的显示和隐藏,那么先看看我们的实现的效果。


是不是和淘宝有点像呢?那么现在我们来看看如何实现这个效果。我们这里为了省事,提供了2张照片  第一是“随时随地,想淘就淘”的照片,第二种就是小箭头照片,这里就自己画了,主要就是实现那个圆弧的绘制和旋转动画了。首先说这里的下拉刷新我用的是比较有名的 https://github.com/chrisbanes/Android-PullToRefresh 这个大家肯定很熟悉了,这里我修改了这个库可以自定义头部和底部。

步骤:

1、自定义一个view。(包含圆弧的绘制和箭头的显示和隐藏)
2、自定义头部。

1)、创建attrs文件

 
     
     
     
     
   

2、创建一个类 TaoBaoView.class

public class TaoBaoView extends View{ 
 
 
  //圆环进度颜色 
  private int ringProgressColor; 
 
  //圆环的宽度 
  private float ringWidth; 
 
  //最大值 
  private int ringMax; 
 
  //中间的icon 
  private Bitmap ringImage; 
 
  //中间X坐标 
  private int centerX; 
 
  //中间Y坐标 
  private int centerY; 
 
  //画笔 
  private Paint mPaint; 
 
  //View宽度 
  private int width; 
 
  //View高度 
  private int height; 
 
  //进度 
  private int progress; 
 
  //半径 
  private int radius; 
 
  //是否显示图标 
  private boolean isShowIcon=true; 
 
 
  public TaoBaoView(Context context) { 
    this(context,null); 
  } 
 
  public TaoBaoView(Context context, AttributeSet attrs) { 
    this(context, attrs,0); 
  } 
 
  public TaoBaoView(Context context, AttributeSet attrs, int defStyleAttr) { 
    super(context, attrs, defStyleAttr); 
    TypedArray typedArray=context.obtainStyledAttributes(attrs, R.styleable.TaoBaoView); 
    ringProgressColor=typedArray.getColor(R.styleable.TaoBaoView_ringProgressColor, Color.GRAY); 
    ringWidth=typedArray.getDimension(R.styleable.TaoBaoView_ringWidth, 5); 
    ringMax=typedArray.getInteger(R.styleable.TaoBaoView_ringmax, 50); 
    ringImage= BitmapFactory.decodeResource(getResources(), 
        typedArray.getResourceId(R.styleable.TaoBaoView_ringImage,R.mipmap.jiantou)); 
    init(); 
 
  } 
 
  private void init() { 
    mPaint=new Paint(); 
  } 
 
 
  @Override 
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
 
    int widthMode=MeasureSpec.getMode(widthMeasureSpec); 
    int widthSize=MeasureSpec.getSize(widthMeasureSpec); 
    int heightMode=MeasureSpec.getMode(heightMeasureSpec); 
    int heightSize=MeasureSpec.getSize(heightMeasureSpec); 
 
    if(widthMode==MeasureSpec.AT_MOST)width=dp2px(30); 
    else width=widthSize; 
    if(heightMode==MeasureSpec.AT_MOST)height=dp2px(30); 
    else height=heightSize; 
    setMeasuredDimension(width,height); 
  } 
 
  @Override 
  protected void onLayout(boolean changed, int left, int top, int right, int bottom) { 
    super.onLayout(changed, left, top, right, bottom); 
    //获取中心点的位置 
    centerX=getWidth()/2; 
    centerY=getHeight()/2; 
    radius=(int) (centerX - ringWidth / 2); 
  } 
 
 
  @Override 
  protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
    super.onSizeChanged(w, h, oldw, oldh); 
    //确定View的宽高 
    width = w; 
    height = h; 
  } 
 
  @Override 
  public void draw(Canvas canvas) { 
    super.draw(canvas); 
 
    drawProgress(canvas); 
    drawImage(canvas); 
  } 
 
  /** 
   * 绘制图片 
   * @param canvas 
   */ 
  private void drawImage(Canvas canvas) { 
    if(isShowIcon) 
    canvas.drawBitmap(ringImage,centerX-ringImage.getWidth()/2,centerY-ringImage.getHeight()/2,mPaint); 
  } 
 
  /** 
   * 绘制进度条 
   * @param canvas 
   */ 
  private void drawProgress(Canvas canvas) { 
 
    mPaint.setAntiAlias(true); 
    mPaint.setColor(ringProgressColor); 
    mPaint.setStrokeWidth(ringWidth); 
    //设置画笔样式 
    mPaint.setStyle(Paint.Style.STROKE); 
    RectF rectF=new RectF(centerX-radius,centerY-radius,centerX+radius,centerY+radius); 
    //绘制圆弧 
    canvas.drawArc(rectF,-110,-360*progress/ringMax,false,mPaint); 
  } 
 
 
  /** 
   * dp转px 
   * @param dp 
   * @return 
   */ 
  public int dp2px(int dp){ 
    float density = getContext().getResources().getDisplayMetrics().density; 
    return (int) (dp * density + 0.5f); 
  } 
 
 
  /** 
   * 设置进度 
   * @param progress 
   */ 
  public synchronized void setProgress(int progress){ 
    if(progress<0){ 
      progress=0; 
    } 
    if(progress>=ringMax){ 
      progress=ringMax; 
    } 
    this.progress=progress; 
    postInvalidate(); 
  } 
 
 
  /** 
   * 设置是否显示图标 
   * @param isShow 
   */ 
  public synchronized void setIsShowIcon(boolean isShow){ 
    this.isShowIcon=isShow; 
  } 
} 

3、创建一个headerLayout  下拉刷新头部

public class HeaderLayout extends LoadingLayoutBase { 
 
  private Context mContext; 
  private RotateAnimation refreshingAnimation; 
  private TextView ring_refresh_status; 
  private TaoBaoView mTaoBaoView; 
  private LinearLayout header_base; 
  private LinearLayout header_layout; 
 
  public HeaderLayout(Context context) { 
    this(context, PullToRefreshBase.Mode.PULL_FROM_START); 
  } 
 
  public HeaderLayout(Context context, PullToRefreshBase.Mode mode) { 
    super(context); 
    init(context,mode); 
  } 
 
  private void init(Context mContext,PullToRefreshBase.Mode mode) { 
    this.mCOntext=mContext; 
    LayoutInflater.from(mContext).inflate(R.layout.taobao_view, this); 
    header_base=(LinearLayout)findViewById(R.id.header_base); 
    header_layout=(LinearLayout)findViewById(R.id.refresh_header_content); 
    mTaoBaoView=(TaoBaoView)findViewById(R.id.taobao_view); 
    ring_refresh_status=(TextView)findViewById(R.id.taobao_tv); 
    refreshingAnimation = (RotateAnimation) AnimationUtils.loadAnimation(mContext, R.anim.rotating); 
    LinearInterpolator lir = new LinearInterpolator(); 
    refreshingAnimation.setInterpolator(lir); 
    mTaoBaoView.setProgress(90); 
    LayoutParams lp = (LayoutParams) header_base.getLayoutParams(); 
    lp.gravity = mode == PullToRefreshBase.Mode.PULL_FROM_END &#63; Gravity.TOP : Gravity.BOTTOM; 
    reset(); 
  } 
 
  @Override 
  public int getContentSize() { 
    return header_layout.getHeight(); 
  } 
 
  /** 
   * 下拉可以刷新 
   */ 
  @Override 
  public void pullToRefresh() { 
    ring_refresh_status.setText("下拉刷新"); 
    mTaoBaoView.setIsShowIcon(true); 
  } 
 
  /** 
   * 松开后刷新 
   */ 
  @Override 
  public void releaseToRefresh() { 
    ring_refresh_status.setText("松开刷新"); 
    mTaoBaoView.setIsShowIcon(false); 
  } 
 
  /** 
   * 下拉中 
   * @param scaleOfLayout scaleOfLayout 
   */ 
  @Override 
  public void onPull(float scaleOfLayout) { 
    scaleOfLayout = scaleOfLayout > 1.0f &#63; 1.0f : scaleOfLayout; 
    int progress=(int) ((scaleOfLayout)*100); 
    mTaoBaoView.setProgress(progress>90&#63;90:progress); 
 
  } 
 
  /** 
   * 正在刷新 
   */ 
  @Override 
  public void refreshing() { 
    mTaoBaoView.setIsShowIcon(false); 
    ring_refresh_status.setText("正在刷新"); 
    mTaoBaoView.startAnimation(refreshingAnimation); 
  } 
 
  @Override 
  public void reset() { 
    mTaoBaoView.clearAnimation(); 
  } 
 
  @Override 
  public void setPullLabel(CharSequence pullLabel) { 
 
  } 
 
  @Override 
  public void setRefreshingLabel(CharSequence refreshingLabel) { 
 
  } 
 
  @Override 
  public void setReleaseLabel(CharSequence releaseLabel) { 
 
  } 
} 

4、在mainactivity中:

mPullToRefreshListView=(PullToRefreshListView)findViewById(R.id.list); 
mPullToRefreshListView.setHeaderLayout(new HeaderLayout(this)); 

附上github:https://github.com/dalong982242260/TaoBaoRefresh2

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
  • Centos7.6安装Gitlab教程及注意事项
    本文介绍了在Centos7.6系统下安装Gitlab的详细教程,并提供了一些注意事项。教程包括查看系统版本、安装必要的软件包、配置防火墙等步骤。同时,还强调了使用阿里云服务器时的特殊配置需求,以及建议至少4GB的可用RAM来运行GitLab。 ... [详细]
  • baresip android编译、运行教程1语音通话
    本文介绍了如何在安卓平台上编译和运行baresip android,包括下载相关的sdk和ndk,修改ndk路径和输出目录,以及创建一个c++的安卓工程并将目录考到cpp下。详细步骤可参考给出的链接和文档。 ... [详细]
  • XML介绍与使用的概述及标签规则
    本文介绍了XML的基本概念和用途,包括XML的可扩展性和标签的自定义特性。同时还详细解释了XML标签的规则,包括标签的尖括号和合法标识符的组成,标签必须成对出现的原则以及特殊标签的使用方法。通过本文的阅读,读者可以对XML的基本知识有一个全面的了解。 ... [详细]
  • Google Play推出全新的应用内评价API,帮助开发者获取更多优质用户反馈。用户每天在Google Play上发表数百万条评论,这有助于开发者了解用户喜好和改进需求。开发者可以选择在适当的时间请求用户撰写评论,以获得全面而有用的反馈。全新应用内评价功能让用户无需返回应用详情页面即可发表评论,提升用户体验。 ... [详细]
  • Java验证码——kaptcha的使用配置及样式
    本文介绍了如何使用kaptcha库来实现Java验证码的配置和样式设置,包括pom.xml的依赖配置和web.xml中servlet的配置。 ... [详细]
  • Android中高级面试必知必会,积累总结
    本文介绍了Android中高级面试的必知必会内容,并总结了相关经验。文章指出,如今的Android市场对开发人员的要求更高,需要更专业的人才。同时,文章还给出了针对Android岗位的职责和要求,并提供了简历突出的建议。 ... [详细]
  • 20211101CleverTap参与度和分析工具功能平台学习/实践
    1.应用场景主要用于学习CleverTap的使用,该平台主要用于客户保留与参与平台.为客户提供价值.这里接触到的原因,是目前公司用到该平台的服务~2.学习操作 ... [详细]
  • 如何用UE4制作2D游戏文档——计算篇
    篇首语:本文由编程笔记#小编为大家整理,主要介绍了如何用UE4制作2D游戏文档——计算篇相关的知识,希望对你有一定的参考价值。 ... [详细]
  • 安卓select模态框样式改变_微软Office风格的多端(Web、安卓、iOS)组件库——Fabric UI...
    介绍FabricUI是微软开源的一套Office风格的多端组件库,共有三套针对性的组件,分别适用于web、android以及iOS,Fab ... [详细]
  • 使用在线工具jsonschema2pojo根据json生成java对象
    本文介绍了使用在线工具jsonschema2pojo根据json生成java对象的方法。通过该工具,用户只需将json字符串复制到输入框中,即可自动将其转换成java对象。该工具还能解析列表式的json数据,并将嵌套在内层的对象也解析出来。本文以请求github的api为例,展示了使用该工具的步骤和效果。 ... [详细]
  • 推荐系统遇上深度学习(十七)详解推荐系统中的常用评测指标
    原创:石晓文小小挖掘机2018-06-18笔者是一个痴迷于挖掘数据中的价值的学习人,希望在平日的工作学习中,挖掘数据的价值, ... [详细]
  • 【MicroServices】【Arduino】装修甲醛检测,ArduinoDart甲醛、PM2.5、温湿度、光照传感器等,数据记录于SD卡,Python数据显示,UI5前台,微服务后台……
    这篇文章介绍了一个基于Arduino的装修甲醛检测项目,使用了ArduinoDart甲醛、PM2.5、温湿度、光照传感器等硬件,并将数据记录于SD卡,使用Python进行数据显示,使用UI5进行前台设计,使用微服务进行后台开发。该项目还在不断更新中,有兴趣的可以关注作者的博客和GitHub。 ... [详细]
  • 自动轮播,反转播放的ViewPagerAdapter的使用方法和效果展示
    本文介绍了如何使用自动轮播、反转播放的ViewPagerAdapter,并展示了其效果。该ViewPagerAdapter支持无限循环、触摸暂停、切换缩放等功能。同时提供了使用GIF.gif的示例和github地址。通过LoopFragmentPagerAdapter类的getActualCount、getActualItem和getActualPagerTitle方法可以实现自定义的循环效果和标题展示。 ... [详细]
  • 如何在服务器主机上实现文件共享的方法和工具
    本文介绍了在服务器主机上实现文件共享的方法和工具,包括Linux主机和Windows主机的文件传输方式,Web运维和FTP/SFTP客户端运维两种方式,以及使用WinSCP工具将文件上传至Linux云服务器的操作方法。此外,还介绍了在迁移过程中需要安装迁移Agent并输入目的端服务器所在华为云的AK/SK,以及主机迁移服务会收集的源端服务器信息。 ... [详细]
  • imx6ull开发板驱动MT7601U无线网卡的方法和步骤详解
    本文详细介绍了在imx6ull开发板上驱动MT7601U无线网卡的方法和步骤。首先介绍了开发环境和硬件平台,然后说明了MT7601U驱动已经集成在linux内核的linux-4.x.x/drivers/net/wireless/mediatek/mt7601u文件中。接着介绍了移植mt7601u驱动的过程,包括编译内核和配置设备驱动。最后,列举了关键词和相关信息供读者参考。 ... [详细]
author-avatar
沉沦
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有