Define certain enter and exit transitions for specific views in activity - android

I am adding activity transitions using this documentation. I understand that I can define enter and exit transitions for the entire activity, such as explode.
However, what if I want to animate certain views of the entering activity differently? For example, if I have one view on the top half of the layout and one at the bottom of the layout, I may want to use a downwards slide transition on the top view and an upward slide animation on the bottom view. Is this possible to set?
I can think of using scene animations (documented here) and bringing in the elements from the sides of an empty view, but my layout is complicated and I am iterating it often, so keeping track of two different layouts for it is not really ideal.
Thanks!

Finally got it! The idea is to create custom transition in xml and to set there targets:
<?xml version="1.0" encoding="utf-8"?>
<transitionSet
xmlns:android="http://schemas.android.com/apk/res/android"
android:transitionOrdering="together">
<slide
android:slideEdge="top">
<targets>
<target android:targetId="#id/toolbar"/>
</targets>
</slide>
<slide
android:slideEdge="bottom">
<targets>
<target android:targetId="#id/text"/>
</targets>
</slide>
</transitionSet>

To apply animation to desired view like button, textview, imageview, etc check this http://www.androidhive.info/2013/06/android-working-with-xml-animations/
Create four XML files for animation:
/res/anim/anim_alpha.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.1"
android:duration="500"
android:repeatCount="1"
android:repeatMode="reverse" />
</set>
/res/anim/anim_rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="500"
android:startOffset="0"
android:repeatCount="1"
android:repeatMode="reverse" />
</set>
/res/anim/anim_scale.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<scale
android:fromXScale="1.0"
android:toXScale="3.0"
android:fromYScale="1.0"
android:toYScale="3.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="500"
android:repeatCount="1"
android:repeatMode="reverse" />
</set>
/res/anim/anim_translate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<translate
android:fromXDelta="0"
android:toXDelta="100%p"
android:duration="500"
android:repeatCount="1"
android:repeatMode="reverse"/>
</set>
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<Button
android:id="#+id/translate"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Translate" />
<Button
android:id="#+id/alpha"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Alpha" />
<Button
android:id="#+id/scale"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Scale" />
<Button
android:id="#+id/rotate"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Rotate" />
</LinearLayout>
Main activity:
package com.exercise.AndroidAnimButtons;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
public class AndroidAnimButtonsActivity extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final Animation animTranslate = AnimationUtils.loadAnimation(this, R.anim.anim_translate);
final Animation animAlpha = AnimationUtils.loadAnimation(this, R.anim.anim_alpha);
final Animation animScale = AnimationUtils.loadAnimation(this, R.anim.anim_scale);
final Animation animRotate = AnimationUtils.loadAnimation(this, R.anim.anim_rotate);
Button btnTranslate = (Button)findViewById(R.id.translate);
Button btnAlpha = (Button)findViewById(R.id.alpha);
Button btnScale = (Button)findViewById(R.id.scale);
Button btnRotate = (Button)findViewById(R.id.rotate);
btnTranslate.setOnClickListener(new Button.OnClickListener(){
#Override
public void onClick(View arg0) {
arg0.startAnimation(animTranslate);
}});
btnAlpha.setOnClickListener(new Button.OnClickListener(){
#Override
public void onClick(View arg0) {
arg0.startAnimation(animAlpha);
}});
btnScale.setOnClickListener(new Button.OnClickListener(){
#Override
public void onClick(View arg0) {
arg0.startAnimation(animScale);
}});
btnRotate.setOnClickListener(new Button.OnClickListener(){
#Override
public void onClick(View arg0) {
arg0.startAnimation(animRotate);
}});
}
}

Related

how to make view visible and gone with some animation?

