热门标签 | 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

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


推荐阅读
  • LCUI 2.1.0 版本现已推出,这是一个用 C 语言编写的图形用户界面开发库,适合创建轻量级的桌面应用程序。此次更新包括多项修复和功能增强,并正式宣布将启动 Android 支持的开发计划。 ... [详细]
  • 本文详细介绍了如何通过Git Bash在本地仓库与远程仓库之间建立连接并进行同步操作,包括克隆仓库、提交更改和推送更新等步骤。 ... [详细]
  • Windows 环境下安装 Git 并连接 GitHub 的详细步骤
    本文详细介绍了如何在 Windows 系统中安装 Git 工具,并通过配置 SSH 密钥实现与 GitHub 的安全连接。包括下载、安装、环境配置及验证连接等关键步骤。 ... [详细]
  • 本文介绍了在Android项目中实现时间轴效果的方法,通过自定义ListView的Item布局和适配器逻辑,实现了动态显示和隐藏时间标签的功能。文中详细描述了布局文件、适配器代码以及时间格式化工具类的具体实现。 ... [详细]
  • Django xAdmin 使用指南(第一部分)
    本文介绍如何在Django项目中集成和使用xAdmin,这是一个增强版的管理界面,提供了比Django默认admin更多的功能。文中详细描述了集成步骤及配置方法。 ... [详细]
  • 全能终端工具推荐:高效、免费、易用
    介绍一款备受好评的全能型终端工具——MobaXterm,它不仅功能强大,而且完全免费,适合各类用户使用。 ... [详细]
  • 任务,栈, ... [详细]
  • Barbican 是 OpenStack 社区的核心项目之一,旨在为各种环境下的云服务提供全面的密钥管理解决方案。 ... [详细]
  • 1、字符型常量字符型常量指单个字符,是用一对单引号及其所括起来的字符表示。例如:‘A’、‘a’、‘0’、’$‘等都是字符型常量。C语言的字符使用的就是 ... [详细]
  • 深入解析Android中的SQLite数据库使用
    本文详细介绍了如何在Android应用中使用SQLite数据库进行数据存储。通过自定义类继承SQLiteOpenHelper,实现数据库的创建与版本管理,并提供了具体的学生信息管理示例代码。 ... [详细]
  • 利用YAML配置Resilience4J的Circuit Breaker
    本文探讨了Resilience4j作为现代Java应用程序中不可或缺的容错工具,特别介绍了如何通过YAML文件配置Circuit Breaker以提高服务的弹性和稳定性。 ... [详细]
  • 本文档提供了如何使用C#代码从客户订单中提取产品信息的方法,适用于需要处理和分析产品数据的应用场景。 ... [详细]
  • 本文探讨了如何在Node.js环境中,通过Tor网络使用的SOCKS5代理执行HTTP请求。文中不仅提供了基础的实现方法,还介绍了几种常用的库和工具,帮助开发者解决遇到的问题。 ... [详细]
  • 在Python编程学习过程中,许多初学者常遇到各种功能实现难题。虽然这些问题往往并不复杂,但找到高效解决方案却能显著提升编程效率。本文将介绍一个名为‘30-seconds-of-python’的优质资源,帮助大家快速掌握实用的Python技巧。 ... [详细]
  • Flowable系列教程:运用ProcessEngineConfigurator实现高级流程引擎配置
    本文探讨了通过ProcessEngineConfigurator接口实现对Flowable流程引擎的高级配置方法。这种方法允许开发者通过自定义配置器来增强或修改流程引擎的行为。 ... [详细]
author-avatar
mobiledu2502916457
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有