• (转)Android 仿订单出票效果 (附DEMO)


    之前我下载了BaseAnimation 开源库(BaseAnimation是基于开源的APP,致力于收集各种动画效果) 

    BaseAnimation 转载的链接:http://blog.csdn.net/vipzjyno1/article/details/20622621

    发现里面有个火车票的出票效果,发现可以优化下:

    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的布局是高度是不一定的话,就会造成影响,便找了一些资料,使用了以下方法:

     

    1. /** ListView 总高度 */  
    2. public static int totalHeight = 0;  
    3.   
    4. public static void setListViewHeightBasedOnChildren(ListView listView) {  
    5.     ListAdapter listAdapter = listView.getAdapter();  
    6.     if (listAdapter == null) {  
    7.         return;  
    8.     }  
    9.     totalHeight = 0;  
    10.     // 由于ADD了个footer,所以总量减去1   
    11.     Log.d("listAdapter.getCount()", "" + listAdapter.getCount());  
    12.     for (int i = 0, len = listAdapter.getCount() - 1; i < len; i++) {  
    13.         View listItem = listAdapter.getView(i, null, listView);  
    14.         listItem.measure(0, 0);  
    15.         totalHeight += listItem.getMeasuredHeight();  
    16.         Log.d("getMeasuredHeight", "" + listItem.getMeasuredHeight());  
    17.     }  
    18.     totalHeight = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));  
    19. }  
    	/** 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)实现动画效果

    解决:

     

    1.       /** 
    2. * 启动打印订单动画 
    3. */  
    4. rivate void startAnimation() {  
    5. anim = new TranslateAnimation(0.0f, 0.0f, -totalHeight, 0);  
    6. anim.setDuration(1000);  
    7. anim.setFillAfter(true);  
    8. anim.setAnimationListener(new AnimationListener() {  
    9.     @Override  
    10.     public void onAnimationStart(Animation animation) {  
    11.         // TODO Auto-generated method stub   
    12.     }  
    13.   
    14.     @Override  
    15.     public void onAnimationRepeat(Animation animation) {  
    16.         // TODO Auto-generated method stub   
    17.     }  
    18.   
    19.     @Override  
    20.     public void onAnimationEnd(Animation animation) {  
    21.         // TODO Auto-generated method stub   
    22.         cListview.clearAnimation();  
    23.     }  
    24. });  
    25. cListview.startAnimation(anim);  
            /**
    	 * 启动打印订单动画
    	 */
    	private 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);
    	}

    最后来看看动画效果把:

    由于是第一次写博客,有不足之处望各位大神提出意见和建议,共同进步。谢谢!

    转载请附上:http://blog.csdn.net/vipzjyno1/article/details/20623401

    DEMO源码下载链接:

    http://download.csdn.net/detail/vipzjyno1/7000355

  • 相关阅读:
    delphi安装pngimage控件,不需要安装,只需引用就行
    怎样把PL/SQLDeveloper字体调大
    resource is out of sync with the file
    SecureCRT:[1]SecureCRT配色方案
    安装开发环境注意事项2
    插入排序
    tomcat更改端口序
    tomcat更改端口
    maven添加jar包
    java总结
  • 原文地址:https://www.cnblogs.com/SZ2015/p/4596767.html
Copyright © 2020-2023  润新知