Slide in another XML layout when button is clicked - java

I have a main.xml layout file and in my Java code, I am doing some calculation taken from the main layout and wanting to display in result.xml layout file. I know I can use the anim folder to hold the animation to slidei n the result layout like the following:
left to right:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<translate android:fromXDelta="-100%" android:toXDelta="0%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="700"/>
</set>
right to left:
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<translate
android:fromXDelta="0%" android:toXDelta="100%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="700" />
</set>
I was wondering how to implement the above so when the button is clicked on the main layout file, the result layout file slides in from the right. And also if I wanted to go back to the main layout I can press a button (added on result layout) to slide right the main layout file

You can also use this function : overridePendingTransition which can define an animation for the upcoming activity and an other animation for the activity which exit.
Use it like this, in your second Activity :
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
overridePendingTransition(android.R.anim.slide_out_right, 0);
setContentView(R.layout.myLayout);
first argument is for the animation enter, and 0 is for no animation.
And for an animation when you leave your second activity :
#Override
public void finish() {
super.finish();
overridePendingTransition(R.anim.enterAnim, R.anim.leaveAnim);
}

You can always use default stock animations supplied by Android framework.
Heres an example code:
boolean isFirstXml=evaluatingConditionFunction();
LayoutInflater inflator=getLayoutInflater();
View view=inflator.inflate(isFirstXml?R.layout.myfirstxml:R.layout.myseconxml, null, false);
view.startAnimation(AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right));
setContentView(view);
Call this from any of your activity which holds your Parent View.
For custom animations you can visit developer docs. Heres the documentation link.

Related

Animate fragment from bottom up, over top previous fragment

I'd like to animate in a new fragment from the bottom up, over top of the previous fragment.
Unfortunately, my current implementation pushes the previous fragment up, as the new fragment is animating in, like this:
https://i.imgur.com/IgMUamp.png
What I would like it to do is have the new fragment animate over top the previous fragment, like so:
https://i.imgur.com/DTrEfcm.png
Here is what my code looks like now:
private void pushFragment(String fragmentTag, Fragment fragment) {
FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
fragmentTransaction.setCustomAnimations(R.anim.anim_in_test, R.anim.anim_out_test);
fragmentTransaction.replace(
R.id.fragment_container,
fragment,
fragmentTag);
fragmentTransaction.addToBackStack(null);
fragmentTransaction.commitAllowingStateLoss();
}
Here is anim_in_test.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_decelerate_interpolator">
<translate
android:duration="#android:integer/config_longAnimTime"
android:fromYDelta="100%p"
android:toYDelta="0" />
</set>
And here is anim_out_test.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="#android:integer/config_longAnimTime"
android:fromYDelta="0%p"
android:toYDelta="-100%p"
/>
</set>
What do I need to change to get this working right?
setCustomAnimations(int enter, int exit)
Exit animation should be empty (because you need old fragment stay on screen while new one appears), but if you pass 0 to second param view dissapear without animation. Thats why I add empty alpha animation which changes alpha from 1 to 1.
fragmentTransaction.setCustomAnimations(R.anim.anim_in_test, R.anim.anim_out_test);
anim_out_test.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:duration="#android:integer/config_longAnimTime"
android:fromAlpha="1"
android:toAlpha="1" />
</set>
But at that point it doesnt' work because android draw and animate new fragment BELOW old fragment. You can see it if you make fragment backgrounds transparent.
To resolve this issue I use setZ(z), setElevation(z) or setTranslationZ(z) methods on root view of fragment. It looks like all of them are working. Z value of new fragment should be more than old fragment Z.
#Override
public View onCreateView(#NonNull LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.view, container, false);
view.setZ(value);
Here is result:
It works but I dont know side effects of this solution. On android 4 I think it can be done via custom ViewGroup as fragment container, which draws children in reverse order.

Why Alpha-animation is reset?

I have xml for alpha-hide animation:
<set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="true">
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.15"
android:duration="200" />
</set>
I have a code for launch this animation when click on the floating action button:
addDiaryMain.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
listview.startAnimation(AnimationUtils.loadAnimation(Diarys.this, R.anim.alpha_hide));
}
});
And that's what happens. When you click on the button, the animation starts, but after a couple of seconds, the ListView loses its transparency. And this happens only if I click on the button immediately after the start of the activity. If after the start of the activity a couple of seconds pass, then the animation works as it should.
I don't know why it happens. Please help me to fix it.

