在GridView卡翻转动画一个项目 [英] Card flip animation for one item in a gridview
问题描述
所以，我想提出一个应用程序的餐厅显示使用的GridView的每个项目视图都用来购买餐和3 textviews和ImageView的显示顿饭的形象和它的名字一个按钮的项目，详细信息和价格。
So i am making an app for a restaurant that displays items using a gridview each item view have one button used to buy the meal and 3 textviews and imageview to display the meal image and its name , details and price .
什么想在这里做的是一个翻转动画一个项目在GridView上显示饭菜背后的更多详细信息。
What am trying to do here is a flip animation to one item in the gridview to show on the back more detailed information about the meal .
在卡翻转动画从谷歌Android开发者网站示例使用2片段中的FrameLayout翻转一个整体的片段我不需要，我只需要翻转这是一个GridView谁的已经在baseadapter调用一个片段的部分项目持有它们全部
The card flip animation example from Google android developer website uses 2 fragments in a framelayout to flip a whole fragment i don't need that i only need to flip an item that is a part of a gridview who's already in a baseadapter that called in a fragment holds them all
我搜索了很多，发现的例子，但是当我试图实现他们我不能在我的SDK提的是，我从SDK管理器更新支持库中找到android.animation软件包。
I searched alot and found examples but when i try to implement them i can't find "android.animation" package in my sdk mentioning that i have updated the support libraries from sdk manger .
请帮我上翻盖家伙我真的需要它。 感谢
Please help me on the flip guys i really need it . thanks.
下面是一些屏幕截图的应用
而在 code
Here is some screen shots to the app And the code.
https://drive.google.com/folder/d/0B9ZvWspyBhx1RUNydFFIei1qdm8/edit
推荐答案
所以，我没有找到我的问题谢谢回答这个教程
So i did find an answer for my question thanks to this tutorial
http://icetea09.com/blog/2014 / 10/21 / Android的卡片翻转动画/
flight_left_in.xml
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 the roration reach half of animation, show the card -->
<objectAnimator
android:valueFrom="0.0"
android:valueTo="1.0"
android:propertyName="alpha"
android:duration="1"
android:startOffset="250"/>
</set>
flip_right_out.xml
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 the rotation, hide the 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
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
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;
}
}
});
这篇关于在GridView卡翻转动画一个项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
