在Android Listview项目中翻转动画

时间:2014-12-23 19:27:03

标签: android android-listview android-animation

我正在尝试使用listview显示每个Flip animation项目的正面和背面。动画效果很好,但动画的结果也适用于其他项目。此外,当我向上和向下滚动时,我的项目位置会发生变化。我的代码如下:

public View getView(final int position, final View convertView, ViewGroup parent) {
    ArtItemHolder holder;
    View view = convertView;

    if (view == null) {
        LayoutInflater inflater = ((Activity) this.context).getLayoutInflater();
        holder = new ArtItemHolder();
        view = inflater.inflate(R.layout.feed_list_item, parent, false);

        holder.image = (ImageView) view.findViewById(R.id.img_Image);
        holder.pubDate = (TextView) view.findViewById(R.id.txt_puslishDate);
        holder.arTitle = (TextView) view.findViewById(R.id.txt_arTitle);
        holder.commentCount = (TextView) view.findViewById(R.id.txt_commentCount);
        holder.rotator  = (ImageView) view.findViewById(R.id.card_roretor);
        holder.cardFace = view.findViewById(R.id.card_face);// first of 2 child parent layout of feed_list_item.xml
        holder.cardBack = view.findViewById(R.id.card_back);// second of 2 child parent layout of feed_list_item.xml
        view.setTag(holder);
    } else {
        holder = (AdvItemHolder) view.getTag();
    }

    holder.rotator.setOnClickListener(new MyFlipperListener(view, holder.cardFace, holder.cardBack));

    return view;
}


private class MyFlipperListener implements OnClickListener{
    View parent, frontFace, backFace;

    public MyFlipperListener(View parent, View frontFace, View backFace) {
        this.parent = parent;
        this.frontFace = frontFace;
        this.backFace = backFace;
    }

    public void onClick(View v) {
        FlipAnimation flipAnimation = new FlipAnimation(frontFace, backFace);
        if (frontFace.getVisibility() == View.GONE)
        {
            flipAnimation.reverse();
        }

        parent.startAnimation(flipAnimation);
    }

}

private static class ArtItemHolder{
    ImageView image;
    TextView pubDate;
    TextView arTitle;
    TextView commentCount;
    ImageView rotator;
    View cardFace, cardBack;
}

我在listview中的项目布局xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" 
    android:gravity="center">

    <LinearLayout
        android:id="@+id/card_face"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" 
        android:background="@drawable/feed_item_selector"
        android:layout_margin="8dip"
        android:padding="2dip">

     ########## MAIN CONTENT HERE ###########

    </LinearLayout>
    <LinearLayout
        android:id="@+id/card_back"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" 
        android:background="@drawable/feed_item_selector"
        android:layout_margin="8dip"
        android:padding="2dip"
        android:visibility="gone">

     ########## SOME INFO ABOUT MAIN CONTENT HERE ###########

    </LinearLayout>
</LinearLayout>

更新

FlipAnimation flipAnimation = new FlipAnimation(holder.cardFace, holder.cardBack);
holder.rotator.setOnClickListener(new MyFlipperListener(view, holder.cardFace, flipAnimation));

private class MyFlipperListener implements OnClickListener{
        View parent, frontFace;
        FlipAnimation flipAnimation;
        public MyFlipperListener(View parent, View frontFace, FlipAnimation flip) {
            this.parent = parent;
            this.frontFace = frontFace;
            this.flipAnimation = flip;
        }

        public void onClick(View v) {
            if (frontFace.getVisibility() == View.GONE){
                flipAnimation.reverse();
            }
            parent.startAnimation(flipAnimation);
        }
    }

2 个答案:

答案 0 :(得分:0)

你的问题是这些问题:

FlipAnimation flipAnimation = new 
FlipAnimation(holder.cardFace, holder.cardBack);
holder.rotator.setOnClickListener(new MyFlipperListener(view, holder.cardFace, flipAnimation ));

您的动画也会应用于其他项目,因为适配器会重复使用视图!您也可以通过在onClickListener中设置getView来解决问题。更好的方法是将其设置在外部,例如使用yourListView.setOnItemClickListener。希望它有所帮助:)

答案 1 :(得分:0)

ayt检查我的解决方案......

public View getView(final int position, final View convertView, ViewGroup parent) {
ArtItemHolder holder;
View view = convertView;

if (view == null) {
    LayoutInflater inflater = ((Activity)context).getLayoutInflater();
    holder = new ArtItemHolder();
    view = inflater.inflate(R.layout.feed_list_item, parent, false);

    holder.image = (ImageView) view.findViewById(R.id.img_Image);
    holder.pubDate = (TextView) view.findViewById(R.id.txt_puslishDate);
    holder.arTitle = (TextView) view.findViewById(R.id.txt_arTitle);
    holder.commentCount = (TextView) view.findViewById(R.id.txt_commentCount);
    holder.rotator  = (ImageView) view.findViewById(R.id.card_roretor);
    holder.rotator.setTag(false); // put a boolean here..
    holder.cardFace = view.findViewById(R.id.card_face);// first of 2 child parent layout of feed_list_item.xml
    holder.cardBack = view.findViewById(R.id.card_back);// second of 2 child parent layout of feed_list_item.xml
    holder.flipAnimation = new FlipAnimation(holder.cardFace, holder.cardBack);
    view.setTag(holder);
} else {
    holder = (AdvItemHolder) view.getTag();
}

holder.rotator.setOnClickListener(new OnClickListener() {

   @Override
   public void onClick(View v) {
     // TODO Auto-generated method stub
     if (!((Boolean) v.getTag()).booleanValue()){
     v.setTag(true); // switch boolean
     // you can either call notifydatasetchanged to show changes by the change function or put the change function here
     }else{v.setTag(false); // switch boolean again if it has already been clicked}
      }
 }));
 // i am putting the changes here-(change function) so intend i call notifydatasetchanged in the onclick
 // but it depends on your preference
 // check the boolean instead of view being visible..
        if (((Boolean) view.findViewById(R.id.card_roretor).getTag()).booleanValue()){ 
            flipAnimation.reverse();
            view.findViewById(R.id.card_roretor).startAnimation(holder.flipAnimation);
        }
 // end of the change function
return view;
}

...............................

private static class ArtItemHolder{
 ImageView image;
 TextView pubDate;
 TextView arTitle;
 TextView commentCount;
 ImageView rotator;
 View cardFace, cardBack;
 FlipAnimation flipAnimation;
}