Introduction screen similar to Flickr

Creating Introduction screen like Flickr or other Yahoo apps ..



Prerequisite for this  we should have the basic understand the working on Fragments and Activity working ..
Also we should have worked with animation class ..

Here we are trying to get the basic idea / getting the basic working model .


So here we go ..


MainActivity


package info.androidhive.tabsswipe;

import info.androidhive.tabsswipe.adapter.TabsPagerAdapter;

import java.util.ArrayList;

import android.animation.TypeEvaluator;
import android.animation.ValueAnimator;
import android.animation.ValueAnimator.AnimatorUpdateListener;
import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.FragmentTransaction;
import android.graphics.RectF;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.util.Log;
import android.view.View;
import android.view.Window;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.AnimationSet;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.TextView;

public class MainActivity extends FragmentActivity implements
ActionBar.TabListener {

private ViewPager viewPager;
private TabsPagerAdapter mAdapter;
private ArrayList fragments;
TopRatedFragment topRatedFragment;
GamesFragment gamesFragment;
MoviesFragment moviesFragment;
public TextView textView;
public int lastDelta = 0;

// Tab titles
private String[] tabs = { "Top Rated", "Games", "Movies" };

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
topRatedFragment = new TopRatedFragment();
gamesFragment = new GamesFragment();
moviesFragment = new MoviesFragment();
textView = (TextView) findViewById(R.id.txtFirst);

// Initilization
viewPager = (ViewPager) findViewById(R.id.pager);
fragments = new ArrayList();
fragments.add(topRatedFragment);
fragments.add(gamesFragment);
// fragments.add(moviesFragmen t);

mAdapter = new TabsPagerAdapter(getSupportFragmentManager() , fragments);

viewPager.setAdapter(mAdapter);

/**
* on swiping the viewpager make respective tab selected
* */
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

@Override
public void onPageSelected(int position) {
// on changing the page
// make respected tab selected

}

@Override
public void onPageScrolled(int arg0, float arg1, int position) {

Log.d("arg0", ""+arg0);
Log.d("arg1", ""+arg1);
Log.d("arg2", ""+position);

if (position > 0) {



MainActivity.this.textView.startAnimation(MainActivity.this.getMaximAnim(position));

gamesFragment.graphicsView.rotateAnim = null;
gamesFragment.graphicsView.delta = position;
gamesFragment.graphicsView.invalidate();


/*ValueAnimator va = ValueAnimator.ofInt(0,500);
va.addUpdateListener(new AnimatorUpdateListener() {

@Override
public void onAnimationUpdate(ValueAnimator animation) {
// TODO Auto-generated method stub
Integer value = (Integer) animation.getAnimatedValue();
// MainActivity.this.textView.getLayoutParams().height += value.intValue();
MainActivity.this.textView.getLayoutParams().height += 100;
MainActivity.this.textView.requestLayout();
}
});

va.start();*/


}

}

@Override
public void onPageScrollStateChanged(int arg0) {

}
});
}

@Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
}

@Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// on tab selected
// show respected fragment view
viewPager.setCurrentItem(tab.getPosition());
}

@Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
}



public void setTypeValuator(View view){

}


public Animation getMaximAnim(int xDelta ) {

int duration = 500;
int value = xDelta/2;
TranslateAnimation slide = new TranslateAnimation(0, 0, value * -1 , lastDelta);
int xValue = (xDelta /4)/4;
int xOld = -xValue ;


Log.d("ScaleAnimation", "xValue "+xValue +" xOld " + xOld);

if ( xOld <= 0 || xValue <=0 ) {
xOld = 1;
xValue = 1;
}

ScaleAnimation scaleAnimation = new ScaleAnimation(1, 2, 1, 2,
               ScaleAnimation.RELATIVE_TO_SELF, 0.5f,
               ScaleAnimation.RELATIVE_TO_SELF,0.5f);
scaleAnimation.setDuration(100);
scaleAnimation.setFillAfter(true);
scaleAnimation.setStartOffset(0);
// scaleAnimation.setRepeatCount(Animation.INFINITE);
// scaleAnimation.setRepeatMode(Animation.REVERSE);


lastDelta = value * -1;
slide.setDuration(0);
slide.setFillAfter(true);
AnimationSet anims = new AnimationSet(true);
anims.setFillAfter(true);
// anims.addAnimation(scaleAnimation);
anims.addAnimation(slide);
anims.setAnimationListener(new AnimationListener() {

@Override
public void onAnimationStart(Animation animation) {
// TODO Auto-generated method stub
Log.d("ScaleAnimation " ,"Start");
}

@Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
Log.d("ScaleAnimation " ,"Repeat");
}

@Override
public void onAnimationEnd(Animation animation) {
// TODO Auto-generated method stub
Log.d("ScaleAnimation " ,"End");
}
});