I have a relative layout, I need to show that view when network connectivity is not there and gone that view when connection came back, I need to do it like youtube. YT will show the popup in bottom with green color and after sometimes the view slide down. Thanks in advance I am new to this. I can't find any equivalent answer in StackOverflow
<RelativeLayout
android:id="#+id/dashboard_xmpp_connection_status_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:visibility="gone">
<TextView
android:id="#+id/dashboard_xmpp_connection_text"
android:layout_width="match_parent"
android:layout_height="33dp"
android:animateLayoutChanges="true"
style="#style/Connection_status"
android:text="#string/msg_no_internet" />
</RelativeLayout>
binding.filter.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (binding.filterExams.getVisibility() == View.VISIBLE) {
Animation slide_down = AnimationUtils.loadAnimation(binding.filterExams.getRootView().getContext(),
R.anim.slide_up_filter);
slide_down.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
binding.filterExams.setVisibility(View.GONE);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
binding.filterExams.startAnimation(slide_down);
} else {
binding.filterExams.setVisibility(View.VISIBLE);
Animation slide_down = AnimationUtils.loadAnimation(binding.filterExams.getRootView().getContext(),
R.anim.slide_down);
binding.filterExams.startAnimation(slide_down);
}
}
});
you can add animation file in xml file for e.g
here i used slide down and up animation
slide_up_filter.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<scale
android:duration="250"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="1.0"
android:toYScale="0.0" />
</set>
slide_down.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<scale
android:duration="250"
android:fromXScale="1.0"
android:fromYScale="0.0"
android:toXScale="1.0"
android:toYScale="1.0" />
</set>
like this there are sevaral animation
fade_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<alpha
android:duration="2000"
android:fromAlpha="0.1"
android:toAlpha="1.0">
</alpha>
</set>
fade_out.xml
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromAlpha="1.0"
android:interpolator="#android:anim/accelerate_interpolator"
android:toAlpha="0.0" />
You can use Transition API which is available in Support(androidx) package.
To use this you have to call TransitionManager.geginDelayedTransition method and change the visibility of the view to visible and gone as per the requirement.
private void slideView(boolean show) {
Transition transition = new Slide(Gravity.BOTTOM);
transition.setDuration(600);
transition.addTarget(R.id.id_of_relative_layout);
TransitionManager.beginDelayedTransition(id_of_relative_layout, transition);
if(show){
relativeView.setVisibility(View.VISIBLE);
}
else{
relativeView.setVisibility(View.GONE);
}
}
Call slideView() function on the action from where you want to perform it.
For more deatil follow this -
Show and hide a View with a slide up/down animation
so you can use LottieAnimationView
your app gradle file
implementation 'com.airbnb.android:lottie:3.0.7'//2.7.0
go this website sign and download free lottie json file
please click
step 1:put this download lottie json file to android studio assets folder
your layout file
<FrameLayout
android:id="#+id/dashboard_xmpp_connection_status_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:visibility="gone">
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/showAnimations"
android:layout_gravity="center"
android:layout_height="66dp"
android:layout_width="56dp"
android:visibility="gone"
app:lottie_autoPlay="true"
app:lottie_loop="false"
app:lottie_fileName="animsix.json" <!--please put your download json file -->
/>
</FrameLayout>
MainActivity
LottieAnimationView showLottie=findViewById(R.id.showAnimations);
if("network is available"){
showLottie.setVisibility(View.GONE);
}else{
showLottie.setVisibility(View.VISIBLE);
}
You could simply use fade in animation for text view like this.
void fadeIn() {
textView.setVisibility(View.VISIBLE);
textView.setAlpha(0);
int duration = getResources().getInteger(android.R.integer.config_mediumAnimTime);
textView.animate().alpha(1).setDuration(duration);
}
textView.animate() returns ViewPropertyAnimator which contains various methods to customize animations.
Visit this for more details

chaining animation - new location doesn't persist between animations

