layout animation issues - android

First, sorry for my english, i'm vietnamese and my english is bad so please don't be mad ok!
hi everyone, i have to create an app with using animation for layout (pushleft and pushright)
this is my code :
ArrayList<LinearLayout>linear=new ArrayList<LinearLayout>();
Animation animLeft,animRight;
for(int i=0;i<10;i++)
{
LinearLayout llayout=new LinearLayout(getApplicationContext());
LinearLayout.LayoutParams lp=new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
lp.setMargins(0, 0, 0, 0);
llayout.setLayoutParams(lp);
llayout.setId(i);
if(i%2==0)
{
llayout.setAnimation(animLeft);
Log.d("SetAnimation,Left","i:"+i);
llayout.startLayoutAnimation();
}
else
{
llayout.setAnimation(animRight);
Log.d("SetAnimation,Right","i:"+i);
llayout.startLayoutAnimation();
}
linear.add(llayout);
}
//code for animation :
+pushleft
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="100%p" android:toXDelta="0" android:duration="300"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="300" />
</set>
+pushright
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="-100%p" android:toXDelta="0" android:duration="300"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="300" />
</set>
public void CreateGame(int round)
{
///////////Load all method//////////////
tvarray=TaoTextView(round);
addTexttoLayoutbyRandom(round, tvarray);
for(int i=0;i<round;i++)
{
Linearcenter.addView(linear.get(i));
//linear.get(i).startLayoutAnimation();
}
////////////////////////////////////////
Linearcenter.startLayoutAnimation();
iResult=RandomRound(round);
iRound=round;
//Linearcenter.startLayoutAnimation();
}
I set CreateGame in onCreate(), pleaze ignore some param extraneous (like round,iRound,iResult ..)
when the application start i just see 1 child layout effect and it's a first layout with id = 0
What's wrong??plz tell me why ?

Related

animating registration page android

I want to add animation to my registration page. I have 6 EditTexts and I want them to come one by one from right to left. I'm new to android, someone help me please.
Screenshot registration page
You can create your custom animation xmls and place inside anim folder inside resources folder:
left_swipe.xml
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="100%"
android:toXDelta="0%" >
</translate>
right_swipe.xml
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="-100%"
android:toXDelta="0%" >
</translate>
You can start animation like :
RightAnim = AnimationUtils.loadAnimation(Screen.this, R.anim.right_swipe);
ScreenAnimation.startAnimation(RightAnim );
Plz make sure your animation xml file under res>anim
This is for slide_in_left
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="-50%p" android:toXDelta="0"
android:duration="2500"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0"
android:duration="#android:integer/config_mediumAnimTime" />
</set>
and this is for slide_in_right
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="50%p" android:toXDelta="0"
android:duration="2500"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0"
android:duration="#android:integer/config_mediumAnimTime" />
</set>
in your java code
Animation a = AnimationUtils.loadAnimation(RegisterActivity.this, R.anim.slide_in_left);
a.reset();
etusername.clearAnimation();
etusername.startAnimation(a);
Animation b = AnimationUtils.loadAnimation(RegisterActivity.this, R.anim.slide_in_right);
b.reset();
etpassword.clearAnimation();
etpassword.startAnimation(b);
left to right animation:
leftToRight.xml
<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 animation:
rightToLeft
<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>
write below code in your activity class
private Animation m_animationLeft;
private Animation m_animationRight;
m_animationLeft = AnimationUtils.loadAnimation(this, R.anim.leftToRight);
m_animationRight = AnimationUtils.loadAnimation(this, R.anim.rightToLeft);
editTextOne.startAnimation(m_animationLeft);
m_animationLeft.setAnimationListener(new AnimationListener()
{
#Override
public void onAnimationStart(Animation p_animation)
{
}
#Override
public void onAnimationRepeat(Animation p_animation)
{
}
#Override
public void onAnimationEnd(Animation p_animation)
{
// Start animation on another edittext . If you want to perform animation one by one edittext
}
});
}
}.start();

Is there a way to slide between Activities without the black gap?

