Animate ImageView-Breite ohne Skalierung

Question

Ich versuche, ein ImageView so zu animieren, dass es langsam von links nach rechts angezeigt wird. Wenn I asked this before ich hatte Mühe zu erklären, was ich wollte, so dass dieses Mal habe ich den gewünschten Effekt mit Hilfe von HTML/JS:

http://jsfiddle.net/E2uDE/

Was wäre der beste Weg sein, diesen Effekt in Android zu bekommen?

Ich versuchte, die Scaletype zu ändern und dann eine ScaleAnimation direkt zu diesem Image Anwendung:

Layout:

<ImageView 
    android:id="@+id/graphImage" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentTop="true" 
    android:scaleType="centerCrop" 
    android:background="@android:color/transparent" 
    android:contentDescription="@string/stroom_grafiek" 
    /> 

Java:

scale = new ScaleAnimation((float)0, 
     (float)1, (float)1, (float)1, 
     Animation.RELATIVE_TO_SELF, (float)0, 
     Animation.RELATIVE_TO_SELF, (float)1); 
scale.setDuration(1000); 

graphImage.startAnimation(scale); 

Aber der Stil skaliert Bild.

Ich habe auch versuchte das Image in einem FrameLayout Einwickeln, ich habe gerade die FrameLayout animiere die Hoffnung könnte:

<FrameLayout 
    android:layout_width="70dp" 
    android:layout_height="fill_parent" 
    android:clipChildren="true""> 
    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="bottom|left|clip_horizontal" /> 
</FrameLayout> 

Dies wird nach wie vor versuchen, mein Image maßstäblich in der FrameLayout zu passen.

Answer 1

Es gibt mehrere Möglichkeiten, dies zu tun - eine Möglichkeit besteht darin, einfach den Clip auf der Zeichenfläche (d. H. Den Bereich, in dem die Ansicht zeichnen darf) des ImageView Zeichens zu ändern. Wenn Sie den rechten Rand der Zeichenbegrenzungen langsam vergrößern, wird der gleiche Effekt wie in der Beispielverknüpfung erzielt.

Ich habe einige example code geschrieben, die diese Technik veranschaulicht. Wenn Sie das Projekt herunterladen/erstellen/ausführen, klicken Sie auf das Bild, um die Enthüllungsanimation auszuführen.

Werfen Sie einen Blick auf die onDraw Methode der CoveredImageView Klasse, die die folgende Grundstruktur hat:

@Override 
protected void onDraw(Canvas canvas) { 
    ... 
    canvas.getClipBounds(mRect); 
    mRect.right = ...; 
    canvas.clipRect(mRect); 
    ... 
    super.onDraw(canvas); 
    ... 
    invalidate(); 
} 

Der Clip eingestellt wird und dann ungültig() aufgerufen wird, verursacht OnDraw() erneut aufgerufen werden .

Ich habe auch etwas Code geschrieben, um den richtigen Clip-Wert aus der verstrichenen Zeit zu interpolieren, die nicht von einer bestimmten Android-Version abhängt. Von Android 3.0 gibt es jedoch ein neues Animationsframework und eine ValueAnimator Klasse, mit der solche Aufgaben ausgeführt werden können.

Answer 2

Sie könnten Ihren Bildausschnitt mit einem anderen überlappen, z. B. mit einem einfachen weißen Zeichensatz. Dann können Sie die überlappende Bildansicht animieren, ohne sich Gedanken über die Skalierung zu machen, bis sie eine Breite von 0 hat und sie entfernen. Damit das funktioniert, müssen Sie Ihr imageView in einem RelativeLayout ofc ablegen.