I am writing an Android app where I want the activity to appear by animating in from the bottom of the screen to the top. I am able to do this with code from here:
How to translate the activity from top to bottom and viceversa?
However, I am not able to do the vice-versa animation wherein the Activity would disappear by sliding from the top to the bottom of the screen.
I used the code in the above link; the activity appears by sliding up, but when disappearing, it fades out, instead of sliding to the bottom.
I even tried putting the code in onCreate() :
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
overridePendingTransition(R.anim.appear_from_bottom, R.anim.disappear_to_bottom);
setContentView(R.layout.activity_all_metadata_display);
initializePage();
}
You need to define your "slide up" animations from the linked question, and some new "slide down" animations that reverse the process.
The important parts of the animations to look at are the fromYDelta and toYDelta values. These define the Y-positions (of the top of your view) at the start & end of the animations.
slide_in_up.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="#android:integer/config_longAnimTime"
android:fromYDelta="100%p"
android:toYDelta="0%p" />
slide_out_up.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="#android:integer/config_longAnimTime"
android:fromYDelta="0%p"
android:toYDelta="-100%p" />
slide_in_down.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="#android:integer/config_longAnimTime"
android:fromYDelta="-100%p"
android:toYDelta="0%p" />
slide_out_down.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="#android:integer/config_longAnimTime"
android:fromYDelta="0%p"
android:toYDelta="100%p" />
For the "slide up" animations, you should have overridden the pending transition in your onResume() method like this:
protected void onResume()
{
super.onResume();
overridePendingTransition(R.anim.slide_in_up, R.anim.slide_out_up);
}
For the "slide down" animations, do something similar in your onPause() method:
protected void onPause()
{
super.onPause();
overridePendingTransition(R.anim.slide_in_down, R.anim.slide_out_down);
}
Some tutorials suggest using the wrong life-cycle methods:
onCreate() is not called every time the activity is shown
onDestroy() is not called every time the activity is taken away
Rather use methods that are called every time there is a screen transition:
onResume() is called when the activity is shown to the user
onPause() is called when the activity is going to be taken away
For more info on these methods specifically, check the Android developer site:
Pausing and Resuming an Activity
When your screen is displayed, it will slide in from the bottom.
When a new screen is displayed, your screen will slide back down.
Two ways of doing this:
1. Using styles
Assuming you wish to implement this for all activities, in your base theme define the following entry:
<item name="android:windowAnimationStyle">#style/ActivityAnimations</item>
Then define the following style:
<style name="ActivityAnimations" parent="android:style/Animation.Activity">
<item name="android:activityOpenEnterAnimation">#anim/appear_from_bottom</item>
<item name="android:activityOpenExitAnimation">#anim/hold</item>
<item name="android:activityCloseEnterAnimation">#anim/hold</item>
<item name="android:activityCloseExitAnimation">#anim/disappear_to_bottom</item>
</style>
Where #anim/hold can be something like this:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<translate
android:duration="1000"
android:zAdjustment="bottom" />
</set>
2. Using overridePendingTransition()
Override finish():
#Override
public void finish() {
super.finish();
overridePendingTransition(R.anim.hold, R.anim.disappear_to_bottom);
}
Override onBackPressed():
#Override
public void onBackPressed() {
finish();
}
Override onOptionsItemSelected():
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
finish();
return true;
}
return super.onOptionsItemSelected(item);
}
In your main xml file. Add id of the root tag and pass this to function. like
/** The Constant ANIM_NO. */
public static final int ANIM_NO = 0;
public static void topToDown(Context context, View target, int type,
int duration) {
if (type == UtilityAnimations.ANIM_NO) {
UtilityAnimations.topToDown(context, target, duration);
} else {
final Animation animation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, 0.0f,
Animation.RELATIVE_TO_SELF, -1.0f,
Animation.RELATIVE_TO_SELF, 0.0f);
animation.setDuration(duration != 0 ? duration
: UtilityAnimations.DURATION_MEDIAM);
animation.setInterpolator(UtilityAnimations.getInterpolator(
context, type));
target.startAnimation(animation);
}
}
you can vice-versa your transition by overriding the Transition in your onPause() :
#Override
protected void onPause()
{
super.onPause();
overridePendingTransition(R.anim.appear_from_bottom, R.anim.disappear_to_bottom);
}
Related
How can i impliment slide etc.. animation transition when i open new activity by listview item click ?
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
Intent intent = null;
// global string to class
selectedValue = String.valueOf(parent.getItemAtPosition(position));
if (selectedValue.equals("item1")) {
// ^^^ use any item value here you want
Intent myIntent = new Intent(view.getContext(), activity1.class);
startActivityForResult(myIntent,0);
}
else if (selectedValue.equals("item2")) {
Intent myIntent = new Intent(view.getContext(), aactivity4.class);
startActivityForResult(myIntent,0);
}
}
});
santoash kumar answer is correct. If you struggle on R.anim.layout resource here an animation code work like how other chat application work(slide animation) when you click on the listview item.
Add those into your anim resource
R.anim.push_left_in
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="100%" android:toXDelta="0" android:duration="#android:integer/config_mediumAnimTime"/>
</set>
R.anim.push_left_out
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0" android:toXDelta="-20%" android:duration="#android:integer/config_mediumAnimTime"/>
</set>
R.anim.push_right_in
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="-20%" android:toXDelta="0" android:duration="#android:integer/config_mediumAnimTime"/>
</set>
R.anim.push_right_out
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0" android:toXDelta="100%" android:duration="#android:integer/config_mediumAnimTime"/>
</set>
In the activity1 or any activity you will like to perform this animation while it launch,add this code after your set setContentView()
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
overridePendingTransition(R.anim.push_left_in, R.anim.push_left_out);
//rest of your code include setContentView();
}
Now you will find a problem when you try to navigation back to your listView activity either with pressing the back button or click on the view which represent the back button the animation still seem to be the default animation so do this when you try to end your current activity.
finish();
overridePendingTransition(R.anim.push_right_in, R.anim.push_right_out);
For the back button pressed use this code.
#Override
public void onBackPressed() {
super.onBackPressed();
overridePendingTransition(R.anim.push_right_in,R.anim.push_right_out);
}
If the animation I provide doesn't suit the animation you desire you can try to make your own custom animation from this link.
startActivityForResult(myIntent,0);
overridePendingTransition(R.anim.hold, R.anim.fade_in);
hold and fade in will be animation xmls
I have two activities. The first Activity has an imagebutton. on click of this image button, I am launching the 2nd activity with an animation.
In First activity
ImageButton ibCamera = (ImageButton)findViewById(R.id.ibCamera);
ibCamera.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
openTemplateChooser();
}
});
private void openTemplateChooser()
{
Intent i = new Intent(this.getApplicationContext(), chooseTemplate.class);
startActivity(i);
overridePendingTransition( R.anim.anim_slide_in, R.anim.anim_slide_out);
}
The animation XML (Slide IN)
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="100%p" android:toXDelta="0%p"
android:duration="#android:integer/config_longAnimTime"/>
The animation XML (Slide OUT)
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0%p" android:toXDelta="-100%p"
android:duration="#android:integer/config_longAnimTime"/>
The sliding animation works fine and the second activity slides in perfectly. But when I press the back button in my phone, the previous activity comes back without any animation. I want the previous activity to return with the Slide OUT animation defined in my XML. How do I achieve that?
Additional Question
Is there any way I can override the default transition time during which the animation playes? I want the sliding to happen faster.
I would like to switch the activities using animation..
I have a view with 5 images and with that i set my oncliclk listener.
My main activity is
private View.OnClickListener onClickListener = new View.OnClickListener()
{
public void onClick(View testView)
{
if (testView == Main.this.myinput)
{
Intent i = new Intent(Main.this, Activity1.class);
startActivity(i);
overridePendingTransition(R.anim.fade_in, R.anim.fade_out);
}
if (testView == Main.this.myinput)
{
Intent i = new Intent(Main.this, Activity2.class);
startActivity(i);
overridePendingTransition(R.anim.fade_in, R.anim.fade_out);
}
}
};
and my animation files are
fade_in:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_interpolator"
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="500" />
fade_out:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_interpolator"
android:fromAlpha="1.0" android:toAlpha="0.0"
android:fillAfter="true"
android:duration="500" />
Now my problem is when switching between activities, animation has no effects on real devices but which is working on emulator.... I referred to stack overflow and googled but couldn't find why animation is not working..
I tried this with various type of animations such as slide_in_left,right,top,bottom...
but animation is not working. Help me in resolving this issue.Thanks in advance..
You should add overridePendingTransition(R.anim.fade_in, R.anim.fade_out); in your second Activity. For example :
public class SecondActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Activity open animation
overridePendingTransition(R.anim.fade_in, R.anim.fade_out);
setContentView(R.layout.activity_fragment_container);
}
#Override
public void onPause() {
super.onPause();
// Activity closing animation
overridePendingTransition(R.anim.fade_in, R.anim.fade_out);
}
}
Doing this you can control your Activity's start and close animation.
I had the same problem. Then i find decision. You should enable animation on your phone.
Go to : Settings > Display > Animation(Path can vary from device to device). Enable animation here. Hope this helps.
I have an activity (A) that launches another activity (B) after a calculation. My problem is that when Activity B is launched, an arrow drawable that is supposed to move from left to right while incrementing in size (scaled from .33 to 1) is first displayed for a very short fraction of time before it starts the tween animation. The end result is a bothering flicker of the full size drawable right before it starts animating.
Everything seems to point that the problem is related to the animation file (.xml) and not to the java class. This can be observed when I delete the line arrowImage.startAnimation(arrowExtent); in the following code:
protected void arrowAnimation(Animation arrowExtent) {
// TODO Auto-generated method stub
arrowImage.setImageResource(R.drawable.arrowimage);
arrowImage.startAnimation(arrowExtent);
arrowExtent.setFillAfter(true);
I have tried the following:
Using setImageDrawable instead of setImageResource to the Drawable object.
Setting arrowImage.setFillBefore(false);
Any recommendations will be greatly appreciated.
The animation xml is as follows:
<?xml version="1.0" encoding="utf-8"?>
<set android:interpolator="#android:anim/accelerate_decelerate_interpolator">
<scale
android:fromXScale="0.33"
android:toXScale="1.0"
android:fromYScale="0.0"
android:toYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="0"
android:duration="1000"
android:fillBefore="false" />
<translate
android:fromXDelta="0%"
android:toXDelta="75%p"
android:duration="1000" />
</set>
When activity start you should make ImageView invisible in xml or in onCreate() and when animation starts, you should change it to visible.
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// referencing views etc.
arrowImage.setVisibility(View.INVISIBLE);
// or make image invisible in xml
}
protected void arrowAnimation(Animation arrowExtent) {
arrowExtent.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
arrowImage.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationRepeat(Animation animation) { }
#Override
public void onAnimationEnd(Animation animation) { }
});
arrowImage.setImageResource(R.drawable.arrowimage);
arrowImage.startAnimation(arrowExtent);
}
In my Android app, I have a floating Activity. It's started from outside my app using ActivityOptions.makeScaleUpAnimation to scale up from an "originating" rectangle. When my Activity finishes, I'd like it to do the reverse of that animation: i.e. it shrinks back to that rectangle as it fades out.
I know I can get the rectangle with getIntent().getSourceBounds(), and I'd hoped to be able to use overridePendingTransition() when finishing to achieve this effect, but overridePendingTransition() can only accept a fixed XML resource: there doesn't seem to be a way to make that animation depend on the source bounds. Is there something else I can use to achieve this effect?
My app is for API 11+, but as it's a cosmetic effect only, I'd be satisfied with a solution that depends on a later version.
I don think there is a way to scale down the activity window other than the overridePendingTransition call. However this code may help:
Scale up
ActivityOptions opts = ActivityOptions.makeCustomAnimation(getActivity(), R.anim.scale_up, 0);
startActivity(new Intent(this, SecondActivity.class),opts.toBundle());
Here is the scale_up animation file:
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:fromXScale="0"
android:toXScale="1.0"
android:fromYScale="0"
android:toYScale="1.0"
android:pivotX="50%p"
android:pivotY="50%p"
android:duration="500"/>
</set>
Scale down
Call this code from the exiting activity:
finish();
overridePendingTransition(0, R.anim.scale_down);
Here is the scale_down animation file:
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:fromXScale="1.0"
android:toXScale="0"
android:fromYScale="1.0"
android:toYScale="0"
android:pivotX="50%p"
android:pivotY="50%p"
android:duration="250"/>
</set>
You can vary the X and Y scale to get the desired rectangle. Hope this helps.
Based on my last comment, here is the solution which i have tried and it works. You may have to modify to suit your requirements.
Implement a Activity with Transparent background and with no title inside the manifest:
<activity
android:name="com.example.backgroundsensor.AnimatedActivity"
android:theme="#android:style/Theme.Translucent.NoTitleBar"
android:label="Animated activity" />
and let it set the content view with a layout as :
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
tools:ignore="MergeRootFrame" >
<View
android:id="#+id/visibleAreaView"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_gravity="center"
android:background="#android:color/holo_green_dark" />
</FrameLayout>
The visibleAreaView is the one you will see on the screen, since activity is transparent. You can set the bounds of the view in OnCreate of the activity().
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.animated_activity);
// set the bounds of the animateView
}
Also, Override the finish method something like this:
boolean animateFirst=true;
#Override
public void finish() {
if(animateFirst)
{
animateFirst = false;
loadAnim();
}else
{
super.finish();
}
}
public void loadAnim() {
View v = findViewById(R.id.animateView);
float x= v.getX() + v.getRight()/2;
float y = v.getY();
anim = new ScaleAnimation(1.0f, 0.0f,1.0f, 0.0f, x, y);
anim.setDuration(300);
anim.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
findViewById(R.id.animateView).setVisibility(View.GONE);
AnimatedActivity.this.finish();
}
});
v.startAnimation(anim);
}