2010-12-26 5 views
9

Wie Objekt, ich würde Fade-Effekt zwischen zwei Layout reproduzieren. Jetzt habe ich diese Situation:Fade-Effekt zwischen den Layouts

LinearLayout l; 
LinearLayout l2; 

zwischen ihnen wechseln I

l.setVisibility(View.GONE); 
l2.setVisibility(View.VISIBLE); 

Ich will hinzufügen Effekt verblasst verwendet habe zwischen dieser transiction, wie kann ich es tun?

Antwort

3

Mit R.anim.fade_out & .R.anim.fade_in können Sie eine Animation erstellen, die dies tut. Ich weiß nicht viel darüber selbst aber Heres ein Tutorial in Bezug auf Animationen in Android: Animation Tutorial

P.S. Dieses Tutorial gehört mir nicht, also geht es mir nicht gut.

Edit:

AnimationSet set = new AnimationSet(true); 

Animation animation = new AlphaAnimation(0.0f, 1.0f); 
animation.setDuration(50); 
set.addAnimation(animation); 

animation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0.0f,Animation.RELATIVE_TO_SELF, 0.0f, 
Animation.RELATIVE_TO_SELF, -1.0f,Animation.RELATIVE_TO_SELF, 0.0f 
); 
animation.setDuration(100); 
set.addAnimation(animation); 

LayoutAnimationController controller = new LayoutAnimationController(set, 0.5f); 
l.setLayoutAnimation(controller); 

Fade out-Animation

public static Animation runFadeOutAnimationOn(Activity ctx, View target) { 
    Animation animation = AnimationUtils.loadAnimation(ctx,android.R.anim.fade_out); 
    target.startAnimation(animation); 
    return animation; 
} 

Ich vermute, Sie so etwas wie diese versuchen kann, kopiere ich die Animation aus dem Tutorial klebte ich nicht weiß, was es tut, Genau wie ich keine Erfahrung mit Android-Entwicklung habe. Ein weiteres Beispiel könnte Example 2

+1

Ich möchte android.R.anim.fade_in und fade_out verwenden und ich habe etwas über Methode overridePendingTransiction gelesen. Aber ich verstehe nicht, wie man Animation auf LinearLayout setzt. Kannst du mir helfen? – CeccoCQ

+0

Das Tutorial behandelt die anim.fade_in und fade_out, wenn Sie einen Bildlauf nach unten durchführen, können Sie Beispielcode sehen! Das sollte dich in Schwung bringen, denke ich. – Citroenfris

21

sein Hier ist eine Arbeitslösung verblassen zwischen zwei Layouts zu überqueren:

public class CrossFadeActivity extends Activity { 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.crossfade); 

    final View l1 = findViewById(R.id.l1); 
    final View l2 = findViewById(R.id.l2); 

    final Animation fadeOut = AnimationUtils.loadAnimation(CrossFadeActivity.this, R.anim.fade_out); 
    final Animation fadeIn = AnimationUtils.loadAnimation(CrossFadeActivity.this, R.anim.fade_in); 

    findViewById(R.id.button1).setOnClickListener(new OnClickListener() { 
     @Override 
     public void onClick(View v) { 
      fadeOut.setAnimationListener(new AnimationListener() { 
       @Override 
       public void onAnimationStart(Animation animation) { 
       } 

       @Override 
       public void onAnimationRepeat(Animation animation) { 
       } 

       @Override 
       public void onAnimationEnd(Animation animation) { 
        l1.setVisibility(View.GONE); 
       } 
      }); 
      l1.startAnimation(fadeOut); 
      l2.setVisibility(View.VISIBLE); 
      l2.startAnimation(fadeIn); 
     } 
    }); 
    findViewById(R.id.button2).setOnClickListener(new OnClickListener() { 
     @Override 
     public void onClick(View v) { 
      fadeOut.setAnimationListener(new AnimationListener() { 
       @Override 
       public void onAnimationStart(Animation animation) { 
       } 

       @Override 
       public void onAnimationRepeat(Animation animation) { 
       } 

       @Override 
       public void onAnimationEnd(Animation animation) { 
        l2.setVisibility(View.GONE); 
       } 
      }); 
      l2.startAnimation(fadeOut); 
      l1.setVisibility(View.VISIBLE); 
      l1.startAnimation(fadeIn); 
     } 
    }); 
} 
} 

