Android Flipper Animation

[Rainbow]

Hallo zusammen,

ich bräuchte eine ganz bestimmte Animation und weiß leider nicht wie man diese realisieren kann.

Ich habe eine Oberfläche bei der ich drei ViewFlipper linear untereinander anordne. Die ViewFlipper sind alle identisch groß. Also jede Höhe 33% des Displays.
Wenn ich jetzt einen ViewFlipper anklicke wird natürlich erstmal das nächste Element des ViewFlippers angezeigt und außerdem vergrößert sich die Höhe um das doppelte und die beiden anderen Elemente passen sich prozentual an. Ich habe also dann einen ViewFlipper der 66% des Displays einnimmt und die beiden anderen jeweils 17%.

Jetzt möchte ich das es nicht so aussieht, dass ich plötzlich einen größeren Ausschnitt habe, sondern der ViewFlipper langsam größer wird.
Ich meine keinen Zoom. Gezoomt wird da gar nichts. Lediglich der Ausschnitt wird höher.

Wie kann ich also eine Animation schreiben, wo ein Element, kann ja auch ein LinearLayout sein, langsam größer wird und die restlichen langsam kleiner?

TransformAnimation kanns nicht sein, weil ich ja nichts verschiebe. Scale auch nicht, weil ich nichts zoome...

Mein Beispielcode:
[XML]<LinearLayout 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"
androidrientation="vertical" >

<ViewFlipper
android:id="@+id/flippy1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#3366FF" />

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#3366FF"
android:text="@string/example"
android:textSize="50dp" />
</ViewFlipper>

<ViewFlipper
android:id="@+id/flippy2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#CC33FF" />

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#CC33FF"
android:text="@string/example"
android:textSize="50dp" />
</ViewFlipper>

<ViewFlipper
android:id="@+id/flippy3"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFCC33" />

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFCC33"
android:text="@string/example"
android:textSize="50dp" />
</ViewFlipper>

<ViewFlipper
android:id="@+id/flippy4"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#009933" />

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#009933"
android:text="@string/example"
android:textSize="50dp" />
</ViewFlipper>

</LinearLayout>[/XML]

package de.test.animationtest;

import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.widget.ViewFlipper;
import android.app.Activity;

public class MainActivity extends Activity {

	private ViewFlipper[] _flippies;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		final ViewFlipper flippy1 = (ViewFlipper) findViewById(R.id.flippy1);
		final ViewFlipper flippy2 = (ViewFlipper) findViewById(R.id.flippy2);
		final ViewFlipper flippy3 = (ViewFlipper) findViewById(R.id.flippy3);
		final ViewFlipper flippy4 = (ViewFlipper) findViewById(R.id.flippy4);

		_flippies = new ViewFlipper[4];
		_flippies[0] = flippy1;
		_flippies[1] = flippy2;
		_flippies[2] = flippy3;
		_flippies[3] = flippy4;

		OnClickListener onClickListener = new OnClickListener() {

			@Override
			public void onClick(View v) {
				switch (v.getId()) {
				case R.id.flippy1:
					flippyClicked(0);
					break;
				case R.id.flippy2:
					flippyClicked(1);
					break;
				case R.id.flippy3:
					flippyClicked(2);
					break;
				case R.id.flippy4:
					flippyClicked(3);
					break;
				}
			}

		};

		flippy1.setOnClickListener(onClickListener);
		flippy2.setOnClickListener(onClickListener);
		flippy3.setOnClickListener(onClickListener);
		flippy4.setOnClickListener(onClickListener);
	}

	private void flippyClicked(int index) {
		LayoutParams layoutParams = _flippies[index].getLayoutParams();
		int oldHeight = _flippies[index].getHeight();
		int newHeight = oldHeight * 2;
		layoutParams.height = newHeight;
		_flippies[index].setLayoutParams(layoutParams);

		int availableHeight = (oldHeight * _flippies.length) - newHeight;
		int heightOtherFlippies = availableHeight / (_flippies.length - 1);

		for (int i = 0; i < _flippies.length; i++) {
			if (i != index) {
				ViewFlipper actualFlipper = _flippies[i];
				LayoutParams layoutParamsActualFlipper = actualFlipper.getLayoutParams();
				layoutParamsActualFlipper.height = heightOtherFlippies;
				actualFlipper.setLayoutParams(layoutParamsActualFlipper);
				actualFlipper.setDisplayedChild(0);
			}
		}
		
		_flippies[index].showNext();
	}
}