I'm trying to create an Android app, and switch between activities with a slide, when the previous activity slides out to the right, and the new activity comes in the left.
I can do somethibg like this, with:
Intent intent = new Intent(getContext(), NextActivity.class);
startActivity(intent);
overridePendingTransition(R.anim.in_ltr, R.anim.out_ltr);
Where the in_ltr.xml is:
<?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:fromXDelta="-100%p"
android:toXDelta="0"
android:duration="700"
/>
</set>
And the out_ltr.xml is:
<?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:fromXDelta="0"
android:toXDelta="100%p"
android:duration="500"
/>
</set>
It's almost perfect, but a small black gap appers between the two activity during the animation. You can see it here on YouTube.
I've tried anything I found in the Google in the last hour, but nothing seems to remove that gap. Is it possible to remove that gap?
Thanks!
Try to set Alpha with translate effect....
Try This...
slide_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:interpolator/accelerate_cubic">
<translate
android:fromXDelta="0%"
android:toXDelta="100%"
android:duration="400" />
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.3"
android:duration="500" />
</set>
Add this two file in res/anim folder.
slide_in.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:fromXDelta="100%p"
android:toXDelta="0%p">
</translate>
slide_out.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:fromXDelta="0%p"
android:toXDelta="-100%p">
</translate>
And write the following code in onCreate() method of next activity that you pass through the Intent.
overridePendingTransition(r.anim.slide_in, R.anim.slide_out);
hope it will remove your space
Try this: create a RootActivity.java and extend it in your activity.
import android.app.Activity;
import android.os.Bundle;
public class RootActivity extends Activity {
int onStartCount = 0;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
onStartCount = 1;
if (savedInstanceState == null) // 1st time
{
this.overridePendingTransition(R.anim.anim_slide_in_left,
R.anim.anim_slide_out_left);
} else // already created so reverse animation
{
onStartCount = 2;
}
}
#Override
protected void onStart() {
// TODO Auto-generated method stub
super.onStart();
if (onStartCount > 1) {
this.overridePendingTransition(R.anim.anim_slide_in_right,
R.anim.anim_slide_out_right);
} else if (onStartCount == 1) {
onStartCount++;
}
}
}
add these animations to anim folder:
anim_slide_in_left.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="600"
android:fromXDelta="100%"
android:toXDelta="0%" >
</translate>
</set>
anim_slide_in_right.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="600"
android:fromXDelta="-100%"
android:toXDelta="0%" >
</translate>
</set>
anim_slide_out_right.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="600"
android:fromXDelta="0%"
android:toXDelta="100%" >
</translate>
</set>
anim_slide_out_left.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="600"
android:fromXDelta="0%"
android:toXDelta="-100%" >
</translate>
</set>
Try to add below item into your AppTheme
<item name="android:windowIsTranslucent">true</item>
Sorry guys, I was very, very stupid.
I changed the duration to the same amount of time, and the gap disappeared.

Animation using startOffset goes reversed

I created the following animation:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/anticipate_overshoot_interpolator"
>
<translate
android:fromXDelta="0"
android:toXDelta="100%p"
android:duration="500"
/>
<translate
android:fromXDelta="-100%p"
android:toXDelta="0"
android:startOffset="500"
android:duration="500"/>
</set>
I test it on an Android 2.3.6 phone and the animation goes sequentially but REVERSED.
First it goes from left to the middle then from the middle to the right. How can I play it in the correct order?
final ImageView iv = new ImageView(this);
iv.setScaleType(ScaleType.CENTER);
final Bitmap b = BitmapFactory.decodeResource(getResources(), R.drawable.layer0);
iv.setImageBitmap(b);
OnClickListener l = new OnClickListener() {
#Override
public void onClick(View v) {
float x = (iv.getWidth() + b.getWidth()) / 2;
AnimationSet set = new AnimationSet(true);
set.setFillBefore(false);
Animation a;
a = new TranslateAnimation(0, x, 0, 0);
a.setDuration(500);
a.setFillAfter(false);
a.setFillBefore(false);
a.setFillEnabled(true);
set.addAnimation(a);
a = new TranslateAnimation(-x, 0, 0, 0);
a.setStartOffset(500);
a.setDuration(500);
a.setFillAfter(false);
a.setFillBefore(false);
a.setFillEnabled(true);
set.addAnimation(a);
iv.startAnimation(set);
}
};
iv.setOnClickListener(l);
setContentView(iv);
As I couldn't modify their orders, I eventually created two separate animations and used an AnimationListener to start the second one.
you can do it simply adding a set attribute element android:repeatMode="reverse". Thus your code should be..
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="#android:anim/anticipate_overshoot_interpolator"
android:repeatMode="reverse"
>
<translate
android:repeatCount="infinite"
android:fromXDelta="0"
android:toXDelta="100%p"
android:duration="2500"
/>
<!-- <translate
android:fromXDelta="-100%p"
android:toXDelta="0"
android:startOffset="500"
android:duration="500"/> -->
</set>

