ImageView로 Android 페이드 인 및 페이드 아웃
지금 만들고있는 슬라이드 쇼에 문제가 있습니다.
페이드 인 및 페이드 아웃을 위해 xml로 2 개의 애니메이션을 만들었습니다.
fadein.xml
<?xml version="1.0" encoding="UTF-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="0.0" android:toAlpha="1.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:duration="2000"/>
</set>
fadeout.xml
<?xml version="1.0" encoding="UTF-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:fromAlpha="1.0" android:toAlpha="0.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:duration="2000"/>
</set>
내가하려는 것은 페이드 효과를 사용하여 ImageView에서 이미지를 변경하여 현재 표시된 이미지가 페이드 아웃되고 다른 이미지가 페이드 인되도록하는 것입니다. 이미 설정된 이미지가 있으므로이 이미지를 페이드 아웃하지 않고 페이드 아웃 할 수 있습니다. 문제, 이것으로 :
Animation fadeInAnimation = AnimationUtils.loadAnimation(this, R.anim.your_fade_in_anim);
imageView.startAnimation(fadeoutAnim);
하지만 다음 이미지를 표시하도록 설정했습니다.
imageView.setImageBitmap(secondImage);
그것은 단지 imageView에 나타나고, 내가 애니메이션을 설정할 때 그것은 이미지를 숨기고, 그것을 페이드 인합니다 ... 그것을 고칠 방법이 있습니까, 제 말은 imageView.setImageBitmap (secondImage); 명령을 실행하면 이미지가 즉시 표시되지 않고 페이드 인 애니메이션이 실행될 때만?
이것을 시작했던 방식으로 구현하려면 애니메이션 의 시작과 끝을 감지 할 수 있도록 AnimationListener 를 추가해야합니다 . 페이드 아웃에 대한 onAnimationEnd ()가 호출되면 ImageView 객체의 가시성을 View.INVISIBLE로 설정하고 이미지를 전환하고 애니메이션 페이드 인을 시작할 수 있습니다. 여기에도 또 다른 AnimationListener가 필요합니다. 페이드 인 애니메이션에 대한 onAnimationEnd ()를 수신 할 때 ImageView를 View.VISIBLE로 설정하면 원하는 효과를 얻을 수 있습니다.
이전에 비슷한 효과를 구현했지만 단일 ImageView가 아닌 2 개의 ImageView가 있는 ViewSwitcher 를 사용했습니다 . 페이드 인 및 페이드 아웃을 사용하여 ViewSwitcher의 "인"및 "아웃"애니메이션을 설정하여 AnimationListener 구현을 관리 할 수 있습니다. 그런 다음 2 개의 ImageView를 번갈아 사용하기 만하면됩니다.
편집 : 좀 더 유용하게 사용할 수 있도록 ViewSwitcher를 사용하는 방법에 대한 간단한 예가 있습니다. https://github.com/aldryd/imageswitcher에 전체 소스를 포함했습니다 .
activity_main.xml
<ViewSwitcher
android:id="@+id/switcher"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:inAnimation="@anim/fade_in"
android:outAnimation="@anim/fade_out" >
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="@drawable/sunset" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="@drawable/clouds" />
</ViewSwitcher>
MainActivity.java
// Let the ViewSwitcher do the animation listening for you
((ViewSwitcher) findViewById(R.id.switcher)).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
ViewSwitcher switcher = (ViewSwitcher) v;
if (switcher.getDisplayedChild() == 0) {
switcher.showNext();
} else {
switcher.showPrevious();
}
}
});
나는 당신과 같은 목표를 달성하기를 원했기 때문에 ImageView와 이미지 드로어 블에 대한 참조 목록을 전달하면 정확히 수행하는 다음 메서드를 작성했습니다.
ImageView demoImage = (ImageView) findViewById(R.id.DemoImage);
int imagesToShow[] = { R.drawable.image1, R.drawable.image2,R.drawable.image3 };
animate(demoImage, imagesToShow, 0,false);
private void animate(final ImageView imageView, final int images[], final int imageIndex, final boolean forever) {
//imageView <-- The View which displays the images
//images[] <-- Holds R references to the images to display
//imageIndex <-- index of the first image to show in images[]
//forever <-- If equals true then after the last image it starts all over again with the first image resulting in an infinite loop. You have been warned.
int fadeInDuration = 500; // Configure time values here
int timeBetween = 3000;
int fadeOutDuration = 1000;
imageView.setVisibility(View.INVISIBLE); //Visible or invisible by default - this will apply when the animation ends
imageView.setImageResource(images[imageIndex]);
Animation fadeIn = new AlphaAnimation(0, 1);
fadeIn.setInterpolator(new DecelerateInterpolator()); // add this
fadeIn.setDuration(fadeInDuration);
Animation fadeOut = new AlphaAnimation(1, 0);
fadeOut.setInterpolator(new AccelerateInterpolator()); // and this
fadeOut.setStartOffset(fadeInDuration + timeBetween);
fadeOut.setDuration(fadeOutDuration);
AnimationSet animation = new AnimationSet(false); // change to false
animation.addAnimation(fadeIn);
animation.addAnimation(fadeOut);
animation.setRepeatCount(1);
imageView.setAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
public void onAnimationEnd(Animation animation) {
if (images.length - 1 > imageIndex) {
animate(imageView, images, imageIndex + 1,forever); //Calls itself until it gets to the end of the array
}
else {
if (forever){
animate(imageView, images, 0,forever); //Calls itself to start the animation all over again in a loop if forever = true
}
}
}
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
});
}
사용자 정의 애니메이션 대신 TransitionDrawable을 사용하는 것을 생각해 보셨습니까? https://developer.android.com/reference/android/graphics/drawable/TransitionDrawable.html
원하는 것을 달성하는 한 가지 방법은 다음과 같습니다.
// create the transition layers
Drawable[] layers = new Drawable[2];
layers[0] = new BitmapDrawable(getResources(), firstBitmap);
layers[1] = new BitmapDrawable(getResources(), secondBitmap);
TransitionDrawable transitionDrawable = new TransitionDrawable(layers);
imageView.setImageDrawable(transitionDrawable);
transitionDrawable.startTransition(FADE_DURATION);
페이드 인 애니메이션을 사용하여 이전 이미지를 새 이미지로 대체했습니다.
ObjectAnimator.ofFloat(imageView, View.ALPHA, 0.2f, 1.0f).setDuration(1000).start();
Aladin Q의 솔루션을 기반으로 여기에 제가 작성한 도우미 함수가 있습니다.이 기능은 약간의 페이드 아웃 / 페이드 인 애니메이션을 실행하는 동안 이미지 뷰의 이미지를 변경합니다.
public static void ImageViewAnimatedChange(Context c, final ImageView v, final Bitmap new_image) {
final Animation anim_out = AnimationUtils.loadAnimation(c, android.R.anim.fade_out);
final Animation anim_in = AnimationUtils.loadAnimation(c, android.R.anim.fade_in);
anim_out.setAnimationListener(new AnimationListener()
{
@Override public void onAnimationStart(Animation animation) {}
@Override public void onAnimationRepeat(Animation animation) {}
@Override public void onAnimationEnd(Animation animation)
{
v.setImageBitmap(new_image);
anim_in.setAnimationListener(new AnimationListener() {
@Override public void onAnimationStart(Animation animation) {}
@Override public void onAnimationRepeat(Animation animation) {}
@Override public void onAnimationEnd(Animation animation) {}
});
v.startAnimation(anim_in);
}
});
v.startAnimation(anim_out);
}
무한 페이드 인 및 아웃
AlphaAnimation fadeIn=new AlphaAnimation(0,1);
AlphaAnimation fadeOut=new AlphaAnimation(1,0);
final AnimationSet set = new AnimationSet(false);
set.addAnimation(fadeIn);
set.addAnimation(fadeOut);
fadeOut.setStartOffset(2000);
set.setDuration(2000);
imageView.startAnimation(set);
set.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) { }
@Override
public void onAnimationRepeat(Animation animation) { }
@Override
public void onAnimationEnd(Animation animation) {
imageView.startAnimation(set);
}
});
프로그래밍 방식으로 애니메이션을 연결하는 데 이런 종류의 루틴을 사용하고 있습니다.
final Animation anim_out = AnimationUtils.loadAnimation(context, android.R.anim.fade_out);
final Animation anim_in = AnimationUtils.loadAnimation(context, android.R.anim.fade_in);
anim_out.setAnimationListener(new AnimationListener()
{
@Override
public void onAnimationStart(Animation animation) {}
@Override
public void onAnimationRepeat(Animation animation) {}
@Override
public void onAnimationEnd(Animation animation)
{
////////////////////////////////////////
// HERE YOU CHANGE YOUR IMAGE CONTENT //
////////////////////////////////////////
//ui_image.setImage...
anim_in.setAnimationListener(new AnimationListener()
{
@Override
public void onAnimationStart(Animation animation) {}
@Override
public void onAnimationRepeat(Animation animation) {}
@Override
public void onAnimationEnd(Animation animation) {}
});
ui_image.startAnimation(anim_in);
}
});
ui_image.startAnimation(anim_out);
가장 좋고 쉬운 방법은 이거 였어요 ..
-> sleep ()을 포함하는 Handler로 쓰레드를 생성하기 만하면됩니다.
private ImageView myImageView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_shape_count); myImageView= (ImageView)findViewById(R.id.shape1);
Animation myFadeInAnimation = AnimationUtils.loadAnimation(this, R.anim.fadein);
myImageView.startAnimation(myFadeInAnimation);
new Thread(new Runnable() {
private Handler handler = new Handler(){
@Override
public void handleMessage(Message msg) {
Log.w("hendler", "recived");
Animation myFadeOutAnimation = AnimationUtils.loadAnimation(getBaseContext(), R.anim.fadeout);
myImageView.startAnimation(myFadeOutAnimation);
myImageView.setVisibility(View.INVISIBLE);
}
};
@Override
public void run() {
try{
Thread.sleep(2000); // your fadein duration
}catch (Exception e){
}
handler.sendEmptyMessage(1);
}
}).start();
}
두 가지 간단한 포인트로 수행하고 코드를 변경할 수 있습니다.
1. 프로젝트의 anim 폴더에있는 xml에서 페이드 인 및 페이드 아웃 지속 시간을 동일하지 않게 설정하십시오.
2.In you java class before the start of fade out animation, set second imageView visibility Gone then after fade out animation started set second imageView visibility which you want to fade in visible
fadeout.xml
<alpha
android:duration="4000"
android:fromAlpha="1.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="0.0" />
fadein.xml
<alpha
android:duration="6000"
android:fromAlpha="0.0"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="1.0" />
In you java class
Animation animFadeOut = AnimationUtils.loadAnimation(this, R.anim.fade_out);
ImageView iv = (ImageView) findViewById(R.id.imageView1);
ImageView iv2 = (ImageView) findViewById(R.id.imageView2);
iv.setVisibility(View.VISIBLE);
iv2.setVisibility(View.GONE);
animFadeOut.reset();
iv.clearAnimation();
iv.startAnimation(animFadeOut);
Animation animFadeIn = AnimationUtils.loadAnimation(this, R.anim.fade_in);
iv2.setVisibility(View.VISIBLE);
animFadeIn.reset();
iv2.clearAnimation();
iv2.startAnimation(animFadeIn);
This is probably the best solution you'll get. Simple and Easy. I learned it on udemy. Suppose you have two images having image id's id1 and id2 respectively and currently the image view is set as id1 and you want to change it to the other image everytime someone clicks in. So this is the basic code in MainActivity.java File
int clickNum=0;
public void click(View view){
clickNum++;
ImageView a=(ImageView)findViewById(R.id.id1);
ImageView b=(ImageView)findViewById(R.id.id2);
if(clickNum%2==1){
a.animate().alpha(0f).setDuration(2000); //alpha controls the transpiracy
}
else if(clickNum%2==0){
b.animate().alpha(0f).setDuration(2000); //alpha controls the transpiracy
}
}
I hope this will surely help
참고URL : https://stackoverflow.com/questions/8720626/android-fade-in-and-fade-out-with-imageview
'programing tip' 카테고리의 다른 글
| Android Gradle 3.0.0-alpha2 플러그인, 읽기 전용 속성 'outputFile'의 값을 설정할 수 없습니다. (0) | 2020.09.18 |
|---|---|
| 터미널에서 bash 스크립트를 어떻게 실행합니까? (0) | 2020.09.18 |
| Oracle SQL Developer SQL 워크 시트 창에서 텍스트 인쇄 (0) | 2020.09.18 |
| Java 7의 새로운 기능 (0) | 2020.09.18 |
| Java의 바로 가기 "또는 할당"(| =) 연산자 (0) | 2020.09.18 |