2017-02-21 10 views
7

hereのようなカードフリップアニメーションを実装しました。フリップの間に不思議な挙動を示す影を除いて、すべてがうまくいくようです(here参照)。これらの影は高さに起因するので、標高を0に設定するとこのグラフィカルエラーが消えます。しかし、影を無効にしたくないです。カードフリップ時の不思議なシャドウ動作

標高を無効にしないでこのアニメーションを修正するにはどうすればよいですか?これは不可能ですか?

FlashcardFragment.java

@Override 
public void onActivityCreated(Bundle savedInstanceState) { 
    super.onActivityCreated(savedInstanceState); 

    this.cardFront = (CardView) this.getView().findViewById(R.id.flashcard_front); 
    this.cardBack = (CardView) this.getView().findViewById(R.id.flashcard_back); 

    this.getView().setOnClickListener(new View.OnClickListener() 
    { 
     @Override 
     public void onClick(View view){ 
      flip(); 
     } 
    }); 

    float scale = this.getResources().getDisplayMetrics().density * 8000; 
    this.cardFront.setCameraDistance(scale); 
    this.cardBack.setCameraDistance(scale); 
    this.cardBack.setAlpha(0.0f); // hides back of card 
} 

public void flip() { 
    if (this.flipped) return; 
    this.flipped = true; 

    AnimatorSet animationOut = (AnimatorSet) AnimatorInflater.loadAnimator(this.getContext(), R.animator.flashcard_flip_out); 
    AnimatorSet animationIn = (AnimatorSet) AnimatorInflater.loadAnimator(this.getContext(), R.animator.flashcard_flip_in); 

    animationOut.setTarget(this.cardFront); 
    animationIn.setTarget(this.cardBack); 

    animationOut.start(); 
    animationIn.start(); 
} 

flashcard_flip_in.xml

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 

    <objectAnimator 
     android:valueFrom="-180" 
     android:valueTo="0" 
     android:propertyName="rotationY" 
     android:repeatMode="reverse" 
     android:duration="1000" /> 

    <objectAnimator 
     android:valueFrom="0.0" 
     android:valueTo="1.0" 
     android:propertyName="alpha" 
     android:startOffset="500" 
     android:duration="0" /> 

</set> 

flashcard_clip_out.xml

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android" > 

    <objectAnimator 
     android:valueFrom="0" 
     android:valueTo="180" 
     android:propertyName="rotationY" 
     android:duration="1000" /> 

    <objectAnimator 
     android:valueFrom="1.0" 
     android:valueTo="0.0" 
     android:propertyName="alpha" 
     android:startOffset="500" 
     android:duration="0" /> 

</set> 

fragment_flashcard.xml

<FrameLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="com.example.project.FlashcardFragment" > 

    <include layout="@layout/flashcard" 
     android:id="@+id/flashcard_back" /> 

    <include layout="@layout/flashcard" 
     android:id="@+id/flashcard_front" /> 

</FrameLayout> 

flashcard.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    card_view:cardCornerRadius="@dimen/card_corner_radius" 
    card_view:cardElevation="@dimen/card_elevation_raised" 
    card_view:cardUseCompatPadding="true" > 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:padding="@dimen/padding_default" > 

     <TextView style="@android:style/TextAppearance.Large" 
      android:id="@+id/flashcard_header" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" /> 

    </RelativeLayout> 

</android.support.v7.widget.CardView> 

答えて

5

コンテナレイアウトであなたのCardViewを入れてみてください:

<FrameLayout 
    android:id="@+id/card_container" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:padding="4dp"> 

    <include layout="@layout/flashcard" /> 

</FrameLayout> 
関連する問題