Intereting Posts
Android canvas save всегда java.io.IOException: open failed: ENOENT (Нет такого файла или каталога) Список доверенных CA в android? Обнаруживает, подключена ли гарнитура к устройству Android или нет. Facebook SDK для дублированной библиотеки поддержки Android на зависимостях Ruby для Android Development? Изменение положения MediaController при вращении Как получить полный адрес из широты и долготы? Java.lang.noclassdeffounderror: org.ksoap2.serialization.SoapObject Как настроить инъекцию зависимостей с помощью кинжала для вещей, отличных от действий и фрагментов? Как перейти к определенной позиции в recyclerview внутри scrollview? Android: удалять связанные приложения файлы из внешнего хранилища в Uninstall? Ошибки компоновщика в Android NDK (неопределенная ссылка на `__cxa_end_cleanup ') Транзакции сохраняются в буфере (SDK для Google Analytics для Android) Скопировать файл базы данных на SDCard в android Как я могу выровнять элемент в центре и над другим элементом в относительной компоновке?

Анимация на вкладке Viewpager изменит fadein / fadeout как на экране ввода Linkedin

Я хочу реализовать такую ​​же анимацию, как, например, в приложении для Android, для входа в нее (вход / регистрация).

Я использую view pager для экрана «Введение», и я хочу реализовать анимацию fadein fadeout при изменении фонового изображения. Как проведите по экрану справа налево или наоборот. Я хочу реализовать анимацию fadein и fadeout при изменении фонового изображения в соответствии с экранированием экрана. Любая помощь приветствуется. Пожалуйста, взгляните на мой код макета

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" > <ImageView android:id="@+id/background_image" android:layout_width="fill_parent" android:layout_height="fill_parent" android:scaleType="centerCrop" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:weightSum="7" > <LinearLayout android:id="@+id/linearLayout1" android:layout_width="match_parent" android:layout_height="0dp" android:layout_marginRight="10dp" android:layout_weight="1" android:gravity="right" android:orientation="horizontal" > <ImageView android:id="@+id/imageView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginRight="5dp" android:src="@drawable/icon_skip" /> <TextView android:id="@+id/skip_tv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="Skip" android:textAppearance="?android:attr/textAppearanceMedium" android:textColor="@android:color/white" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="4" android:gravity="bottom" android:orientation="vertical" > <ImageView android:id="@+id/imageView3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:src="@drawable/logo" /> <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/pager" android:layout_width="wrap_content" android:layout_height="wrap_content" tools:context="com.xyz.View.IntroductionScreen" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="2" android:gravity="center" android:orientation="vertical" > <Button android:id="@+id/connection_bt" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginBottom="10dp" android:layout_marginLeft="40dp" android:layout_marginRight="40dp" android:background="@drawable/button" android:text="CONNEXION" android:textColor="@android:color/white" /> <Button android:id="@+id/register_bt" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="40dp" android:layout_marginRight="40dp" android:layout_marginTop="10dp" android:background="@drawable/button" android:text="INSCRIPTION" android:textColor="@android:color/white" /> </LinearLayout> </LinearLayout> 

И просмотр макета фрагмента пейджера

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"> <LinearLayout android:id="@+id/text_layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="10dp" android:orientation="vertical" > <TextView android:id="@+id/tagline_tv1" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:singleLine="true" android:text="Laissez votre prochain job" android:textAppearance="?android:attr/textAppearanceMedium" android:textColor="@android:color/white" /> <TextView android:id="@+id/details_tv" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:maxLines="2" android:text="vous trouver" android:textAppearance="?android:attr/textAppearanceMedium" android:textColor="@android:color/white" /> </LinearLayout> </RelativeLayout> 

Образец Splashs creen это то, что я хочу реализовать. Экран Linkedin Spalsh спасибо

Solutions Collecting From Web of "Анимация на вкладке Viewpager изменит fadein / fadeout как на экране ввода Linkedin"

Это без lag free а также ручки Buttons

Введите описание изображения здесь

Главная идея:

1) сначала создайте прозрачный фон для ваших фрагментов.

2) Создайте LayerDrawable и добавьте фоновое изображение каждого фрагмента в качестве элемента. Затем добавьте LayerDrawable в качестве фона вашего viewpager.

3) в методе onCreate задайте альфа каждого слоя правильно, поэтому только верхний имеет альфа-значение 255.

4) для каждого представления вашего FragmentStatPagerAdapter задайте тег, соответствующий объявляемому индексу, который вы LayerDrawable в LayerDrawable . Например, при открытии приложения FragmentA показывает, что его тег должен соответствовать верхнему адресуемому, который равен 2 (начиная с 0). Тег последней страницы должен быть 0, соответствует наименьшему допустимому.

5) изменить возможность каждого вида в функции transformPage

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

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <android.support.v4.view.ViewPager android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/layerdrawable" > </android.support.v4.view.ViewPager> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:orientation="horizontal" android:layout_marginBottom="48dip" > <Button android:layout_width="0dip" android:layout_height="wrap_content" android:layout_weight="1" android:text="Sign in" android:layout_margin="16dip" android:background="#2ec6e4" android:textColor="#FFFFFF" /> <Button android:layout_width="0dip" android:layout_height="wrap_content" android:layout_weight="1" android:text="Join us" android:background="#2ec6e4" android:layout_margin="16dip" android:textColor="#FFFFFF" /> </LinearLayout> </RelativeLayout> 

LayerDrawable

 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item> <bitmap android:id="@+id/Idofbg3" android:gravity="fill" android:src="@drawable/bg3" /> </item> <item> <bitmap android:id="@+id/Idofbg2" android:gravity="fill" android:src="@drawable/bg2" /> </item> <item> <bitmap android:id="@+id/Idofbg1" android:gravity="fill" android:src="@drawable/bg1" /> </item> </layer-list> 

Для ленивых людей, которые просто не хотят объявлять фрагменты:

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"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/FragmentA" android:background="@android:color/transparent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textAppearance="?android:attr/textAppearanceLarge" android:text="This is Fragment A" android:textColor="#FFFFFF" android:id="@+id/textView" android:gravity="center" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:layout_alignParentRight="true" android:layout_alignParentBottom="true" /> </RelativeLayout> 

Установите ViewPager.PageTransformer в ViewPager и ViewPager нужной анимации, используя aplha анимации aplha и translation .

Самый важный вход – параметр position переданный transformPage процессу transformPage . Значение позиции указывает, как выглядит представление в настоящее время.

Предполагая, что представления в 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); } }); 

Вот макет:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <ImageView android:layout_alignParentTop="true" android:id="@+id/imageView" android:layout_width="match_parent" android:layout_height="match_parent" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/textView" /> </RelativeLayout> 

Вот экранная запись:

Запись с экрана