strings.xml:
[XML]<resources>

<string name="example">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</string>
<string name="app_name">Animationstest</string>
<string name="title_activity_main">Animationstest</string>

</resources>[/XML]

Manifest:
[XML]<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="de.test.animationtest"
android:versionCode="1"
android:versionName="1.0" >

<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="15" />

<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="@string/title_activity_main" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>

</manifest>[/XML]
Liebe Grüße
Rainbow

 

[schlingel]

Du kannst ausprobieren ob das mit einer LayoutAnimation funktioniert. Da wird dann auf jedes Kindelement eine bestimmte Animation ausgeführt. In deinem Fall ein scale.

 

[Rainbow]

Es gibt ja für den ViewFlipper ein setIn- und setOutAnimation. Frage ist nur welche.

Ich dachte scale hieße das gezoomt wird? Zoomen möchte ich ja nicht....

 

[schlingel]

Du möchtest eine View vergrößern, also passt das schon. Ausprobieren ob es hinhaut. Irgendwo habe ich gesehen, dass jemand Probleme damit hatte weil die View wieder auf Ursprungsgröße ging. Das willst du ja nicht.

Du musst die Animation für's Eltern-Element setzen. In- und OutAnimation sind ja dazu da um die Animation der Kindelemente des Flippers rein- bzw. rauszuschieben.

 

[Rainbow]

Wieder auf die Ursprungsgröße springen tut es nur wenn man setFillAfter(true) nicht setzt.

Ich glaub ich verstehs....muss ich mal ausprobieren..auf jedenfall ist das setzen meiner LayoutParams dann überflüssig. ... muss ich mal schauen

 

[Rainbow]

Also das funktioniert leider nicht. wenn ich die Animation starte wird alles innerhalb meiner ViewFlipper gezoomt, aber der ViewFlipper an sich bleibt so groß wie er vorher war.
Ich möchte ja genau das Gegenteil haben. Alles innerhalb meines ViewFlippers bleibt so groß wie es ist...da wird nichts gezoomt. nur der ViewFlipper selbst muss größer werden.
Also Flipper ja, Inhalt nein.

Im Prinzip also kein zoomen sondern die Höhe des Auschnitts neu setzen. Weil ja der Inhalt nicht größer werden soll.

 

[schlingel]

Hast du denn wirklich die Eltern-ViewGroup verwendet, also nicht den ViewFlipper sondern die ViewGroup in die, die Flipper eingebettet sind?

 

[Rainbow]

dann müsste ich erstmal um jeden ViewFlipper ein LinearLayout bauen, wenn ich das richtig verstehe....weil momentan gibt es um alle ViewFlipper nur das gleiche Elternelement...
also so:
[XML]<LinearLayout 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"
androidrientation="vertical" >

<LinearLayout
android:id="@+id/layout1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.25" >

<ViewFlipper
android:id="@+id/flippy1"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#3366FF" />

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#3366FF"
android:text="@string/example"
android:textSize="50dp" />
</ViewFlipper>
</LinearLayout>
</LinearLayout[/XML]

Hat den gleichen Effekt. Das LinearLayout und der TextView innerhalb des ViewFlipper werden gezoomt, was sie gar nicht sollen.
Also wie sag ich jetzt das die Kindelemente nicht animiert werden sollen?

Hinzu kommt noch das sich die restlichen Elemente natürlich prozentual gleichmäßig verteilt relativ zueinander anpassen sollen. Damit ein fließender Übergang entsteht.

 

[Rainbow]

Konkret hab ich gerade noch dieses Problem:

Wie verhindere ich das die Scale Animation auf die Kindelemente zugreift? NUR das EINE Element soll animiert werden, keine Kinder

 

[Rainbow]

Ich suche immer noch nach einer Lösung, weiß jemand mehr?

 

[Rainbow]

Ich habe jetzt einen Thread gestartet, wo ich selber zeichne und die LayoutParams neu setze.