Android 仿订单出票效果 (附DEMO)
2014-10-29 15:40
351 查看
之前我下载了BaseAnimation 开源库(BaseAnimation是基于开源的APP,致力于收集各种动画效果)
BaseAnimation 转载的链接:/article/1970406.html
发现里面有个火车票的出票效果,发现可以优化下:
BaseAnimation内的仿出票效果
可是它的出的票的布局高度啥都是写死的,通过这个思路,我便想到要做个类似于数据是通过网络获取,高度不一定的listview的订单出票效果。
一. 思路:
1)叠在布局上层的是订单信息,而在下层的就是订单内菜单的详细条目,详细条目的布局是置于布局最底层,并且在订单信息相对位置下方,这里使用了FrameLayout来处 理 详细条目布局。
2)出票的详细条目列表采用了LISTVIEW,它的动画初始位置要通过计算LISTVIEW的总高度进行计算获取,之后通过TranslateAnimation 进行Animation动画。
3)采用线程来模拟网络获取延迟的效果。
二. 碰到解决的问题:
1)碰到一个问题,就是如果数据一多,超过了一屏幕,在动画过程中动画衔接效果就很差,并有可能出现断层效果。
解决:通过重写ListView, 计算高度,并且在ListView 外面嵌套了一层ScrollView,这样便可以解决这样的问题。
2) 如果在订单信息布局下方直接放置一个LISTVIEW的话,这样,动画时候,LISTVIEW就会盖在订单信息上方。
解决:LISTVIEW外层一定要嵌套一层布局,并且设定在订单信息下方,这样便不会产生上述问题。
3)由于订单底部
一开始就是出现的,并且在数据刷新后跟随LISTVIEW一起下滑。
解决:采用Listview的addFooterView(底部view)方法,把它添加到LISTVIEW底部,在开始添加完毕后就直接初始化让Listview.setAdapter(null);
这样便在开始底部就显示出来了。
4)如何去计算LISTVIEW的总高度
解决:本DEMO采用了2种方式,
第一种:鉴于订单中每个ITEM的布局都是固定的,于是在布局中设置ITEM的高度为固定值,之后乘以listAdapter.getCount() 加上分割线listView.getDividerHeight() 的总高度
第二种:如果每个ITEM的布局是高度是不一定的话,就会造成影响,便找了一些资料,使用了以下方法:
[java] view
plaincopy
/** ListView 总高度 */
public static int totalHeight = 0;
public static void setListViewHeightBasedOnChildren(ListView listView) {
ListAdapter listAdapter = listView.getAdapter();
if (listAdapter == null) {
return;
}
totalHeight = 0;
// 由于ADD了个footer,所以总量减去1
Log.d("listAdapter.getCount()", "" + listAdapter.getCount());
for (int i = 0, len = listAdapter.getCount() - 1; i < len; i++) {
View listItem = listAdapter.getView(i, null, listView);
listItem.measure(0, 0);
totalHeight += listItem.getMeasuredHeight();
Log.d("getMeasuredHeight", "" + listItem.getMeasuredHeight());
}
totalHeight = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
}
计算得到了总高度。
5)实现动画效果
解决:
[java] view
plaincopy
/**
* 启动打印订单动画
*/
rivate void startAnimation() {
anim = new TranslateAnimation(0.0f, 0.0f, -totalHeight, 0);
anim.setDuration(1000);
anim.setFillAfter(true);
anim.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationEnd(Animation animation) {
// TODO Auto-generated method stub
cListview.clearAnimation();
}
});
cListview.startAnimation(anim);
最后来看看动画效果把:
由于是第一次写博客,有不足之处望各位大神提出意见和建议,共同进步。谢谢!
转载请附上:/article/1970407.html
DEMO源码下载链接:
http://download.csdn.net/detail/vipzjyno1/7000355
BaseAnimation 转载的链接:/article/1970406.html
发现里面有个火车票的出票效果,发现可以优化下:
BaseAnimation内的仿出票效果
可是它的出的票的布局高度啥都是写死的,通过这个思路,我便想到要做个类似于数据是通过网络获取,高度不一定的listview的订单出票效果。
一. 思路:
1)叠在布局上层的是订单信息,而在下层的就是订单内菜单的详细条目,详细条目的布局是置于布局最底层,并且在订单信息相对位置下方,这里使用了FrameLayout来处 理 详细条目布局。
2)出票的详细条目列表采用了LISTVIEW,它的动画初始位置要通过计算LISTVIEW的总高度进行计算获取,之后通过TranslateAnimation 进行Animation动画。
3)采用线程来模拟网络获取延迟的效果。
二. 碰到解决的问题:
1)碰到一个问题,就是如果数据一多,超过了一屏幕,在动画过程中动画衔接效果就很差,并有可能出现断层效果。
解决:通过重写ListView, 计算高度,并且在ListView 外面嵌套了一层ScrollView,这样便可以解决这样的问题。
2) 如果在订单信息布局下方直接放置一个LISTVIEW的话,这样,动画时候,LISTVIEW就会盖在订单信息上方。
解决:LISTVIEW外层一定要嵌套一层布局,并且设定在订单信息下方,这样便不会产生上述问题。
3)由于订单底部
一开始就是出现的,并且在数据刷新后跟随LISTVIEW一起下滑。
解决:采用Listview的addFooterView(底部view)方法,把它添加到LISTVIEW底部,在开始添加完毕后就直接初始化让Listview.setAdapter(null);
这样便在开始底部就显示出来了。
4)如何去计算LISTVIEW的总高度
解决:本DEMO采用了2种方式,
第一种:鉴于订单中每个ITEM的布局都是固定的,于是在布局中设置ITEM的高度为固定值,之后乘以listAdapter.getCount() 加上分割线listView.getDividerHeight() 的总高度
第二种:如果每个ITEM的布局是高度是不一定的话,就会造成影响,便找了一些资料,使用了以下方法:
[java] view
plaincopy
/** ListView 总高度 */
public static int totalHeight = 0;
public static void setListViewHeightBasedOnChildren(ListView listView) {
ListAdapter listAdapter = listView.getAdapter();
if (listAdapter == null) {
return;
}
totalHeight = 0;
// 由于ADD了个footer,所以总量减去1
Log.d("listAdapter.getCount()", "" + listAdapter.getCount());
for (int i = 0, len = listAdapter.getCount() - 1; i < len; i++) {
View listItem = listAdapter.getView(i, null, listView);
listItem.measure(0, 0);
totalHeight += listItem.getMeasuredHeight();
Log.d("getMeasuredHeight", "" + listItem.getMeasuredHeight());
}
totalHeight = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
}
计算得到了总高度。
5)实现动画效果
解决:
[java] view
plaincopy
/**
* 启动打印订单动画
*/
rivate void startAnimation() {
anim = new TranslateAnimation(0.0f, 0.0f, -totalHeight, 0);
anim.setDuration(1000);
anim.setFillAfter(true);
anim.setAnimationListener(new AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
@Override
public void onAnimationEnd(Animation animation) {
// TODO Auto-generated method stub
cListview.clearAnimation();
}
});
cListview.startAnimation(anim);
最后来看看动画效果把:
由于是第一次写博客,有不足之处望各位大神提出意见和建议,共同进步。谢谢!
转载请附上:/article/1970407.html
DEMO源码下载链接:
http://download.csdn.net/detail/vipzjyno1/7000355
相关文章推荐
- Android 仿订单出票效果 (附DEMO)
- Android 仿订单出票效果 (附DEMO)
- 【Android Demo】图片之滑动效果(Gallery)
- 2013新春奉送:Android摄像头开发完美demo---(循环聚焦,缩放大小,旋转picture,查询支持的picturesize, ImageButton按键效果)
- Android 仿 窗帘效果 和 登录界面拖动效果 (Scroller类的应用) 附 2个DEMO及源码
- 【Android实战】SurfaceView绘制各种效果Demo
- Android开发效果Demo
- Android上Path应用左下角按钮动画效果demo原型
- Android 仿 窗帘效果 和 登录界面拖动效果 (Scroller类的应用) 附 2个DEMO及源码
- Android 仿 窗帘效果 和 登录界面拖动效果 (Scroller类的应用) 附 2个DEMO及源码
- Android学习小Demo(4)贝塞尔曲线跟翻页效果
- Android自定义带有阴影效果的按钮Demo
- android 点击字体,图片背景效果一起变换Demo
- Android学习小Demo(4)贝塞尔曲线跟翻页效果
- 【转】Android摄像头开发完美demo---(循环聚焦,缩放大小,旋转picture,查询支持的picturesize, ImageButton按键效果)
- Android磨砂效果原理加Demo
- Android之水波效果(2不同效果的Demo)
- Android摄像头开发完美demo---(循环聚焦,缩放大小,旋转picture,查询支持的picturesize, ImageButton按键效果)
- Android学习小Demo(6)图片折叠效果的实现
- Android摇一摇振动效果Demo