In ViewPager of Fragments, fragments cannot flip like cards
Introduction
I am creating an application that has a start menu with multiple images / slices. I want every image I click to animate to flip the map and change it to another image (which has some ImageButtons that lead you to the main application)
Problem
I tried to implement animation by following this but whenever I click on the image / fragment there is a problem which after doing a little research on the internet I found out about it from trying to do an action for fragments on the android.support.v4.app file. Fragments in logcat file:
java.lang.RuntimeException: Unknown animation name: objectAnimator
Main activity class
public class MainMenuActivity extends FragmentActivity {
/**
* the pager which handles animation and lets up swipe horizontally to access previous and next memo game
*/
ViewPager viewPager;
/**
* the pager adapter which provides the pages to the pager widget
*/
PagerAdapter adapter;
/**
* probably useless but we'll see in the future
*/
int[] game;
/**
* the number of the memo games provided in the version
*/
public static final int NUM_OF_GAMES=8;
/**
* the number of the position where the pager is
*/
public static int POSITION;
public Context context;
/**
* whether or not we're showing the back of the card (otherwise showing the front)
*/
private boolean mShowingBack = false;
@Override
protected void onCreate(Bundle savedInstanceState) {
//remove the title
requestWindowFeature(Window.FEATURE_NO_TITLE);
super.onCreate(savedInstanceState);
//making the window full screen
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_main_menu);
context=this.getApplicationContext();
viewPager=(ViewPager)findViewById(R.id.pager);
adapter = new MemoGameFragmentPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);
viewPager.setOffscreenPageLimit(6);
viewPager.setPageMargin(20);
}
private class MemoGameFragmentPagerAdapter extends FragmentStatePagerAdapter{
public MemoGameFragmentPagerAdapter(android.support.v4.app.FragmentManager fm){
super(fm);
}
@Override
public Fragment getItem(int position){
MainMenuActivity.POSITION=position;
return new MemoFrontFragment();
}
@Override
public int getCount(){
return NUM_OF_GAMES;
}
@Override
public float getPageWidth(int position){
return (0.4f);
}
}
public void flipMemoGame(){
//the card is on its back side
if(mShowingBack){
android.support.v4.app.FragmentManager fm =getSupportFragmentManager();
fm.popBackStack();
return;
}
//the card is on its front side
mShowingBack=true;
getSupportFragmentManager().beginTransaction().setCustomAnimations(R.animator.card_flip_right_in,
R.animator.card_flip_right_out,
R.animator.card_flip_left_in,R.animator.card_flip_left_out)
.replace(R.id.pager,new MemoBackFragment()).addToBackStack(null).commit();
}
public void setOnClickListeners(View v){
ImageView img;
img=(ImageView)v;
img.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
flipMemoGame();
}
});
}}
Java Snippet File
public class MemoFrontFragment extends Fragment {
static ImageView IMAGE;
int[] game;
int position=MainMenuActivity.POSITION;
ImageView img;
View view;
@Override
public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState){
game = new int[]{R.drawable.img,R.drawable.img0,R.drawable.img1,R.drawable.img2,R.drawable.img3,R.drawable.img4,R.drawable.img6,R.drawable.img7};
view=inflater.inflate(R.layout.fragment_memo_front_game_1,container,false);
img=(ImageView)view.findViewById(R.id.united_states_flag);
img.setImageResource(game[position]);
IMAGE=img;
return view;
}
}
Another snippet file
public class MemoBackFragment extends Fragment {
View view;
@Override
public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState){
view=inflater.inflate(R.layout.fragment_memo_back_game_1,container,false);
return view;
}
}
If you need anything else, let me know and I will provide it as soon as possible.
source to share
Apparently when you are using the support library you should be using the older property / view animation ( R.anim.*
), object animation ( R.animator.*
) will not work with the support library.
So, just for comparison, / res / anim / card _flip_left_in.xml might look something like this:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.0"
android:duration="0" />
<rotate
android:fromDegrees="-180"
android:toDegrees="0"
android:interpolator="@android:interpolator/accelerate_decelerate"
android:duration="@integer/card_flip_time_full"
/>
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:startOffset="@integer/card_flip_time_half"
android:duration="1" />
</set>
source to share