int imgSize = 30;
final ShapeDrawable redDot = new ShapeDrawable(new OvalShape());
redDot.getPaint().setColor(Color.RED);
redDot.setIntrinsicHeight(imgSize);
redDot.setIntrinsicWidth(imgSize);
final Bitmap bitmap = Bitmap.createBitmap(imgSize, imgSize, Bitmap.Config.ARGB_8888);
final Canvas canvas = new Canvas(bitmap);
redDot.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
redDot.draw(canvas);
ImageView imgAnimArea = new ImageView(getActivity());
imgAnimArea.setImageBitmap(bitmap);
imgAnimArea.setScaleType(ImageView.ScaleType.CENTER);
animationsView.addView(imgAnimArea);
final AnimationSet animSetRedDot = new AnimationSet(true);
// animSetRedDot.setFillAfter(true);
// animSetRedDot.setFillEnabled(true);
Animation aniRepeatFadeIn = null;
Animation aniRepatFadeOut = null;
// fade out
aniRepatFadeOut = new AlphaAnimation(1, 0);
aniRepatFadeOut.setStartOffset(3000);
aniRepatFadeOut.setDuration(300);
animSetRedDot.addAnimation(aniRepatFadeOut);
// fade out animation works only if remove this part
aniRepeatFadeIn = new AlphaAnimation(0, 1);
aniRepeatFadeIn.setStartOffset(6000);
aniRepeatFadeIn.setDuration(300);
animSetRedDot.addAnimation(aniRepeatFadeIn);
imgAnimArea.startAnimation(animSetRedDot);
Its simple code (at least the animation part) but has very strange behavior. Basically before animation it creates a shape (small red circle) converts it to a bitmap and adds it to animationsView(FrameLayout) as ImageView's source (imgAnimArea).
So my red dot fades out but never appears back and it works only in case the fade in part is removed even thou the fade in fires later than fade out. I was trying also to set fade out to .5f instead of 0. In this case it fades out a half of visibility.
Also I had tried to animate animationsView but result is the same - only fade out part works if no fade in part added and if fade in part added then whole animation doesn't work at all.
I could see the shape with no animation added at all. Also I could see it after animation finishes in any case. Enabling or disabling FillAfter has no effect at all.
So the question is whats wrong here? Why fade in animation does not work? Why the whole animation does not work if fade in animation added?
here you have two ways how to do it (see if statement inside onClick() method)
one is preferred one not, the choice is yours
final TextView tv = new TextView(this);
tv.setText("click me");
tv.setTextSize(40);
tv.setTextColor(0xffeeeeee);
tv.setBackgroundColor(0xaa00ff00);
tv.setGravity(Gravity.CENTER);
OnClickListener l = new OnClickListener() {
#Override
public void onClick(View v) {
Animation a;
boolean preferred = true;
if (preferred) {
Log.d(TAG, "onClick using custom Interpolator, preferred way");
// this is a preferred way: custom Interpolator
a = new AlphaAnimation(0, 1);
Interpolator i = new Interpolator() {
#Override
public float getInterpolation(float input) {
return (float) (1 - Math.sin(input * Math.PI));
}
};
a.setInterpolator(i);
} else {
Log.d(TAG, "onClick using AnimationSet, NOT preferred way");
AnimationSet set = new AnimationSet(true);
AlphaAnimation alpha0 = new AlphaAnimation(1, 0);
alpha0.setDuration(1000);
alpha0.setFillEnabled(true);
alpha0.setFillBefore(false);
alpha0.setFillAfter(false);
set.addAnimation(alpha0);
AlphaAnimation alpha1 = new AlphaAnimation(0, 1);
alpha1.setDuration(1000);
alpha1.setFillEnabled(true);
alpha1.setFillBefore(false);
alpha1.setFillAfter(false);
alpha1.setStartOffset(1000);
set.addAnimation(alpha1);
a = set;
}
a.setDuration(2000);
tv.startAnimation(a);
}
};
tv.setOnClickListener(l);
setContentView(tv);
Related
It is possible to make keep changing image until it set final image.
i want to change image while its flipping.
so it look smooth while flipping
private ImageView image;
private void images() {
int[] ps={R.drawable.img1,R.drawable.img2};
Random r = new Random();
int n=r.nextInt(2);
image.setImageResource(ps[n]);
ObjectAnimator animation = ObjectAnimator.ofFloat(coin, "rotationY", 0f, 360f);
animation.setDuration(500);
animation.setInterpolator(new AccelerateDecelerateInterpolator());
animation.start();
}
yes you can do this for that you should use Flip animation, you can find code for this from Here
create XML file in res/animator with help of above link
than in java file
ObjectAnimator anim = (ObjectAnimator)
AnimatorInflater.loadAnimator(mContext, R.animator.[FILE NAME]);
int[] ps={R.drawable.img1,R.drawable.img2};
Random r = new Random();
int n=r.nextInt(2);
image.setImageResource(ps[n]);
anim.setTarget(image);
anim.setDuration(500);
anim.start();
For an android app, Im doing infinite Translate Animation.
imageview starts first and after a delay of 1 second, imageview2 starts.
Animation animation = new TranslateAnimation(0, 0, -500, 500);
animation.setDuration(4000);
imageview.startAnimation(animation);
animation.setRepeatCount(Animation.INFINITE);
Animation animation2 = new TranslateAnimation(0, 0, -500, 500);
animation2.setDuration(4000);
imageview2.startAnimation(animation2);
imageview2.setStartOffset(1000);
animation2.setRepeatCount(Animation.INFINITE);
The problem is that, after sometime imageview overlaps imageview2.
What Can I do to avoid the overlapping of 2 images ?
Any pointer would be appreciated.
You might want to try something like this:
private boolean isViewOverlapping(View firstView, View secondView) {
int[] firstPosition = new int[2];
int[] secondPosition = new int[2];
firstView.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
firstView.getLocationOnScreen(firstPosition);
secondView.getLocationOnScreen(secondPosition);
int r = firstView.getMeasuredWidth() + firstPosition[0];
int l = secondPosition[0];
return r >= l && (r != 0 && l != 0);
}
This is a method that will take in two views and check whether they are overlapping. If they are, it will return a boolean of true. I would presume that once you get this boolean returned as true, you would then want to carry out another action to ensure they are not overlapped anymore, such as moving one view down 400 pixels. This would then result in the images not overlapping and you would have avoided the worrying situation. Hope this helps!
I have two views in a RelativeLayout, both of which fill the screen, so view B is on top of view A. I also have an animation defined which can move view B partially offscreen to show view A underneath. The animation works fine, but I'm having the classic issue of the view bounds not moving with the view, so the button that I use to trigger the animation (which is located on view B) is only clickable from its original position, no matter where view B is located. The issue that I'm having is that after the animation ends, when I set the layout params it's causing view B to be redrawn again, translated from the location of the end of the animation.
As a concrete example, the left edge of view B is initially at x = 0, with a button at x = 450. When the button is pressed, an animation moves the view to x = -400. This works properly - the view is partially off the left hand side of the screen, and the button is now at x = 50, so it is still on screen. The click area for the button though is still at x = 450. So now I set the layout params on view B:
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) viewB.getLayoutParams();
lp.rightMargin = 400;
viewB.setLayoutParams(lp);
Once the new params are set, the view gets 400px of padding on the right, moving the entire view to x = -800. The clickable area for the button is now properly at x = 50 though, so it seems like I can have it look right or act right. Any idea what I'm doing wrong? Here's how the animation is set up.
Animation anim = null;
anim = new TranslateAnimation(0, -400, 0, 0);
anim.setAnimationListener(this);
anim.setDuration(duration);
viewB.startAnimation(anim);
I was able to get things working by changing the layout params before or after the animation, as appropriate:
private int marginOffsets;
public void triggerAnimation(boolean show, offset)
{
int curX = 0;
int newX = 0;
Animation anim = null;
this.showingPanel = show;
if(show)
{
curX = 0 - offset;
android.widget.RelativeLayout.LayoutParams lp = new android.widget.RelativeLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT);
lp.rightMargin = 0;
rootPanel.setLayoutParams(lp);
}
else
{
newX = 0 - offset;
}
marginOffsets = newX < 0 ? 0 - offset : offset;
anim = new TranslateAnimation(curX, newX, 0, 0);
anim.setAnimationListener(this);
anim.setDuration(duration);
startAnimation(anim);
}
public void onAnimationEnd(Animation anim)
{
//This prevents flicker when the view is moving onscreen.
clearAnimation();
if(!showingPanel)
{
//Move the margin to move the actual bounds so click events still work.
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT);
lp.rightMargin = 0 - marginOffsets;
rootPanel.setLayoutParams(lp);
}
}
I am creating an animation where my image will translate to a different spot on the screen and then fade in gradually. I completed the translation part(see below) but now when I start the fade in animation it disappears for the duration and then reapears after. I want to show the image being faded in gradually....Any ideas why this is happening?
public static int moveTwo(AnimationListener activity, View apa, int animationmove)
Log.v("MOVETWO", "Started move2");
AnimationSet picMov2 = new AnimationSet(true);
picMov2.setAnimationListener(activity);
RotateAnimation rotate2 = new RotateAnimation(0, 0,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
// rotate1.setStartOffset(50);
rotate2.setDuration(2000);
picMov2.addAnimation(rotate2);
TranslateAnimation trans2 = new TranslateAnimation(-200, -400, 0, 0);
trans2.setDuration(2000);
picMov2.setFillAfter(true);
picMov2.addAnimation(trans2);
apa.startAnimation(picMov2);
animationmove = 3;
return animationmove;
public static int moveThree(AnimationListener activity, View apa, int animationmove)
AlphaAnimation fadein = new AlphaAnimation((float) 0.3, 1);//HERE THE IMAGE IS DISAPPEARING
fadein.setAnimationListener(activity);
fadein.setDuration(2000);
fadein.setFillAfter(true);
apa.startAnimation(fadein);
animationmove=4;
return animationmove;
Just needed to create a translate action in the same place so it doesn't go back to its original position
public static int moveThree(AnimationListener activity, View apa, int animationmove)
{
Log.v("MOVETHREE", "Started move3");
AnimationSet picMov3 = new AnimationSet(true);
picMov3.setAnimationListener(activity);
AlphaAnimation fadein = new AlphaAnimation((float) 0.4, 1);
// rotate1.setStartOffset(50);
fadein.setDuration(duration);
picMov3.addAnimation(fadein);
TranslateAnimation trans1 = new TranslateAnimation(-400, -400, 0, 0);
trans1.setDuration(duration);
picMov3.setFillAfter(true);
picMov3.addAnimation(trans1);
apa.startAnimation(picMov3);
I'm using an AnimationSet to do many Translate animations. In this example I want to move an ImageView from 0 to 700 (offscreen) and from -700 to 0 (the view move to the extreme right and re-enter from the extreme left). I use this code:
AnimationSet set = new AnimationSet(true);
set.setInterpolator(new AccelerateDecelerateInterpolator());
set.setFillEnabled(true);
if(traject!=null){
TranslateAnimation tmpAnim = null;
set.setDuration(duration);
int d = traject.size()!=0 ? duration/traject.size() : duration;
for(int i =0; i<traject.size();i++){
tmpAnim = new TranslateAnimation( traject.get(i).getStartX(),
traject.get(i).getEndX(),
traject.get(i).getStartY(),
traject.get(i).getEndY() );
tmpAnim.setDuration(d);
tmpAnim.setFillAfter(true);
tmpAnim.setStartOffset(d*i);
set.addAnimation(tmpAnim);
}
}
traject is an arraylist holding each TranslateAnimation start and end points
But in my test example the animation goes from -700 to 700. I tried switching the order of the TranslateAnimations, using setStartTime() instead of setStartOffset(), skipping the call to setStartOffset(), the result is the same. Do you have any idea on what I am missing ?