[Android]仿通讯录ListView小例子

53
回复
461925
查看
  [复制链接]

0

主题

0

帖子

-19

安币

限制会员

发表于 2011-12-10 17:28:29 | 显示全部楼层 |阅读模式
本帖最后由 mubus 于 2011-12-10 17:32 编辑

写这例子的初衷是想模仿通讯录列表,实现了一些效果,也没法做到100%相像,自己也认为还有一些不足(存在些内存上的浪费)。
这个阶段先这样了,代码量比较大,就不贴代码了,只上效果图。
源码下载地址:


效果图如下:





1.实现根据字母进行分类。
2.实现快速滑动及修改快速滑动条的图标。
3.实现快速滑动时的字母提示。
4.实现快捷操作框及其的动画显示/隐藏,上箭头与下箭头的选择性显示及位置匹配。
5.顺便做了个自定义Dialog和完整的发送邮件的实现(主送、抄送、密送、附件、标题、正文)。



部分实现细节介绍:

1.快速滑动时的字母提示框

      该显示组件为TextView,实例索引名为txtOverlay,执行WindowManager.addView(txtOverlay, layoutParams)后添加于WindowManager上。通过设置ListView.OnScrollListener监听到滚动时则将txtOverlay设置可见性为View.VISIBLE,当滚动结束时可见性调为View.INVISIBLE。
     为了提升用户体验,避免在短时间内,用户再次拖动时字母提示框又执行显示和隐藏命令,将隐藏的操作设置在DisapearThread线程实例中,通过handler.postDelayed(disapearThread, 1500)延时1.5秒后再执行字母提示框的隐藏。


2.快速滚动图标的修改

     Android Api并未公开修改图标的接口,本处通过调用Java的反射机制修改了快速滚动的图标。替换代码见MainAct类中的changeFastScrollerDrawable()。
    补充:Android对ListView设置了优化,对于少于4页内容的List即使设置了fastScrollEnabled=true也不会显示FastScroller。
    参考资料查看:<Android_Source>/frameworks/base/core/java/android/widget/FastScroller.java:其中常量MIN_PAGES及其相关。



3.获取List中“咧牙”ImageView在屏幕中的绝对位置

    代码如下:anchor为“咧牙”ImageView。


  1. int[] location = new int[2];
  2. anchor.getLocationOnScreen(location);
  3. Rect anchorRect = new Rect(location[0], location[1], location[0] + anchor.getWidth(),
  4.                 location[1] + anchor.getHeight());
复制代码
  这个步骤也是为上箭头与下箭头的自动选择做好铺垫。 4.为快捷按钮组成的LinearLayout设置反弹动画      设置LinearLayout沿直线轨迹从从屏幕右边滑动到左边这个部分的动画定义文件是res/anim/anim_actionslayout.xml,代码如下:
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!-- 本文件指定了actionsLayout的出现动画。 -->
  3. <!-- translate定义了垂直或水平方向或两者混合的一种运动。 -->
  4. <!-- formXDelta:赋值为浮点数或百分比。百分号后面'p'表示相对于父控件的相应位置。当只有百分号时表示相对于控件本身的位置。 -->
  5. <!-- 查看@android:integer/config_longAnimTime的具体值可于<SDK_PATH>/platforms/<android-level>/data/res/values/config.xml -->
  6. <translate xmlns:android="http://schemas.android.com/apk/res/android"
  7.         android:fromXDelta="100%p"
  8.         android:toXDelta="0"
  9.         android:duration="@android:integer/config_longAnimTime"
  10. ></translate>
复制代码
  需要反弹的效果还得对Animation设定Interpolator(插值器),插值器的设定需要一些数学基础了,得找到合适的函数对动画速率进行修正。本例中使用的插值器代码如下:
  1. package lab.sodino.list_quickaction;
  2. import android.util.Log;
  3. import android.view.animation.Interpolator;
  4. /**
  5. * @author Sodino E-mail:sodinoopen@hotmail.com
  6. * @version Time:2011-5-3 下午08:02:01
  7. */
  8. public class CustomInterpolator implements Interpolator {
  9.         /**
  10.          * @param input
  11.          *            A value between 0 and 1.0 indicating our current point in the
  12.          *            animation where 0 represents the start and 1.0 represents the
  13.          *            end
  14.          * @return Returns The interpolation value. This value can be more than 1.0
  15.          *         for Interpolators which overshoot their targets, or less than 0
  16.          *         for Interpolators that undershoot their targets.
  17.          */
  18.         public float getInterpolation(float input) {
  19.                 Log.d("ANDROID_LAB", "input=" + input);
  20.                 // 设定动画的加速度变化值。此例的效果是使用actionsLayout超过目标旋转区后再反弹回来。
  21.                 // 插值计算公式: 1.2-((x*1.55f)-1.1)^2
  22.                 // 画出函数图的话即可观察出动画执行过程中越过目标区再反弹的详细过程。
  23.                 // x :0 <= v <= 1.0
  24.                 // (x*1.55f) :0 <= v <= 1.55
  25.                 // ((x*1.55f)-1.1) :-1.1 <= v <= 0.45
  26.                 // ((x*1.55f)-1.1)^2 :0<= v <= 1.21
  27.                 // 1.2-((x*1.55f)-1.1)^2 :-0.1 <= v <= 1.2
  28.                 final float inner = (input * 1.55f) - 1.1f;
  29.                 // 如果返回值为常量1的话,则相当于没有动画效果。
  30.                 return 1.2f - inner * inner;
  31.         }
  32. }
复制代码
最后声明下,楼主只是汇总了前人的成果然后自己拿来用而已


本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

0

主题

44

帖子

69

安币

程序猿

Rank: 2

发表于 2011-12-11 22:41:30 | 显示全部楼层
不错{:soso_e177:}

0

主题

380

帖子

715

安币

代码手工艺人

Rank: 4

发表于 2011-12-12 09:51:30 | 显示全部楼层
学一个~!

0

主题

39

帖子

49

安币

初级码农

Rank: 1

QQ达人

发表于 2011-12-13 21:39:01 | 显示全部楼层
不错啊!!!值得表扬!!!

2

主题

313

帖子

652

安币

代码手工艺人

Rank: 4

QQ达人

发表于 2011-12-16 15:24:28 | 显示全部楼层
我觉得可以,把图片放左边.右边加个字母索引条

主题

帖子

安币

游客

发表于 2011-12-19 20:27:39 | 显示全部楼层
感觉真不错。。学习学习

主题

帖子

安币

游客

发表于 2011-12-19 20:43:18 | 显示全部楼层
好啊

0

主题

52

帖子

0

安币

程序猿

Rank: 2

发表于 2011-12-22 14:28:43 | 显示全部楼层
很好不错学习
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

领先的中文移动开发者社区
18620764416
7*24全天服务
意见反馈:1294855032@qq.com

扫一扫关注我们

Powered by Discuz! X3.2© 2001-2019 Comsenz Inc.( 粤ICP备15117877号 )