Problem:
after the move-down animation completes, the textview is positioned back to its original location and then rotates.
Desired Effect:
the textview moves down the screen, then rotates forever at its location
XML Layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:gravity="center_horizontal"
tools:context=".ActivityMain">
<TextView
android:id="#+id/tv_hello"
android:text="#string/hello_world"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold"
android:textSize="20sp"/>
</RelativeLayout>
move.XML :
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="#android:anim/accelerate_interpolator">
<!-- move down -->
<translate
android:duration="800"
android:fillAfter="true"
android:fromYDelta="0%p"
android:startOffset="0"
android:toYDelta="70%p" />
</set>
rotate.XML :
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillBefore="true"
android:fillAfter="true"
android:interpolator="#android:anim/linear_interpolator">
<!-- infinite rotate -->
<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="infinite"
android:duration="1200" />
</set>
Java Code :
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.TextView;
public class ActivityMain extends AppCompatActivity {
private TextView mTextView;
private Animation mAnimationMove;
private Animation mAnimationRotate;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mTextView = (TextView) findViewById(R.id.tv_hello);
mAnimationMove = AnimationUtils.loadAnimation(ActivityMain.this, R.anim.move);
mAnimationRotate = AnimationUtils.loadAnimation(ActivityMain.this, R.anim.rotate);
mAnimationMove.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
mTextView.startAnimation(mAnimationRotate);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
mTextView.startAnimation(mAnimationMove);
return true;
}
return super.onOptionsItemSelected(item);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_activity_main, menu);
return true;
}
}
HOW CAN THIS BE DONE ??
It's incredible that something so seemingly easy is actually quite difficult !
Change this:
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="#android:anim/accelerate_interpolator">
<!-- move down -->
<translate
android:duration="800"
android:fillAfter="true"
android:fromYDelta="0%p"
android:startOffset="0"
android:toYDelta="70%p" />
</set>
to this
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:interpolator="#android:anim/accelerate_interpolator">
<!-- move down -->
<translate
android:duration="800"
android:fillEnabled="true"
android:fromYDelta="0%p"
android:startOffset="0"
android:toYDelta="70%p" />
</set>

Transition android fragment slide up