crossfade.xml:

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

<LinearLayout 
    android:id="@+id/l1" 
    android:layout_width="fill_parent" 
    android:layout_height="300dip" 
    android:orientation="vertical" 
    android:background="@drawable/someimage" 
    > 

    <Button 
     android:id="@+id/button1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Button" /> 

</LinearLayout> 

<RelativeLayout 
    android:id="@+id/l2" 
    android:layout_width="fill_parent" 
    android:layout_height="300dip" 
    android:orientation="vertical" 
    android:background="@drawable/someimage2" 
    android:visibility="gone" 
    > 

    <Button 
     android:id="@+id/button2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Button" 
     android:layout_centerInParent="true" 
     /> 

</RelativeLayout> 

</RelativeLayout> 

Wo l1 und l2 sind 2 willkürliches Beispiel Layouts. Der Trick besteht darin, sie so in XML zu setzen, dass sie sich mit visible/gone überlappen (z. B. in RelativeLayout), Listener zu den Animationen hinzufügen, um die Sichtbarkeit auf Finish umzuschalten, und die Ansicht, die vor dem Animation startet, ansonsten ist die Animation nicht sichtbar.

Ich setze die Knöpfe mit den Listenern, um die Animation in den Layouts selbst umzuschalten, weil ich es so implementieren muss, aber der Klick-Listener kann natürlich woanders sein (wenn es nur eins ist sollte es in Kombination verwendet werden) etwas Flagge oder überprüfen Sie, wie man umschaltet).

Dies sind die Animationsdateien. Sie haben in Ordner res/anim gespeichert werden:

fade_in.xml

<?xml version="1.0" encoding="UTF-8"?> 
<alpha xmlns:android="http://schemas.android.com/apk/res/android" 
android:duration="1000" 
android:fillAfter="true" 
android:fromAlpha="0.0" 
android:toAlpha="1.0" /> 

fade_out.xml

<?xml version="1.0" encoding="UTF-8"?> 
<alpha xmlns:android="http://schemas.android.com/apk/res/android" 
android:duration="1000" 
android:fillAfter="true" 
android:fromAlpha="1.0" 
android:toAlpha="0" /> 

UPDATE:

Statt R.anim.fade_in zu verwenden, Sie können die Standardeinblendung fade_in von Android API (android.R.fade_in) verwenden:

final Animation fadeIn = AnimationUtils.loadAnimation(CrossFadeActivity.this, android.R.anim.fade_in); 

Mit android.R.anim.fade_in müssen Sie die Datei res/anim/fade_in.xml nicht erstellen.

Android hat ein Paket mit einigen nützlichen Animationen auf android.R.Anim: http://developer.android.com/reference/android/R.anim.html

+2

Sie können auch die Methode '.bringToFront()' verwenden, um die Z-Reihenfolge der relativen Layouts umzukehren, falls der Benutzer mit dem Vordergrund interagieren muss. Diese Antwort deckt nur den Aspekt der Animation ab. –

2

Seit Android 3.0 Sie

android:animateLayoutChanges="true" 

in einem Layout in xml und Änderungen dieser spezifischen Layouts Inhalt zur Laufzeit verwenden können, werden animiert werden. Zum Beispiel, in Ihrem Fall, müssen Sie für das übergeordnete Layout l dieses Attribut für die Eltern setzen und l2 beispiel

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    tools:context="me.kalem.android.RegistrationActivity" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:animateLayoutChanges="true" 
    android:padding="20dp"> 

    <LinearLayout 
     android:id="@+id/l1" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:visibility="visible"> 

    ........ 

    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/l2" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:visibility="gone"> 

    ........ 

    </LinearLayout> 

</LinearLayout> 

Jetzt versteckt l1 und l2 zur Laufzeit zeigt, wird animiert werden.

Verwandte Themen