Viewpager选项卡中的animation更改fadein / fadeout,就像Linkedin介绍屏幕一样

我想在Android应用程序中为其简介(登录/注册)屏幕实现相同types的animation,例如链接。

我正在使用视图寻呼机进行简介屏幕,我想在背景图像更改时实现fadein fadeoutanimation,按照从右向左滑动或反之亦然。 我想根据屏幕的滑动在背景图像变化上实现fadein和fadeoutanimation。 任何帮助表示赞赏。 请看一下我的布局代码

            

而View Viewr片段布局是

       

示例Splashs creen这是我想要实现的。 Linkedin Spalsh屏幕 谢谢

  • 在Android中启动一个AnimationDrawable
  • 如何animation回收商视图的布局pipe理器的变化
  • 如何在Android中加载5行和5列顶视图的精灵表?
  • Android工作室animation文件
  • 自定义android AccelerateDecelerateInterpolator
  • Android中的自定义animation
  • Android - 拖放 - animation阴影到目的地
  • 在Android中animationProgressBar更新
  • 这是一个无lag free ,也处理Buttons

    在此处输入图像描述

    大意:

    1)首先为片段创建透明背景。

    2)创建LayerDrawable并将每个片段的背景图像添加为项目。 然后添加LayerDrawable作为viewpager的背景。

    3)在onCreate方法中正确设置每一层的alpha,所以只有上层的alpha值为255。

    4)为FragmentStatPagerAdapter的每个视图设置一个标签,该标签对应于您在LayerDrawable声明的可绘制索引。 例如,当您打开应用程序时, FragmentA正在显示,因此其标记必须对应于上部drawable 2(从0开始)。 最后一页标记必须为0对应最低可绘制。

    5)在函数transformPage改变每个视图的drawable

    6)用于添加按钮使用RelativeLayout 。 要将按钮放在所有视图的顶部,请使用RelativeLayout 。 后来的孩子们在Z轴上放置得更高。 你可以在代码中看到它:

    现在让我们看看代码:

    主要活动

     public class MainActivity extends FragmentActivity { ViewPager viewPager=null; int numberOfViewPagerChildren = 3; int lastIndexOfViewPagerChildren = numberOfViewPagerChildren - 1; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); viewPager = (ViewPager) findViewById(R.id.pager); viewPager.setAdapter(new MyAdapter(getSupportFragmentManager())); final LayerDrawable background = (LayerDrawable) viewPager.getBackground(); background.getDrawable(0).setAlpha(0); // this is the lowest drawable background.getDrawable(1).setAlpha(0); background.getDrawable(2).setAlpha(255); // this is the upper one viewPager.setPageTransformer(true, new ViewPager.PageTransformer() { @Override public void transformPage(View view, float position) { int index = (Integer) view.getTag(); Drawable currentDrawableInLayerDrawable; currentDrawableInLayerDrawable = background.getDrawable(index); if(position < = -1 || position >= 1) { currentDrawableInLayerDrawable.setAlpha(0); } else if( position == 0 ) { currentDrawableInLayerDrawable.setAlpha(255); } else { currentDrawableInLayerDrawable.setAlpha((int)(255 - Math.abs(position*255))); } } }); } class MyAdapter extends FragmentStatePagerAdapter { public MyAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int i) { Fragment fragment=null; if(i==0) { fragment=new FragmentA(); } if(i==1) { fragment=new FragmentB(); } if(i==2) { fragment=new FragmentC(); } return fragment; } @Override public int getCount() { return numberOfViewPagerChildren; } @Override public boolean isViewFromObject(View view, Object object) { if(object instanceof FragmentA){ view.setTag(2); } if(object instanceof FragmentB){ view.setTag(1); } if(object instanceof FragmentC){ view.setTag(0); } return super.isViewFromObject(view, object); } } } 

    activity_main.xml中

             

    LayerDrawable

     < ?xml version="1.0" encoding="utf-8"?>            

    对于那些不想声明片段的懒人:

    FragmentA

     public class FragmentA extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View v = inflater.inflate(R.layout.fragment_a,container,false); return v; } } 

    fragment_a.xml

     < ?xml version="1.0" encoding="utf-8"?>    

    将ViewPager.PageTransformer设置为ViewPager ,并使用aplha translation画属性实现所需的animation。

    最重要的输入是传递给transformPage回调的position参数。 位置值指示视图当前的位置。

    假设ViewPager中的视图是全宽度,则需要解释位置值的方式。

     ------------------------------------------------------------------------------------ position | what does it mean ------------------------------------------------------------------------------------ 0 | view is positioned in the center and fully visible to the user. -1 | view is positioned in the left and not visible to the user. 1 | view is positioned in the right and not visible to the user. >-1 & <0 | view is being scrolled towards left and is partially visible. >0 & <1 | view is being scrolled towards right and is partially visible. ------------------------------------------------------------------------------------ mPager.setPageTransformer(true, new ViewPager.PageTransformer() { @Override public void transformPage(View view, float position) { // Ensures the views overlap each other. view.setTranslationX(view.getWidth() * -position); // Alpha property is based on the view position. if(position < = -1.0F || position >= 1.0F) { view.setAlpha(0.0F); } else if( position == 0.0F ) { view.setAlpha(1.0F); } else { // position is between -1.0F & 0.0F OR 0.0F & 1.0F view.setAlpha(1.0F - Math.abs(position)); } // TextView transformation view.findViewById(R.id.textView).setTranslationX(view.getWidth() * position); } }); 

    这是布局:

         

    这是屏幕记录:

    屏幕记录