I have a fragment that is to replace another fragment. I want to specify the animation. But the animation is ignored.
transaction.replace(R.id.my_fragment, newFrag);
transaction.addToBackStack(null);
transaction.setCustomAnimations(R.anim.slide_in_up, R.anim.slide_out_up);
slide_in_up
<?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_out_up
<?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" />
All I am really trying to achieve is for the new fragment to slide in from the bottom. My animations are ignored. What is the code missing?
transaction.setCustomAnimations(R.anim.slide_in_up, R.anim.slide_out_up);
transaction.addToBackStack(null);
transaction.replace(R.id.my_fragment, newFrag);
slide_in_up
<?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 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" />
It's been some time since this question was asked but here is an answer for other people coming here:
e1da is right insofar as that setCustomAnimation() call has to be called before replace(). Otherwise the animation will not show.
The second problem is that you probably are using native fragments that cannot be animated with the view animations.
Use the following files:
slide_in_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<objectAnimator
android:duration="500"
android:propertyName="y"
android:valueFrom="1280"
android:valueTo="0"
android:valueType="floatType" />
</set>
slide_out_up.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true" >
<objectAnimator
android:duration="500"
android:propertyName="y"
android:valueFrom="0"
android:valueTo="-1280"
android:valueType="floatType" />
</set>
A little explanation:
You have to differentiate between view animation for support fragments on one hand and property animation for native fragments on the other hand.
View animation:
Is the pre-android 3.0 way to animate views. Sample code for this is the slide_in.xml and slide_up.xml by user3093402
<?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" />
It is worth mentioning you cannot animate fragments with view animation. The exception to this are fragments from the support library (android.support.v4.app.Fragment).
Property animation
This is the way to animate objects after android 3.0. It is also declared as .xml files but makes use of the "valueAnimator" tag (objectAnimator extends valueAnimator). Examples are in the answer to the question.
This is the way how native fragments (android.app.Fragment) can be animated.
See also:
http://developer.android.com/guide/topics/graphics/overview.html
swap fragment in an activity via animation
Hope this helps,
Kai
EDIT: As pointed out by Raphael Royer-Rivard the fixed screen size is bad practice. It would be better to use a constant from the OS like in
getWindowManager().getDefaultDisplay().getMetrics(metrics).xdpi
(see DisplayMetrics). But I haven't done any Android development for some time so I don't know which one.
code for slide_in_up :
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="#android:integer/config_mediumAnimTime"
android:fromYDelta="100%p"
android:toYDelta="0%p" />
</set>
code for slide_in_down:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="#android:integer/config_mediumAnimTime"
android:fromYDelta="0%p"
android:toYDelta="100%p" />
</set>
code for slide_out_up:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="#android:integer/config_mediumAnimTime"
android:fromXDelta="0"
android:toYDelta="100%" />
</set>
code for slide_out_down:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="#android:integer/config_mediumAnimTime"
android:fromXDelta="0"
android:toYDelta="-100%" />
</set>
and after that in your activity or fragment set animation like below:
Fragment fragment = new Fragment();
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.setCustomAnimations(R.anim.slide_in_up, R.anim.slide_in_down, R.anim.slide_out_down, R.anim.slide_out_up);
transaction.replace(container, fragment).commit();
Currently with android.transition this is as simple as fragment.enterTransition = Slide() or fragment.enterTransition = Fade()
Note: Min version L.
R.anim will not work there but R.animator wil do.
for example
transaction.setCustomAnimations(android.R.animator.fade_in, android.R.animator.fade_out);
This answer is written in Kotlin. For sake of the example, I'm just hiding or showing it based on it's current isHidden attribute. I'm using androidx.transition.Slide
Link: https://developer.android.com/reference/androidx/transition/Slide
val frag = supportFragmentManager.findFragmentById(R.id.frag_id_from_xml_layout)
frag?.let {
val ft = supportFragmentManager.beginTransaction()
frag.enterTransition = Slide()
frag.exitTransition = Slide()
if (frag.isHidden) ft.show(frag) else ft.hide(frag)
ft.commit()
}
here is complete working example
Pressing the button toggles between 2 fragments A and B (by slide animation right to left). The fragments are just stupid text (AAAAAA and BBBBB) with different backgrounds.
MainActivity.java
package com.example.slidetrans;
import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
public class MainActivity extends Activity {
boolean showingA = true;
Button button;
A a;
B b;
private void incarnate(FragmentManager fm){
int layoutId = R.id.frame;
boolean fragmentWasNull = false;
Fragment f = fm.findFragmentById(layoutId);
if (f == null){
if (showingA){
f = a = new A();
} else {
f = b = new B();
}
fragmentWasNull = true;
}
if (fragmentWasNull){
FragmentTransaction ft = fm.beginTransaction();
ft.add(layoutId, showingA ? a : b, "main").commit();
}
}
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
FragmentManager fm = getFragmentManager();
incarnate(fm);
button = (Button)findViewById(R.id.button);
OnClickListener listener = new OnClickListener() {
#Override
public void onClick(View v) {
FragmentManager fm = getFragmentManager();
FragmentTransaction transaction = fm.beginTransaction();
transaction.setCustomAnimations(R.anim.in, R.anim.out);
transaction.replace(R.id.frame, showingA ? new B() : new A()).commit();
showingA = !showingA;
button.setText(showingA ? "slide in B" : "slide in A");
}
};
button.setOnClickListener(listener);
}
}
LL.java
package com.example.slidetrans;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.LinearLayout;
public class LL extends LinearLayout {
public LL(Context context) {
super(context);
}
public LL(Context context, AttributeSet attrs) {
super(context, attrs);
}
public float getXFraction() {
final int width = getWidth();
if (width != 0) return getX() / getWidth();
else return getX();
}
public void setXFraction(float xFraction) {
final int width = getWidth();
float newWidth = (width > 0) ? (xFraction * width) : -9999;
setX(newWidth);
}
}
main.xml (layout)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="slide in B" />
<FrameLayout
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
</LinearLayout>
a.xml (layout)
<?xml version="1.0" encoding="utf-8"?>
<com.example.slidetrans.LL xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#00FF00"
>
<TextView
android:id="#+id/aText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="AAAAAAAAAAAAAAAAAA"
android:textSize="30sp"
android:textStyle="bold"
/>
</com.example.slidetrans.LL>
b.xml (layout)
<?xml version="1.0" encoding="utf-8"?>
<com.example.slidetrans.LL xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#FFFF00"
>
<TextView
android:id="#+id/bText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30sp"
android:textStyle="bold"
android:text="BBBBBBBBBB"
/>
</com.example.slidetrans.LL>
in.xml (anim)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="500"
android:interpolator="#android:anim/linear_interpolator"
android:propertyName="xFraction"
android:valueFrom="1.0"
android:valueTo="0.0"
android:valueType="floatType" />
</set>
out.xml (anim)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="500"
android:interpolator="#android:anim/linear_interpolator"
android:propertyName="xFraction"
android:valueFrom="0.0"
android:valueTo="-1.0"
android:valueType="floatType" />
</set>

How to get the animated view