XML FadeOut Animation not working

I have a generic FadeOut animation that is used on a lot of other things. I took out a button and switched it to a new button leaving the onClick the same. The only difference is position and src:Image. What I mean by not working is that it just goes to view gone and doesn't fadeout. it worked as intended with the other button but not this one
MainActivity
public void onPreferenceClose(View view){
FadeOut = AnimationUtils.loadAnimation(MainActivity.this, R.anim.fade_out);
FadeIn = AnimationUtils.loadAnimation(MainActivity.this, R.anim.fade_in);
if(preferences.getVisibility() == View.VISIBLE){
preferences.startAnimation(FadeOut);
preferences.setVisibility(View.GONE);
preferences.clearAnimation();
w_Toolbar.startAnimation(FadeIn);
w_Toolbar.setVisibility(View.VISIBLE);
p_Web.setClickable(false);
}
}
xml
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillBefore="true"
android:fillAfter="true"
android:duration="350">
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.0"
/>
your Fadeout animation is working but as you are setting the visibility (preferences) to gone it doesnt show animation ..because it makes it Gone first.. dont use setVisibility to Gone it isnt required for fadeout anim.. it will automatically do that for you ...or you can use listeners for your animation and at the end of animation make the view Gone
`
<alpha
android:duration="1000"
android:fromAlpha="1.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:toAlpha="0.0" />
`
use this code for anim..
done forget to use android:fillAfter="true" > in set ...
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
remove this line.
preferences.clearAnimation();
your animation started and was cleared, that's why you cant see it

Android Animation when change page

I am trying to switch from my "activity_main.xml" to a second .xml after a button click. I have already connected the button and put in setContentView(R.layout.view) and it works but I want it to animate. I want the view to come from the right and then the opposite when the user press back. I need a animation like a change of page in a book, I am doing this in eclipse if that helps.
I'm not sure how to get a "change of page in a book" animation, but here is how you would implement a slide in/slide out animation between activities which looks pretty good.
First, create two different XML files for the sliding animation. One for sliding in:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<translate
android:fromXDelta="-100%" android:toXDelta="0%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="700"/>
</set>
...and one for sliding out:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<translate
android:fromXDelta="0%" android:toXDelta="100%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="700" />
</set>
Now you can use these animations each time you press a button (or whatever your app does to move between activities) like so:
public void onClick(View v)
{
// set the animation to move once the button is clicked
overridePendingTransition(R.anim.slide_out, R.anim.slide_in);
Intent i = new Intent(MoveFromThisClass.this, MoveToThisCLass.class);
}
To move back to the previous class, just swap the slide_in and slide_out like this:
overridePendingTransition(R.anim.slide_in, R.anim.slide_out);
Hope this helps.
UPDATE (for the second part of your question):
"animation like a change of page in a book", i think you mean page curl annimation. if is that what you are looking for, you can use this library

Sliding a view in android using animation

i Am trying to slide a whole view from RIght to left and left to right.
Here is the code
Utilities.vibrate(v.getContext());
Animation animation = AnimationUtils.loadAnimation(v.getContext(), R.anim.leave);
mainView.startAnimation(animation);
This will make it move from left to right.
Here is leave.xml code
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<translate android:fromXDelta="-90%" android:toXDelta="0%"
android:fromYDelta="0%" android:toYDelta="0%"
android:duration="700"/>
</set>
It works fine however once the transition is done. It moves back to its original position. How can I make it stay at the slider position?
Add these lines after declaring your animation,
animation.setFillAfter(true);
animation.setFillEnabled(true);

Categories