Fading in text in Android using AnimationUtils.loadAnimation

I would be very grateful if someone could explain to me why this works:
private void startAnimating() {
TextView logo1 = (TextView) findViewById(R.id.Shizzle);
final Animation fade1 = new AlphaAnimation(0.0f, 1.0f);
fade1.setDuration(3000);
logo1.startAnimation(fade1);
}
But this doesn't work at all for me:
private void startAnimating() {
TextView logo1 = (TextView) findViewById(R.id.Shizzle);
Animation fade1 = AnimationUtils.loadAnimation(this,R.anim.fade_in);
logo1.startAnimation(fade1);
}
The fade_in.xml associated with the above is:
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/android"
android:shareInterpolator="false">
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="3000">
</alpha>
Thanks for your help!
Works for me:
Create two file in folder /res/anim - fadein.xml, fadeout.xml
fadein:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0" >
</alpha>
</set>
fadeout:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false" >
<alpha
android:duration="200"
android:fromAlpha="1.0"
android:toAlpha="0.0" >
</alpha>
</set>
initialize code:
Animation animFadeIn, animFadeOut;
...
animFadeIn=AnimationUtils.loadAnimation(this, R.anim.fadein);
animFadeOut=AnimationUtils.loadAnimation(this, R.anim.fadeout);
...
using:
case R.id.imgBtnShowContent:
rlOrderBtns.startAnimation(animFadeIn);
rlOrderBtns.setVisibility(View.VISIBLE);
break;
case R.id.imgBtnHideContent:
rlOrderBtns.startAnimation(animFadeOut);
rlOrderBtns.setVisibility(View.INVISIBLE);
break;

How to create this animation?

I want to do this animation, when switching between 2 activities:
--
--
any help?
those 2 methods are realy usefull to solve the issue quikly:
Animation slide_out_left = AnimationUtils.makeOutAnimation(getActivity(),false);
Animation slide_in_right = AnimationUtils.makeInAnimation(getActivity(), true);
Animation slide_out_right = AnimationUtils.makeOutAnimation(getActivity(),true);
Animation slide_in_left = AnimationUtils.makeInAnimation(getActivity(), false);
here is the doc of the methods, as you'll see the second parameter is a flag to choose the side.
The result is similar to what Rodrigo wrote before but it take 2 lines of code and dosen't require the definition of custom animation.
Here the answer:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ViewFlipper flipper = findViewById(R.id.flipper);
flipper.setOnTouchListener(this);
}
private void myOnTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_MOVE:
mDragged = true;
break;
case MotionEvent.ACTION_DOWN:
mDragged = false;
mXbefore = event.getX();
break;
case MotionEvent.ACTION_UP:
if(mDragged){
vf = (ViewFlipper) v;
mXafter = event.getX();
if(mXafter > mXbefore){
vf.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.right_to_left_in));
vf.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.right_to_left_out));
vf.showNext();
}else{
vf.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.left_to_right_in));
vf.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.left_to_right_out));
vf.showPrevious();
}
}
mDragged = false;
break;
default:
break;
}
}
main.xml:
<ViewFLipper id="#+id/flipper">
<YourLayout />
<YourLayout />
</ViewFlipper>
right_to_left_in.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="-100%p"
android:toXDelta="0%p"
android:duration="500"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="500" />
</set>
right_to_left_out.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="100%p"
android:toXDelta="200%p"
android:duration="500"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="500" />
</set>
left_to_right_in.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="100%p"
android:toXDelta="0"
android:duration="500"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="500" />
</set>
left_to_right_out_xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0%p"
android:toXDelta="-100%p"
android:duration="500"/>
<alpha android:fromAlpha="1.0" android:toAlpha="0.0" android:duration="500" />
</set>

Categories

Resources