here is xml fileļ¼š
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="150dp"
android:layout_height="match_parent">
<Button
android:id="#+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
here is java code
private Button text;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
text = (Button)findViewById(R.id.textview);
text.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
text.startAnimation(getScaleAnimation());
}
});
}
private ScaleAnimation getScaleAnimation(){
ScaleAnimation animation = new ScaleAnimation(1f,1.2f,1f,1.2f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
animation.setDuration(1000);
animation.setFillAfter(true);
return animation;
}
I am performing a simple ScaleAnimation on a Button.Is there any way I can get the animated view?
Just open anim folder inside res folder. Create an xml file. Then you need to create set tag. Inside of it, you can create scale tag.
Here is an example:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/accelerate_interpolator">
<scale
android:fromXScale="0.5"
android:toXScale="2"
android:fromYScale="0.5"
android:toYScale="2"
android:pivotX="50%"
android:pivotY="50%"
android:duration="5000"
/>
</set>
Note: do not forget to include xmlns:android declaration.
Now, inside of onCreate method or wherever you want, just put following. I am animating(scaling) a button itself when it is clicked:
Button but = (Button) findViewById(R.id.button1);
but.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
Animation anim = AnimationUtils.loadAnimation(AnimationActivity.this, R.anim.animation);
but.startAnimation(anim);
}
});
EDIT:
in case you want to rotate it while scaling, you can put following inside of the xml file:
<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="5000"
/>
Hope this helps.
Use this way
Create an xml inside /res/anim folder and put the below code into it.
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="schemas.android.com/apk/res/android"
android:interpolator="#android:anim/linear_interpolator">
<scale android:fromXScale="0.0" android:fromYScale="0.0"
android:toXScale="1.0" android:toYScale="1.0"
android:duration="700" android:fillBefore="false" />
</set>
Place the below code inside the java file:
Animation scaleAnimation
= AnimationUtils.loadAnimation(this, R.anim.logoanimation);
Btn.startAnimation(scaleAnimation);
logoanimation is the name of my animation xml file.
for more refer this tutorial

Rotate animation android

I'm trying to do a rotating image animation.
I need to rotate an icon around itself just like they do in a progressbar, but what I'm getting is an image rotating around a circle.
Here is my animation code
<?xml version="1.0" encoding="utf-8"?>
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:toDegrees="360"
android:interpolator="#android:anim/linear_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2500"
android:repeatCount="infinite"
android:repeatMode="restart"
/>
Where am I going wrong in here?
Thanks
This is the source code for the layout main.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/testButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="animationText"
android:onClick="AnimClick"/>
<ImageView
android:id="#+id/testImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:contentDescription="image_desc"
android:scaleType="fitCenter"
android:src="#drawable/cat2" />
</RelativeLayout>
To implement the rotation animation, we can define the animation by XML or Java code. If we want to write the animation in the xml, we need to create an animation xml file under /res/anim folder. Here, we create a xml file named rotate_around_center_point.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<rotate
android:duration="2500"
android:interpolator="#android:anim/linear_interpolator"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="infinite"
android:repeatMode="restart"
android:toDegrees="360" />
</set>
and this is my Activity:
public class MainActivity extends Activity implements OnClickListener {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button btn = (Button) findViewById(R.id.testButton);
btn.setOnClickListener(this);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
ImageView animationTarget = (ImageView) this.findViewById(R.id.testImage);
Animation animation = AnimationUtils.loadAnimation(this, R.anim.rotate_around_center_point);
animationTarget.startAnimation(animation);
}
}
You could try with the following code, rather than doing it in XML:
RotateAnimation rotate = new RotateAnimation(0, 360,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
rotate.setDuration(4000);
rotate.setRepeatCount(Animation.INFINITE);
yourView.setAnimation(rotate);
Well I got where I was wrong. I gave padding to my image which caused it to move aside a little every time it rotated.
Anyhow I removed the padding and now it's working just fine.
Add the following xml in the animation folder
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false"
android:duration="4000"
android:fromdegrees="0"
android:pivotx="50%"
android:pivoty="50%"
android:todegrees="360"
android:toyscale="0.0">
</set>
Hope this will help you..
for more information http://www.blazin.in/2013/09/simple-rotate-animation-in-android.html

Categories

Resources