Animate ImageView chiều rộng mà không cần chia tỷ lệ

Question

Tôi đang cố gắng tạo hoạt ảnh cho ImageView để từ từ hiển thị từ trái sang phải. Khi I asked this before tôi đã gặp khó khăn để giải thích những gì tôi muốn, vì vậy lần này tôi đã tạo ra hiệu quả mong muốn sử dụng HTML/JS:

http://jsfiddle.net/E2uDE/

Điều gì sẽ là cách tốt nhất để có được hiệu ứng này trong Android?

tôi đã cố gắng thay đổi scaleType và sau đó áp dụng một ScaleAnimation trực tiếp đến ImageView rằng:

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); 

Nhưng điều này stil quy mô các hình ảnh.

Tôi cũng đã cố gắng gói các ImageView trong một FrameLayout, hy vọng tôi có thể chỉ cần animate FrameLayout:

<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> 

này vẫn sẽ cố gắng để mở rộng ImageView tôi để phù hợp với bên trong FrameLayout.

Answer 1

Có một số cách để thực hiện việc này - một cách đơn giản là thay đổi clip trên canvas (tức là khu vực mà chế độ xem được phép vẽ) của hình ảnh ImageView. Từ từ tăng cạnh bên phải của giới hạn vẽ sẽ dẫn đến hiệu ứng tương tự như trong liên kết ví dụ của bạn.

Tôi đã viết một số example code minh họa kỹ thuật này. Nếu bạn tải xuống/xây dựng/chạy dự án, nhấp vào hình ảnh sẽ chạy hoạt ảnh tiết lộ.

Có xem xét phương pháp onDraw của lớp CoveredImageView, trong đó có cấu trúc cơ bản sau đây:

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

Đoạn clip được điều chỉnh và sau đó làm mất hiệu lực() được gọi, gây OnDraw() được gọi là một lần nữa .

Tôi cũng đã viết một số mã để nội suy giá trị clip phù hợp từ thời gian đã trôi qua, không phụ thuộc vào bất kỳ phiên bản Android cụ thể nào. Tuy nhiên, như một lưu ý, từ Android 3.0 có một khung hoạt hình mới và một lớp học ValueAnimator có thể giúp thực hiện các tác vụ như vậy.

Answer 2

Bạn có thể chồng chéo lần xem hình ảnh của mình với một số khác, ví dụ: một hình ảnh có màu trắng đồng nhất có thể vẽ được. Sau đó, bạn có thể tạo hiệu ứng cho các lần xem hình chồng chéo mà không phải lo lắng về tỷ lệ cho đến khi nó có chiều rộng là 0 và loại bỏ nó. Để làm được điều đó, bạn phải đặt imageView của mình trong một RelativeLayout ofc.