Hi i am developing one application using image ,my requirement is whenever i clicked button the image have to move bottom to top and whenever i clicked stop button the image have to stop it position.but i am getting only either image move bottom or top
my code is
activity_main.xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/graphics"
android:orientation="vertical" >
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/startButton"
android:text="START"/>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/stopButton"
android:text="STOP"
android:layout_marginLeft="150dip"/>
</LinearLayout>
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
>
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="#drawable/download" />
</RelativeLayout>
</RelativeLayout>
MainActivity.java :
public class MainActivity extends Activity {
RelativeLayout rl_footer;
ImageView iv_header;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
btn1 = (Button)findViewById(R.id.startButton);
btn1.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
iv_header.setImageResource(R.drawable.download);
iv_header.setPadding(0, 10, 0, 0);
rl_footer.setBackgroundResource(R.drawable.download);
if (isBottom) {
SlideToAbove();
isBottom = false;
iv_header.setImageResource(R.drawable.download);
}else {
iv_header.setImageResource(R.drawable.download);
iv_header.setPadding(0, 0, 0, 10);
rl_footer.setBackgroundResource(R.drawable.download);
SlideToDown();
isBottom = true;
}
}
});
}
public void SlideToAbove() {
final Animation slide ;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 0.0f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, 0, 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
rl_footer.setLayoutParams(lp);
}
});
}
public void SlideToDown() {
final Animation slide ;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(500);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, rl_footer.getWidth(), 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
rl_footer.setLayoutParams(lp);
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
Remove this line
slide.setFillAfter(true);
This causes the image to jump to the end when you stop the animation.
You'll have to add the code to set the image position after stopping it.
I would suggest you to take a look at Object Animator which is more powerfull than regular ones.
And if your application's api level is less than 9 you can refer this library to still be able to use those methods. This library has also some examples about how to manage what you want to.
Related
I'm trying to use TranslateAnimation to move a profile picture to the top when item is clicked.
I found the correct position (x, y) but the profile picture doesn't come out of his item area.
I tried to use bringToFront() method but it doesn't work.
My problem here
Code to animate my view
public void animateContactAdding(View view) {
View profileImage = view.findViewById(R.id.linear_layout_image_profile);
int positionViewContact[] = {0, 0};
profileImage.getLocationOnScreen(positionViewContact);
int positionHeader[] = {0, 0};
mRelativeLayoutContactHeader.getLocationOnScreen(positionHeader);
float distanceBtwViews = (positionViewContact[1] - positionHeader[1]) * -1;
TranslateAnimation anim = new TranslateAnimation(0, 0, 0, distanceBtwViews);
anim.setDuration(400);
anim.setAnimationListener(new TranslateAnimation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
});
profileImage.startAnimation(anim);
}
Item
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<LinearLayout
android:id="#+id/linear_layout_image_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/circle_image_placeholder"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="10dp" />
<ImageView
android:id="#+id/circle_image_profile"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="10dp" />
</LinearLayout>
<TextView
android:id="#android:id/text2"
android:layout_width="match_parent"
android:layout_height="26dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_toEndOf="#+id/linear_layout_image_profile"
android:ellipsize="marquee"
android:lines="1"
android:visibility="gone" />
<TextView
android:id="#android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#android:id/text2"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:layout_alignWithParentIfMissing="true"
android:layout_toEndOf="#+id/linear_layout_image_profile"
android:ellipsize="marquee"
android:gravity="center_vertical"
android:lines="1"
android:textAppearance="#style/TextAppearance.RalewaySemiBold"
android:textSize="17sp" />
</RelativeLayout>
Probably you are animating a entire layout. Try to apply the animation only on ImageView and see what happens:
public void animateContactAdding(View view) {
int positionViewContact[] = {0, 0};
profileImage.getLocationOnScreen(positionViewContact);
int positionHeader[] = {0, 0};
mRelativeLayoutContactHeader.getLocationOnScreen(positionHeader);
float distanceBtwViews = (positionViewContact[1] - positionHeader[1]) * -1;
TranslateAnimation anim = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0.0F, Animation.RELATIVE_TO_SELF, 0.0F,
Animation.RELATIVE_TO_SELF, 2.0F, Animation.RELATIVE_TO_SELF, 0.0F
);
anim.setDuration(2000);
anim.setFillAfter(true);
anim.setAnimationListener(new TranslateAnimation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
});
view.startAnimation(anim);
}
I'm trying to create an app that has 2 layouts: one on top and one on bottom. I want that when you click on a layout, 2 change of position and one climb and the other lower.
But I have several problems:
layout 2 disturbs their position
2 layouts will disappear from the screen before putting on
How can I fix my mistakes? Thank you
MainActivity.java
public class MainActivity extends Activity {
RelativeLayout rl_footer, rl_footer2;
ImageView iv_header, iv_header2;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
rl_footer2 = (RelativeLayout) findViewById(R.id.rl_footer2);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
iv_header2 = (ImageView) findViewById(R.id.iv_up_arrow2);
iv_header.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if (isBottom) {
SlideToAbove1();
SlideToDown2();
isBottom = false;
} else {
SlideToDown1();
SlideToAbove2();
isBottom = true;
}
}
});
}
public void SlideToAbove1() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(600);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(20, 20, 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
rl_footer.setLayoutParams(lp);
}
});
}
public void SlideToAbove2() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(600);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer2.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer2.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer2.getWidth(), rl_footer2.getHeight());
lp.setMargins(0, 20, 20, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP | RelativeLayout.ALIGN_PARENT_RIGHT);
rl_footer2.setLayoutParams(lp);
}
});
}
public void SlideToDown1() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(600);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(20, 0, 0, 20);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
rl_footer.setLayoutParams(lp);
}
});
}
public void SlideToDown2() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(600);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer2.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer2.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer2.getWidth(), rl_footer2.getHeight());
lp.setMargins(0, 0, 20, 20);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM | RelativeLayout.ALIGN_PARENT_RIGHT);
rl_footer2.setLayoutParams(lp);
}
});
}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FF0000" >
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_alignParentTop="true"
android:layout_margin="20dp"
android:background="#666666" >
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:background="#000000" />
<TextView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:gravity="center"
android:text="1"
android:textColor="#FFFFFF"
android:textSize="30sp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rl_footer2"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_margin="20dp"
android:background="#666666" >
<ImageView
android:id="#+id/iv_up_arrow2"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:background="#FFFFFF" />
<TextView
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:gravity="center"
android:text="2"
android:textColor="#000000"
android:textSize="30sp" />
</RelativeLayout>
</RelativeLayout>
I've developed an animation subclass to do this exact thing. Here's the code:
public class MarginAnimation extends Animation
{
private View mView;
private int mTargetTopMargin;
private int mTargetLeftMargin;
private int mStartTopMargin;
private int mStartLeftMargin;
public MarginAnimation(View view, int targetTopMargin, int targetLeftMargin)
{
mView = view;
mTargetTopMargin = targetTopMargin;
mTargetLeftMargin = targetLeftMargin;
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)mView.getLayoutParams();
mStartTopMargin = params.topMargin;
mStartLeftMargin = params.leftMargin;
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t)
{
// I assume the view is inside a RelativeLayout. Change as required.
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams)mView.getLayoutParams();
params.topMargin = (int)(mStartTopMargin + (mTargetTopMargin - mStartTopMargin) * interpolatedTime);
params.leftMargin = (int)(mStartLeftMargin + (mTargetLeftMargin - mStartLeftMargin) * interpolatedTime);
mView.setLayoutParams(params);
}
#Override
public boolean willChangeBounds()
{
return true;
}
}
Usage:
MarginAnimation animation = new MarginAnimation(view, targetTopMargin, targetLeftMargin);
view.startAnimation(animation);
I should note that animations which invoke layout changes aren't the most optimal choice in Android when it come to performance, but it should get the job done.
If you can, try performing an animation on translationX/Y and perform layout (margin) changes only in the beginning / end of the animation.
i have 2 buttons(start&stop) and 1 image when i click start button image will move from top to bottom and bottom to top, this is fine but the problem when i click stop button image is gone but i wont that.my requirement is image has to pause on the screen until i click start button. i am waiting for u r response
please help me and once execute my code u can understand clearly
public class MainActivity extends Activity {
RelativeLayout rl_footer;
ImageView iv_header;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
Button button = (Button) findViewById(R.id.button1);
Button buttonstop = (Button) findViewById(R.id.button2);
buttonstop.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
rl_footer.clearAnimation();
rl_footer.removeAllViews();
}
});
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
iv_header.setImageResource(R.drawable.delete);
iv_header.setPadding(0, 10, 0, 0);
// rl_footer.setBackgroundResource(R.drawable.download);
// if (isBottom) {
SlideToAbove();
// isBottom = false;
// } else {
// iv_header.setImageResource(R.drawable.delete);
// iv_header.setPadding(0, 0, 0,50);
// rl_footer.setBackgroundResource(R.drawable.download);
// SlideToDown();
// isBottom = true;
// }
}
});
}
public void SlideToAbove() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
// lp.setMargins(0, 0, 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
rl_footer.setLayoutParams(lp);
iv_header.setImageResource(R.drawable.delete);
iv_header.setPadding(0, 0, 0, 50);
SlideToDown();
}
});
}
public void SlideToDown() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, rl_footer.getWidth(), 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
rl_footer.setLayoutParams(lp);
iv_header.setImageResource(R.drawable.delete);
iv_header.setPadding(0, 10, 0, 0);
SlideToAbove();
}
});
}
}
xml code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true" >
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/rl_footer"
android:layout_alignParentTop="true"
android:text="start" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="84dp"
android:text="stop" />
</RelativeLayout>
clearAnimation()
Cancels any animations for this view.
removeAllViews()
Call this method to remove all child views from the ViewGroup.
Try removing this line:
rl_footer.removeAllViews();
As others have said, don't call removeAllViews.
If you call clearAnimation, the View will go back to its original position.
If you don't call clearAnimation, the View will continue to animate.
What you need to do is to calculate the amount of time into the current animation cycle, then create a new Animation with a 0 duration, fillEnabled, fillBefore and fillAfter set to true and for the amount of translation to be equal to the amount that the current animation would have been offsetting the View.
rl_footer.removeAllViews();
"Call this method to remove all child views from the ViewGroup".
Comment this and the image shouldn't disappear.
Hope this helps.
I have an image and one button, when I clicked button the image is moved top to bottom and bottom to top continuously until I am click the stop button but when I click start button it move only bottom to top or top to bottom,its not moves continuously both sides.
my code is:
public class MainActivity extends Activity {
RelativeLayout rl_footer;
ImageView iv_header;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
Button button=(Button)findViewById(R.id.button1);
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
iv_header.setImageResource(R.drawable.download);
iv_header.setPadding(0, 10, 0, 0);
//rl_footer.setBackgroundResource(R.drawable.download);
if (isBottom) {
SlideToAbove();
isBottom = false;
} else {
iv_header.setImageResource(R.drawable.download);
iv_header.setPadding(0, 0, 0,50);
//rl_footer.setBackgroundResource(R.drawable.download);
SlideToDown();
isBottom = true;
}
}
});
}
public void SlideToAbove() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
// lp.setMargins(0, 0, 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
rl_footer.setLayoutParams(lp);
}
});
}
public void SlideToDown() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, rl_footer.getWidth(), 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
rl_footer.setLayoutParams(lp);
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
xml code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/graphics" >
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true">
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="#drawable/download" />
</RelativeLayout>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/rl_footer"
android:layout_alignParentTop="true"
android:text="start" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/rl_footer"
android:layout_alignParentTop="true"
android:text="stop" />
</RelativeLayout>
Try out below code its working fine for your both animation and it moves image continuously from bottom to top and top to bottom. And will stop animation as you click on stop button.
I have done some relevant changes which you can verify with your code.
public class MainActivity extends Activity {
RelativeLayout rl_footer;
ImageView iv_header;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
Button button = (Button) findViewById(R.id.button1);
Button buttonstop = (Button) findViewById(R.id.button2);
buttonstop.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
rl_footer.clearAnimation();
rl_footer.removeAllViews();
}
});
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
iv_header.setImageResource(R.drawable.delete);
iv_header.setPadding(0, 10, 0, 0);
// rl_footer.setBackgroundResource(R.drawable.download);
// if (isBottom) {
SlideToAbove();
// isBottom = false;
// } else {
// iv_header.setImageResource(R.drawable.delete);
// iv_header.setPadding(0, 0, 0,50);
// rl_footer.setBackgroundResource(R.drawable.download);
// SlideToDown();
// isBottom = true;
// }
}
});
}
public void SlideToAbove() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
// lp.setMargins(0, 0, 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
rl_footer.setLayoutParams(lp);
iv_header.setImageResource(R.drawable.delete);
iv_header.setPadding(0, 0, 0, 50);
SlideToDown();
}
});
}
public void SlideToDown() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
// rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, rl_footer.getWidth(), 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
rl_footer.setLayoutParams(lp);
iv_header.setImageResource(R.drawable.delete);
iv_header.setPadding(0, 10, 0, 0);
SlideToAbove();
}
});
}
}
Layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true" >
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/rl_footer"
android:layout_alignParentTop="true"
android:text="start" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="84dp"
android:text="stop" />
</RelativeLayout>
Please remove the attribute android:layout_alignParentTop="true" with the 2nd button and place it below the button you have put at top. check it if this solves your problem.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/rl_footer"
android:layout_alignParentTop="true"
android:text="start" />
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true" >
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="your drawable" />
</RelativeLayout>
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/rl_footer"
android:layout_below="#id/button1" // Change here
android:text="stop" />
I Need to make animate my Relative Layout when click on image view..
1.Moving Relative Layout from Bottom to Top (when clicking him on image view).
2.Moving back from Top to Bottom (when clicking him again on image view).
First when i click on image view it's works fine and Relative Layout move up from bottom to top, but when i click again on image view it's animate from top to bottom, when it's reached to the original position it's hide on my activity..any help and Thanks in advance.
This is my Activity :
public class MainActivity extends Activity {
RelativeLayout rl_footer;
ImageView iv_header;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
iv_header.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
iv_header.setImageResource(R.drawable.down_arrow);
// iv_header.setVisibility(View.INVISIBLE);
// iv_down.setVisibility(View.VISIBLE);
iv_header.setPadding(0, 10, 0, 0); // substitute parameters for
// left, top, right, bottom
rl_footer.setBackgroundResource(R.drawable.up_manu_bar);
// FooterAnimation();
if (isBottom) {
FooterAnimation();
isBottom = false;
} else {
iv_header.setImageResource(R.drawable.up_arrow);
iv_header.setPadding(0, 0, 0, 10);
rl_footer.setBackgroundResource(R.drawable.down_manu_bar1);
headerAnimation();
isBottom = true;
}
}
});
}
public void FooterAnimation() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
if (isBottom) {
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(rl_footer.getWidth(), 0, 0, 0);
rl_footer.setLayoutParams(lp);
} else {
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, 0, 0, 0);
rl_footer.setLayoutParams(lp);
}
}
});
}
public void headerAnimation() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
if (isBottom) {
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(rl_footer.getWidth(), 0, 0, 0);
rl_footer.setLayoutParams(lp);
} else {
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, 0, 0, 0);
rl_footer.setLayoutParams(lp);
}
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
and my Xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/autograph_bg" >
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true"
android:background="#drawable/down_manu_bar1" >
<ImageView
android:id="#+id/iv_new_file"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="18dp"
android:onClick="onNewFileClick"
android:src="#drawable/file_icon" />
<TextView
android:id="#+id/tv_new_file"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/iv_new_file"
android:layout_below="#+id/iv_new_file"
android:text="New"
android:textColor="#ffffff" />
<ImageView
android:id="#+id/iv_insert"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/iv_new_file"
android:layout_marginLeft="30dp"
android:layout_toRightOf="#+id/iv_new_file"
android:src="#drawable/insert_icon" />
<TextView
android:id="#+id/tv_insert"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/iv_insert"
android:layout_below="#+id/iv_insert"
android:text="Insert"
android:textColor="#ffffff" />
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="#drawable/up_arrow" />
<ImageView
android:id="#+id/iv_down_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#drawable/down_arrow"
android:paddingBottom="10dp"
android:visibility="gone" />
<ImageView
android:id="#+id/iv_save"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/iv_insert"
android:layout_marginLeft="30dp"
android:layout_toRightOf="#+id/iv_up_arrow"
android:src="#drawable/save" />
<TextView
android:id="#+id/tv_save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/iv_save"
android:layout_alignParentBottom="true"
android:text="Save"
android:textColor="#ffffff" />
<ImageView
android:id="#+id/iv_settings"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/iv_save"
android:layout_marginLeft="27dp"
android:layout_toRightOf="#+id/tv_save"
android:paddingTop="2dp"
android:src="#drawable/icon_settings" />
<TextView
android:id="#+id/tv_settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="260dp"
android:text="Settings"
android:textColor="#ffffff" />
</RelativeLayout>
</RelativeLayout>
I have solved my issue and now my animation works fine :)
if anyone needed just copy my code and xml and plz don't thanks :p
My Activity MainActivity:
import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationUtils;
import android.view.animation.TranslateAnimation;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RelativeLayout;
public class MainActivity extends Activity {
RelativeLayout rl_footer;
ImageView iv_header;
boolean isBottom = true;
Button btn1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
rl_footer = (RelativeLayout) findViewById(R.id.rl_footer);
iv_header = (ImageView) findViewById(R.id.iv_up_arrow);
iv_header.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
iv_header.setImageResource(R.drawable.down_arrow);
iv_header.setPadding(0, 10, 0, 0);
rl_footer.setBackgroundResource(R.drawable.up_manu_bar);
if (isBottom) {
SlideToAbove();
isBottom = false;
} else {
iv_header.setImageResource(R.drawable.up_arrow);
iv_header.setPadding(0, 0, 0, 10);
rl_footer.setBackgroundResource(R.drawable.down_manu_bar1);
SlideToDown();
isBottom = true;
}
}
});
}
public void SlideToAbove() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, -5.0f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
// lp.setMargins(0, 0, 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
rl_footer.setLayoutParams(lp);
}
});
}
public void SlideToDown() {
Animation slide = null;
slide = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f, Animation.RELATIVE_TO_SELF,
0.0f, Animation.RELATIVE_TO_SELF, 5.2f);
slide.setDuration(400);
slide.setFillAfter(true);
slide.setFillEnabled(true);
rl_footer.startAnimation(slide);
slide.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
rl_footer.clearAnimation();
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
rl_footer.getWidth(), rl_footer.getHeight());
lp.setMargins(0, rl_footer.getWidth(), 0, 0);
lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
rl_footer.setLayoutParams(lp);
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
and my Xml activity_main:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/autograph_bg" >
<RelativeLayout
android:id="#+id/rl_footer"
android:layout_width="fill_parent"
android:layout_height="70dp"
android:layout_alignParentBottom="true"
android:background="#drawable/down_manu_bar1" >
<ImageView
android:id="#+id/iv_new_file"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="18dp"
android:onClick="onNewFileClick"
android:src="#drawable/file_icon" />
<TextView
android:id="#+id/tv_new_file"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/iv_new_file"
android:layout_below="#+id/iv_new_file"
android:text="New"
android:textColor="#ffffff" />
<ImageView
android:id="#+id/iv_insert"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/iv_new_file"
android:layout_marginLeft="30dp"
android:layout_toRightOf="#+id/iv_new_file"
android:src="#drawable/insert_icon" />
<TextView
android:id="#+id/tv_insert"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/iv_insert"
android:layout_below="#+id/iv_insert"
android:text="Insert"
android:textColor="#ffffff" />
<ImageView
android:id="#+id/iv_up_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:paddingBottom="10dp"
android:src="#drawable/up_arrow" />
<ImageView
android:id="#+id/iv_down_arrow"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#drawable/down_arrow"
android:paddingBottom="10dp"
android:visibility="gone" />
<ImageView
android:id="#+id/iv_save"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/iv_insert"
android:layout_marginLeft="30dp"
android:layout_toRightOf="#+id/iv_up_arrow"
android:src="#drawable/save" />
<TextView
android:id="#+id/tv_save"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/iv_save"
android:layout_alignParentBottom="true"
android:text="Save"
android:textColor="#ffffff" />
<ImageView
android:id="#+id/iv_settings"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/iv_save"
android:layout_marginLeft="27dp"
android:layout_toRightOf="#+id/tv_save"
android:paddingTop="2dp"
android:src="#drawable/icon_settings" />
<TextView
android:id="#+id/tv_settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="260dp"
android:text="Settings"
android:textColor="#ffffff" />
</RelativeLayout>
</RelativeLayout>
just create new android project and copy paste my code and have fun! :)
also remember in xml i have image view and his background images replace with yout own images thanks..