2010-07-29 3 views
27

애니메이션을 만들어야합니다 -보기를 뒤집고 다른 것을 보여주세요.Android 애니메이션 - 뒤집기

현재 표시된보기의 너비가 0으로 천천히 감소한 후 표시 할보기의 너비를 0에서 증가시켜야합니다.

이 시간 동안 높이는 현재 표시된 높이에서 약간 감소 된 높이로 다시 돌아갑니다.

어떻게해야합니까? ViewFlipper를 사용하면됩니다.

답변

42

ScaleAnimationsViewFlipper으로 설정하면됩니다. 나는 두 번째 척도가없는 비슷한 일을한다. 두 개의 애니메이션이 있습니다. 하나는보기로 나가는 것이고 다른 하나는보기로 들어오는 것입니다. 나는 여기를 당신을위한 출발점으로 게시 할 것입니다.

shrink_to_middle.xml

<set xmlns:android="http://schemas.android.com/apk/res/android"> 
    <scale 
     android:interpolator="@android:anim/linear_interpolator" 
     android:fromXScale="1.0" 
     android:toXScale="1.0" 
     android:fromYScale="1.0" 
     android:toYScale="0.0" 
     android:fillAfter="false" 
     android:duration="200" /> 
    <translate 
     android:fromYDelta="0" 
     android:toYDelta="50%" 
     android:duration="200"/> 
</set> 

grow_from_middle.xml

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android"> 
    <scale 
     android:interpolator="@android:anim/linear_interpolator" 
     android:fromXScale="1.0" 
     android:toXScale="1.0" 
     android:fromYScale="0.0" 
     android:toYScale="1.0" 
     android:fillAfter="false" 
     android:startOffset="200" 
     android:duration="200" /> 
    <translate 
     android:fromYDelta="50%" 
     android:toYDelta="0" 
     android:startOffset="200" 
     android:duration="200"/> 
</set> 

그런 다음 응용 프로그램에서 나는이 같은 ViewFlipper로 설정합니다

mViewFlipper.setInAnimation(context, R.anim.grow_from_middle); 
mViewFlipper.setOutAnimation(context, R.anim.shrink_to_middle); 

내가 말했듯이 이것은 당신이 묘사 한 것과 정확히 똑같지는 않지만 꽤 가깝고 시작하게 할 것입니다. 여기

--EDIT--는 pivotX와 및 pivotY를 사용하는 코드입니다 (물론, 내 경우에는 단지 pivotY) :

shrink_to_middle.xml

<?xml version="1.0" encoding="utf-8"?> 
<scale 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/linear_interpolator" 
    android:fromXScale="1.0" 
    android:toXScale="1.0" 
    android:fromYScale="1.0" 
    android:toYScale="0.0" 
    android:pivotY="50%" 
    android:fillAfter="false" 
    android:duration="200" /> 

grow_from_middle.xml

<?xml version="1.0" encoding="utf-8"?> 
<scale 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/linear_interpolator" 
    android:fromXScale="1.0" 
    android:toXScale="1.0" 
    android:fromYScale="0.0" 
    android:toYScale="1.0" 
    android:pivotY="50%" 
    android:fillAfter="false" 
    android:startOffset="200" 
    android:duration="200" /> 
+2

감사합니다. 확실히 좋은 선발 투수. 다른 애니메이션 (번역)을 사용하는 대신 pivotX = 50 %, pivotY = 50 % 및 기타 변경 사항을 만들었습니다. 스타터에게 감사합니다. –

+0

니스! pivotX에 대한 팁 주셔서 감사합니다, pivotY! – CaseyB

+1

pivotX를 사용하여 코드를 제공 하시겠습니까? pivotY – gypsicoder

3

CaseyB에서 설명한이 특정 애니메이션 (플립)을 포함하고 확장하는 새 라이브러리 FlipView을 개발했습니다. Gmail 이미지 뒤집기를 포함하여 모든 종류의 애니메이션과 모양을 사용하여 모든 종류의보기 및 레이아웃을 교환 할 수있는 완전히 사용자 정의 가능한 라이브러리를 의미합니다.

보세요.

1

CaseAB의 objectAnimator 응답의 스케일 애니메이션을 사용합니다. res 아래에 애니메이터 폴더가 없다면이 애니메이터 폴더에 objectAnimator 레이아웃이 있어야합니다.

입술/애니메이션/shrink_to_middle.xml

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android"> 
    <objectAnimator 
     android:valueFrom="1.0" 
     android:valueTo="0.0" 
     android:propertyName="scaleX" 
     android:duration="200"/> 
</set> 

입술/애니메이션/grow_from_middle.XML

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android"> 
    <objectAnimator 
     android:valueFrom="0.0" 
     android:valueTo="1.0" 
     android:propertyName="scaleX" 
     android:duration="200" 
     android:startOffset="200"/> 
</set> 

코드 : 포인터에 대한

ImageView iv = (ImageView) findViewById(R.id.my_image); 
AnimatorSet shrinkSet = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.shrink_to_middle); 
shrinkSet.setTarget(iv); 
shrinkSet.start(); 

iv.setImageResource(R.drawable.another_image); 

AnimatorSet growSet = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.grow_from_middle); 
growSet.setTarget(iv); 
growSet.start();