2012-06-21 54 views
21

Tôi có một số ImageView s trong một RelativeLayout. bây giờ, khi người dùng chạm vào bất kỳ ImageView nào, tôi muốn nó được di chuyển đến một vị trí được chỉ định với hoạt ảnh tinh tế.Di chuyển một ImageView đến vị trí khác nhau theo cách hoạt hình trong Android

Ví dụ: Ban đầu, tôi đã đặt lề cho LayoutParams được liên kết với một số ImageViewlayoutparams1.setMargins(90,70,0,0); và sau đó thêm nó vào bố cục.

và khi lần xem hình ảnh được nhấn, tôi muốn vị trí mới của nó là 200,200, với hoạt ảnh.

Vì vậy, có thể không? nếu có thì làm sao?

Lưu ý rằng tôi có cả hai RelativeLayout và tất cả các con ImageView s được tạo theo chương trình.

Và tôi mới phát triển Android nên một câu trả lời phức tạp được mong đợi.

Trả lời

49
TranslateAnimation animation = new TranslateAnimation(0, 50, 0, 100); 
animation.setDuration(1000); 
animation.setFillAfter(false); 
animation.setAnimationListener(new MyAnimationListener()); 

imageView.startAnimation(animation); 

UPDATE: Vấn đề là các View là thực sự vẫn còn ở đó là vị trí cũ. Vì vậy, chúng tôi phải di chuyển nó khi hoạt ảnh kết thúc. Để phát hiện khi các hình ảnh động kết thúc, chúng ta phải tạo riêng của chúng tôi animationListener (bên trong lớp activity của chúng tôi):

private class MyAnimationListener implements AnimationListener{ 

    @Override 
    public void onAnimationEnd(Animation animation) { 
     imageView.clearAnimation(); 
     LayoutParams lp = new LayoutParams(imageView.getWidth(), imageView.getHeight()); 
     lp.setMargins(50, 100, 0, 0); 
     imageView.setLayoutParams(lp); 
    } 

    @Override 
    public void onAnimationRepeat(Animation animation) { 
    } 

    @Override 
    public void onAnimationStart(Animation animation) { 
    } 

} 

Vì vậy, các onClickEvent sẽ bị sa thải một lần nữa lúc đó là nơi ở mới. Hoạt ảnh bây giờ sẽ di chuyển xuống nhiều hơn nữa, vì vậy bạn có thể muốn lưu xy trong một biến, để trong onAnimationEnd() bạn di chuyển nó không đến vị trí cố định.

+2

trình !! nhưng ở vị trí mới của ImageView, nó không phản hồi bất kỳ sự kiện nhấn nào và cũng có thể, nếu tôi nhấp vào vị trí trước đó của nó, một phiên bản khác của cùng một hoạt ảnh tưởng tượng. Bất kỳ cách nào để khắc phục nó? – Kushal

+0

Cảm ơn rất nhiều !! nhưng định vị lại trong 'onAnimationEnd()' khiến cho số lần xem hình ảnh nhấp nháy một lần. : -/ – Kushal

+1

Trước khi thiết lập LayoutParms bạn phải xóa hoạt ảnh (xem ở trên) –

4

cũng tốt hơn là sử dụng ObjectAnimator. chế độ xem di chuyển này ở vị trí mới. ví dụ:

ImageView splash ; 
@Override 
public boolean onTouchEvent(MotionEvent event) { 
    float tx = event.getX(); 
    float ty = event.getY(); 

    int action = event.getAction(); 
    switch(action) { 
     case MotionEvent.ACTION_DOWN: 
      tx = event.getX(); 
      ty = event.getY(); 

      //  findViewById(R.id.character).setX(tx-45); 
      //  findViewById(R.id.character).setY(ty-134); 

      ObjectAnimator animX = ObjectAnimator.ofFloat(splash, "x", tx-45); 
      ObjectAnimator animY = ObjectAnimator.ofFloat(splash, "y", ty-134); 
      AnimatorSet animSetXY = new AnimatorSet(); 
      animSetXY.playTogether(animX, animY); 
      animSetXY.start(); 

      break; 
     default: 
    } 
    return true; 
} 
+0

Thích cái này là tốt nhất. – creativecreatorormaybenot

2

Trong mã bên dưới, tôi thêm chế độ xem hình ảnh ở chính giữa trên bố cục khung. Sau khi thêm tôi tăng quy mô và thiết lập alpha để cung cấp cho hiệu ứng zoom và sau khi hoàn thành hoạt hình tôi chỉ dịch hình ảnh của tôi xem một vị trí đến vị trí khác. xem hình ảnh

Thêm vào framelayout

imgHeart = new ImageView(getBaseContext()); 
    imgHeart.setId(R.id.heartImage); 
    imgHeart.setImageResource(R.drawable.material_heart_fill_icon); 
    imgHeart.setLayoutParams(new FrameLayout.LayoutParams(50, 50, Gravity.CENTER)); 
    mainFrameLaout.addView(imgHeart); 

Thêm hình ảnh động trên xem hình ảnh

 imgHeart.animate() 
      .scaleXBy(6) 
      .scaleYBy(6) 
      .setDuration(700) 
      .alpha(2) 
      .setListener(new Animator.AnimatorListener() { 
       @Override 
       public void onAnimationStart(Animator animation) { 

       } 

       @Override 
       public void onAnimationEnd(Animator animation) { 
        imgHeart.animate() 
          .scaleXBy(-6f).scaleYBy(-6f) 
          .alpha(.1f) 
          .translationX((heigthAndWidth[0]/2) - minusWidth) 
          .translationY(-((heigthAndWidth[1]/2) - minusHeight)) 
          .setDuration(1000) 
          .setListener(new Animator.AnimatorListener() { 
           @Override 
           public void onAnimationStart(Animator animation) { 
           } 

           @Override 
           public void onAnimationEnd(Animator animation) { 
           // remove image view from framlayout 
           } 
           @Override 
           public void onAnimationCancel(Animator animation) { 
           } 

           @Override 
           public void onAnimationRepeat(Animator animation) { 
           } 
          }).start(); 
       } 

       @Override 
       public void onAnimationCancel(Animator animation) { 

       } 

       @Override 
       public void onAnimationRepeat(Animator animation) { 

       } 
      }).start(); 
+1

đây là một giải pháp đơn giản và rất đẹp. Nó hoạt động .. –

Các vấn đề liên quan