android - Card flip animation for one item in a gridview -
so making app restaurant displays items using gridview each item view have 1 button used buy meal , 3 textviews , imageview display meal image , name , details , price .
what trying here flip animation 1 item in gridview show on more detailed information meal .
the card flip animation example google android developer website uses 2 fragments in framelayout flip whole fragment don't need need flip item part of gridview who's in baseadapter called in fragment holds them all
i searched alot , found examples when try implement them can't find "android.animation" package in sdk mentioning have updated support libraries sdk manger .
please me on flip guys need . thanks.
here screen shots app , code.
https://drive.google.com/folder/d/0b9zvwspybhx1runydffiei1qdm8/edit
so did find answer question tutorial
http://icetea09.com/blog/2014/10/21/android-card-flip-animation/
flight_left_in.xml
<set xmlns:android="http://schemas.android.com/apk/res/android"> <!-- rotate. --> <objectanimator android:valuefrom="-180" android:valueto="0" android:propertyname="rotationy" android:interpolator="@android:interpolator/accelerate_decelerate" android:duration="500" /> <!-- when roration reach half of animation, show card --> <objectanimator android:valuefrom="0.0" android:valueto="1.0" android:propertyname="alpha" android:duration="1" android:startoffset="250"/> </set> flip_right_out.xml
<set xmlns:android="http://schemas.android.com/apk/res/android"> <!-- rotate. --> <objectanimator android:valuefrom="0" android:valueto="180" android:propertyname="rotationy" android:interpolator="@android:interpolator/accelerate_decelerate" android:duration="500" /> <!-- half-way through rotation, hide front card --> <objectanimator android:valuefrom="1.0" android:valueto="0.0" android:propertyname="alpha" android:startoffset="250" android:duration="1" /> </set> fav_grid_single.xml
<relativelayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" android:padding="10dp" android:paddingbottom="@dimen/activity_vertical_margin" android:paddingleft="@dimen/activity_horizontal_margin" android:paddingright="@dimen/activity_horizontal_margin" android:paddingtop="@dimen/activity_vertical_margin" > <linearlayout android:id="@+id/fav_grid_single_front" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/view_dropshadow" > <relativelayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/rounded_corner" android:padding="10dp" android:paddingbottom="@dimen/activity_vertical_margin" android:paddingleft="@dimen/activity_horizontal_margin" android:paddingright="@dimen/activity_horizontal_margin" android:paddingtop="@dimen/activity_vertical_margin" > <imageview android:id="@+id/fav_grid_image" android:layout_width="312dp" android:layout_height="212dp" android:padding="10dp" /> <textview android:id="@+id/fav_grid_detialstext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/fav_grid_nametext" android:padding="10dp" android:text="ههههههههههههههههههههههههههههه" android:textcolor="#111" android:textsize="17dp" /> <textview android:id="@+id/fav_grid_pricetext" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignbaseline="@+id/fav_grid_buybutton" android:layout_alignbottom="@+id/fav_grid_buybutton" android:layout_alignright="@+id/fav_grid_nametext" android:padding="5dp" android:text="500 sdg" android:textcolor="#111" android:textsize="18dp" /> <textview android:id="@+id/fav_grid_nametext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignleft="@+id/fav_grid_detialstext" android:layout_below="@+id/fav_grid_image" android:layout_marginleft="18dp" android:padding="5dp" android:text="الاسم" android:textcolor="#111" android:textsize="25dp" android:textstyle="bold" /> <ratingbar android:id="@+id/fav_ratingbar" android:layout_width="260dp" android:layout_height="wrap_content" android:layout_alignleft="@+id/fav_grid_detialstext" android:layout_below="@+id/fav_grid_detialstext" android:paddingleft="10dp" /> <button android:id="@+id/fav_grid_buybutton" android:layout_width="50dp" android:layout_height="50dp" android:layout_alignleft="@+id/fav_grid_nametext" android:layout_below="@+id/fav_ratingbar" android:background="@drawable/buy" android:padding="5dp" android:textsize="0dp" /> </relativelayout> </linearlayout> <linearlayout android:id="@+id/fav_grid_single_back" android:layout_width="fill_parent" android:layout_height="fill_parent" android:alpha="0" android:background="@drawable/view_dropshadow" android:orientation="horizontal" > <relativelayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@drawable/rounded_corner" android:padding="10dp" android:paddingbottom="@dimen/activity_vertical_margin" android:paddingleft="@dimen/activity_horizontal_margin" android:paddingright="@dimen/activity_horizontal_margin" android:paddingtop="@dimen/activity_vertical_margin" > <textview android:id="@+id/fav_grid_morespatext" android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="5dp" /> <textview android:id="@+id/fav_grid_morenametext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/fav_grid_morespatext" android:padding="5dp" android:text="الاسم" android:textcolor="#111" android:textsize="25dp" android:textstyle="bold" /> <textview android:id="@+id/fav_grid_moredetialstext" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/fav_grid_morenametext" android:padding="5dp" android:text="التفاصيل" android:textcolor="#111" android:textsize="20dp" /> </relativelayout> </linearlayout> <button android:id="@+id/fav_grid_flipbutton" style="?android:attr/buttonstylesmall" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentright="true" android:layout_alignparenttop="true" android:background="@drawable/info3" /> </relativelayout> favgrid.java
final button info = (button) grid.findviewbyid(r.id.fav_grid_flipbutton); info.setonclicklistener(new onclicklistener() { public void onclick(view arg0) { setrightout = (animatorset) animatorinflater.loadanimator(context, r.animator.flip_right_out); setleftin = (animatorset) animatorinflater.loadanimator(context, r.animator.flight_left_in); view v = parent.getchildat(integer.parseint(buy.gettext().tostring())); imgfront = (linearlayout)v.findviewbyid(r.id.fav_grid_single_front); imgback = (linearlayout)v.findviewbyid(r.id.fav_grid_single_back); if(!isbackvisible){ setrightout.settarget(imgfront); setleftin.settarget(imgback); setrightout.start(); setleftin.start(); isbackvisible = true; } else{ setrightout.settarget(imgback); setleftin.settarget(imgfront); setrightout.start(); setleftin.start(); isbackvisible = false; } } }); 
Comments
Post a Comment