return anims;
}


public class RectFEvaluator
    implements TypeEvaluator {

@Override
public RectF evaluate(float fraction, RectF srcRect, RectF destRect) {
RectF betweenRect = new RectF();
       betweenRect.bottom = srcRect.bottom + fraction*(destRect.bottom-srcRect.bottom);
       betweenRect.top = srcRect.top + fraction*(destRect.top-srcRect.top);
       betweenRect.left = srcRect.left + fraction*(destRect.left-srcRect.left);
       betweenRect.right = srcRect.right + fraction*(destRect.right-srcRect.right);
       return betweenRect;
}

}

}

Games Fragment

package info.androidhive.tabsswipe;

import info.androidhive.tabsswipe.R;

import android.content.Context;

import android.graphics.Canvas;

import android.graphics.Color;

import android.graphics.Paint;

import android.graphics.Path;

import android.graphics.Path.Direction;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.view.animation.AccelerateDecelerateInterpolator;

import android.view.animation.AlphaAnimation;

import android.view.animation.Animation;

import android.view.animation.AnimationSet;

import android.view.animation.AnimationUtils;

import android.view.animation.RotateAnimation;

import android.view.animation.TranslateAnimation;

import android.widget.TextView;

public class GamesFragment extends Fragment {

public TextView txt;

public Animation zoomin;

public int lastDelta = 0;

public GraphicsView graphicsView;

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

View rootView = inflater.inflate(R.layout.fragment_games, container,

false);

rootView.requestLayout();

graphicsView = new GraphicsView(getActivity());

rootView = graphicsView;

txt = (TextView) rootView.findViewById(R.id.txtFirst);

zoomin = AnimationUtils.loadAnimation(getActivity(), R.anim.zoom_exit);

return rootView;

}

public static class GraphicsView extends View {

public static final String AnimatedTxt = "This is Atos Demo . This is Atos Demo .This is Atos Demo .This is Atos Demo .This is Atos Demo ." +

"This is Atos Demo .This is Atos Demo .This is Atos Demo .This is Atos Demo .";

public Animation rotateAnim;

public int delta;

public GraphicsView(Context context) {

super(context);

}

public void createAnim(Canvas canvas) {

if (delta > 0) {

rotateAnim = new RotateAnimation(delta, 360,canvas.getWidth() / 2, canvas.getHeight() / 2);

// rotateAnim.setRepeatMode(Animation.REVERSE);

rotateAnim.setRepeatCount(Animation.INFINITE);

rotateAnim.setDuration(10000L);

rotateAnim.setInterpolator(new AccelerateDecelerateInterpolator());

startAnimation(rotateAnim);

}

}

@Override

protected void onDraw(Canvas canvas) {

super.onDraw(canvas);

// creates the animation the first time

if (rotateAnim == null) {

createAnim(canvas);

}

Path circle = new Path();

int centerX = canvas.getWidth() / 2;

int centerY = canvas.getHeight() / 2;

int r = Math.min(centerX, centerY);

circle.addCircle(centerX, centerY, r, Direction.CW);

Paint paint = new Paint();

paint.setColor(Color.GREEN);

paint.setTextSize(30);

paint.setAntiAlias(true);

canvas.drawTextOnPath(AnimatedTxt, circle, 0, 30, paint);

}

}

}