仿 <赶集生活android客户端> 的介绍动画界面 的进一步修改
2014-03-06 13:35
302 查看
第一版项目引自
http://blog.csdn.net/nekocode/article/details/20308159#reply
最近在玩赶集生活android客户端时，发现它初次运行时的介绍页面做得不错，当用户拉到Feature上的时候会出现动画，令人感觉很生动~于是自己简单地模仿了下。
Sample: http://pan.baidu.com/s/1i3wqEMh (具体效果可以下载该样例观看)
[java]
view plaincopy
package com.example.animatetest;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
public class MainActivity extends Activity implements OnGlobalLayoutListener, OnScrollChangedListener {
private ObservableScrollView mScrollView;
private View mAnimView;
private int mScrollViewHeight;
private int mStartAnimateTop;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mScrollView = (ObservableScrollView)this.findViewById(R.id.scrollView1);
mScrollView.getViewTreeObserver().addOnGlobalLayoutListener(this);
mScrollView.setOnScrollChangedListener(this);
mAnimView = this.findViewById(R.id.anim1);
mAnimView.setVisibility(View.INVISIBLE);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
@Override
public void onGlobalLayout() {
mScrollViewHeight = mScrollView.getHeight();
mStartAnimateTop = mScrollViewHeight / 3 * 2;
}
boolean hasStart = false;
@Override
public void onScrollChanged(int top, int oldTop) {
int animTop = mAnimView.getTop() - top;
if(top > oldTop) {
if(animTop < mStartAnimateTop && !hasStart) {
Animation anim1 = AnimationUtils.loadAnimation(this, R.anim.feature_anim2scale_in);
anim1.setAnimationListener(new FeatureAnimationListener(mAnimView, true));
mAnimView.startAnimation(anim1);
hasStart = true;
}
} else {
if(animTop > mStartAnimateTop && hasStart) {
Animation anim1 = AnimationUtils.loadAnimation(this, R.anim.feature_alpha_out);
anim1.setAnimationListener(new FeatureAnimationListener(mAnimView, false));
mAnimView.startAnimation(anim1);
hasStart = false;
}
}
}
}
[java]
view plaincopy
package com.example.animatetest;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ScrollView;
public class ObservableScrollView extends ScrollView {
private OnScrollChangedListener onScrollChangedListener;
public ObservableScrollView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
}
public ObservableScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public ObservableScrollView(Context context) {
super(context);
}
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if(this.onScrollChangedListener != null) {
onScrollChangedListener.onScrollChanged(t, oldt);
}
}
public void setOnScrollChangedListener(OnScrollChangedListener onScrollChangedListener) {
this.onScrollChangedListener = onScrollChangedListener;
}
}
[java]
view plaincopy
package com.example.animatetest;
public abstract interface OnScrollChangedListener {
public abstract void onScrollChanged(int top, int oldTop);
}
[java]
view plaincopy
package com.example.animatetest; import android.view.View; import android.view.animation.Animation; import android.view.animation.Animation.AnimationListener; public class FeatureAnimationListener implements AnimationListener { private View mAnimView; private boolean mAnimIn; public FeatureAnimationListener(View animView, boolean animIn) { mAnimView = animView; mAnimIn = animIn; } @Override public void onAnimationEnd(Animation animation) { if(!mAnimIn) { mAnimView.setVisibility(View.INVISIBLE); } } @Override public void onAnimationRepeat(Animation animation) {} @Override public void onAnimationStart(Animation animation) { if(mAnimIn) { mAnimView.setVisibility(View.VISIBLE); } } }
activity_main.xml
[html]
view plaincopy
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" tools:context=".MainActivity">
<com.example.animatetest.ObservableScrollView
android:id="@+id/scrollView1" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content" android:background="@drawable/feature_bg"
android:gravity="center_horizontal" android:orientation="vertical">
<ImageView android:id="@+id/imageView2"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="100dp" android:src="@drawable/feature_title" />
<ImageView android:id="@+id/imageView1"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="20dp" android:src="@drawable/feature_lv" />
<ImageView android:id="@+id/imageView3"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView4"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView5"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_scroll_txt" />
<ImageView android:id="@+id/imageView6"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView7"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<LinearLayout android:id="@+id/anim1"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:gravity="center_vertical|center_horizontal">
<ImageView android:id="@+id/imageView8"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:src="@drawable/feature_car" />
<ImageView android:id="@+id/imageView9"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:src="@drawable/feature_gift" />
<ImageView android:id="@+id/imageView10"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:src="@drawable/feature_money" />
</LinearLayout>
<ImageView android:id="@+id/imageView11"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView12"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView13"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_arrow_up" />
<ImageView android:id="@+id/imageView14"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_jobs_txt" />
</LinearLayout>
</com.example.animatetest.ObservableScrollView>
</RelativeLayout>
feature_anim2scale_in.xml
[html]
view plaincopy
<?xml version="1.0" encoding="utf-8"?>
<scale android:interpolator="@android:anim/overshoot_interpolator"
android:duration="200" android:pivotX="50.0%" android:pivotY="50.0%"
android:fillAfter="true" android:fromXScale="0.0" android:toXScale="1.0"
android:fromYScale="0.0" android:toYScale="1.0"
xmlns:android="http://schemas.android.com/apk/res/android" />
feature_alpha_out.xml
[html]
view plaincopy
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:interpolator="@android:anim/overshoot_interpolator"
android:duration="200" android:fromAlpha="1.0" android:toAlpha="0.0" />
</set>
然后这个DEMO我本人发现如下可以修改的地方：
这个最好activity不要实现OnScrollChangedListener
实现类单独写多个
这样就可以有不同的策略来实现change
就把acitivity里的实现OnScrollChangedListener的类抽出来写一个DefaultOnScrollChangedListener类，
activity里就定义一个OnScrollChangedListener变量
oncreate时赋值给他DefaultOnScrollChangedListener的实例
hasStart这样用有点扯
hasStart最好包在ScrollView里
修改的代码如下：
源代码下载地址如下：
http://download.csdn.net/detail/opzoonzhuzhengke/6999895
http://blog.csdn.net/nekocode/article/details/20308159#reply
最近在玩赶集生活android客户端时，发现它初次运行时的介绍页面做得不错，当用户拉到Feature上的时候会出现动画，令人感觉很生动~于是自己简单地模仿了下。
Sample: http://pan.baidu.com/s/1i3wqEMh (具体效果可以下载该样例观看)
[java]
view plaincopy
package com.example.animatetest;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
public class MainActivity extends Activity implements OnGlobalLayoutListener, OnScrollChangedListener {
private ObservableScrollView mScrollView;
private View mAnimView;
private int mScrollViewHeight;
private int mStartAnimateTop;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mScrollView = (ObservableScrollView)this.findViewById(R.id.scrollView1);
mScrollView.getViewTreeObserver().addOnGlobalLayoutListener(this);
mScrollView.setOnScrollChangedListener(this);
mAnimView = this.findViewById(R.id.anim1);
mAnimView.setVisibility(View.INVISIBLE);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
@Override
public void onGlobalLayout() {
mScrollViewHeight = mScrollView.getHeight();
mStartAnimateTop = mScrollViewHeight / 3 * 2;
}
boolean hasStart = false;
@Override
public void onScrollChanged(int top, int oldTop) {
int animTop = mAnimView.getTop() - top;
if(top > oldTop) {
if(animTop < mStartAnimateTop && !hasStart) {
Animation anim1 = AnimationUtils.loadAnimation(this, R.anim.feature_anim2scale_in);
anim1.setAnimationListener(new FeatureAnimationListener(mAnimView, true));
mAnimView.startAnimation(anim1);
hasStart = true;
}
} else {
if(animTop > mStartAnimateTop && hasStart) {
Animation anim1 = AnimationUtils.loadAnimation(this, R.anim.feature_alpha_out);
anim1.setAnimationListener(new FeatureAnimationListener(mAnimView, false));
mAnimView.startAnimation(anim1);
hasStart = false;
}
}
}
}
[java]
view plaincopy
package com.example.animatetest;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ScrollView;
public class ObservableScrollView extends ScrollView {
private OnScrollChangedListener onScrollChangedListener;
public ObservableScrollView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
}
public ObservableScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public ObservableScrollView(Context context) {
super(context);
}
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if(this.onScrollChangedListener != null) {
onScrollChangedListener.onScrollChanged(t, oldt);
}
}
public void setOnScrollChangedListener(OnScrollChangedListener onScrollChangedListener) {
this.onScrollChangedListener = onScrollChangedListener;
}
}
[java]
view plaincopy
package com.example.animatetest;
public abstract interface OnScrollChangedListener {
public abstract void onScrollChanged(int top, int oldTop);
}
[java]
view plaincopy
package com.example.animatetest; import android.view.View; import android.view.animation.Animation; import android.view.animation.Animation.AnimationListener; public class FeatureAnimationListener implements AnimationListener { private View mAnimView; private boolean mAnimIn; public FeatureAnimationListener(View animView, boolean animIn) { mAnimView = animView; mAnimIn = animIn; } @Override public void onAnimationEnd(Animation animation) { if(!mAnimIn) { mAnimView.setVisibility(View.INVISIBLE); } } @Override public void onAnimationRepeat(Animation animation) {} @Override public void onAnimationStart(Animation animation) { if(mAnimIn) { mAnimView.setVisibility(View.VISIBLE); } } }
activity_main.xml
[html]
view plaincopy
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" tools:context=".MainActivity">
<com.example.animatetest.ObservableScrollView
android:id="@+id/scrollView1" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content" android:background="@drawable/feature_bg"
android:gravity="center_horizontal" android:orientation="vertical">
<ImageView android:id="@+id/imageView2"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="100dp" android:src="@drawable/feature_title" />
<ImageView android:id="@+id/imageView1"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="20dp" android:src="@drawable/feature_lv" />
<ImageView android:id="@+id/imageView3"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView4"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView5"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_scroll_txt" />
<ImageView android:id="@+id/imageView6"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView7"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<LinearLayout android:id="@+id/anim1"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:gravity="center_vertical|center_horizontal">
<ImageView android:id="@+id/imageView8"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:src="@drawable/feature_car" />
<ImageView android:id="@+id/imageView9"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:src="@drawable/feature_gift" />
<ImageView android:id="@+id/imageView10"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:src="@drawable/feature_money" />
</LinearLayout>
<ImageView android:id="@+id/imageView11"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView12"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_dot" />
<ImageView android:id="@+id/imageView13"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_arrow_up" />
<ImageView android:id="@+id/imageView14"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="35dp" android:src="@drawable/feature_jobs_txt" />
</LinearLayout>
</com.example.animatetest.ObservableScrollView>
</RelativeLayout>
feature_anim2scale_in.xml
[html]
view plaincopy
<?xml version="1.0" encoding="utf-8"?>
<scale android:interpolator="@android:anim/overshoot_interpolator"
android:duration="200" android:pivotX="50.0%" android:pivotY="50.0%"
android:fillAfter="true" android:fromXScale="0.0" android:toXScale="1.0"
android:fromYScale="0.0" android:toYScale="1.0"
xmlns:android="http://schemas.android.com/apk/res/android" />
feature_alpha_out.xml
[html]
view plaincopy
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha android:interpolator="@android:anim/overshoot_interpolator"
android:duration="200" android:fromAlpha="1.0" android:toAlpha="0.0" />
</set>
然后这个DEMO我本人发现如下可以修改的地方：
这个最好activity不要实现OnScrollChangedListener
实现类单独写多个
这样就可以有不同的策略来实现change
就把acitivity里的实现OnScrollChangedListener的类抽出来写一个DefaultOnScrollChangedListener类，
activity里就定义一个OnScrollChangedListener变量
oncreate时赋值给他DefaultOnScrollChangedListener的实例
hasStart这样用有点扯
hasStart最好包在ScrollView里
修改的代码如下：
package com.example.animatetest;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
public class MainActivity extends Activity implements OnGlobalLayoutListener {
private ObservableScrollView mScrollView;
private View mAnimView;
private int mScrollViewHeight;
private int mStartAnimateTop;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mScrollView = (ObservableScrollView)this.findViewById(R.id.scrollView1);
mScrollView.getViewTreeObserver().addOnGlobalLayoutListener(this);
DefaultOnScrollChangedListener listener = new DefaultOnScrollChangedListener();
mScrollView.setOnScrollChangedListener(listener);
mAnimView = this.findViewById(R.id.anim1);
mAnimView.setVisibility(View.INVISIBLE);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
@Override
public void onGlobalLayout() {
mScrollViewHeight = mScrollView.getHeight();
mStartAnimateTop = mScrollViewHeight / 3 * 2;
}
public View getmAnimView() {
return mAnimView;
}
public int getmStartAnimateTop() {
return mStartAnimateTop;
}
}package com.example.animatetest;
import android.app.Activity;
import android.content.Context;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ScrollView;
public class DefaultOnScrollChangedListener implements OnScrollChangedListener{
private boolean hasStart = false;
@Override
public void onScrollChanged(Context context, int top, int oldTop) {
View mAnimView =((MainActivity) context).getmAnimView();
int mStartAnimateTop = ((MainActivity) context).getmStartAnimateTop();
int animTop = mAnimView.getTop() - top;
if(top > oldTop) {
if(animTop < mStartAnimateTop && !hasStart) {
Animation anim1 = AnimationUtils.loadAnimation(context, R.anim.feature_anim2scale_in);
anim1.setAnimationListener(new FeatureAnimationListener(mAnimView, true));
mAnimView.startAnimation(anim1);
hasStart = true;
}
} else {
if(animTop > mStartAnimateTop && hasStart) {
Animation anim1 = AnimationUtils.loadAnimation(context, R.anim.feature_alpha_out);
anim1.setAnimationListener(new FeatureAnimationListener(mAnimView, false));
mAnimView.startAnimation(anim1);
hasStart = false;
}
}
}
}package com.example.animatetest;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
public class FeatureAnimationListener implements AnimationListener {
private View mAnimView;
private boolean mAnimIn;
public FeatureAnimationListener(View animView, boolean animIn) {
mAnimView = animView;
mAnimIn = animIn;
}
@Override
public void onAnimationEnd(Animation animation) {
if(!mAnimIn) {
mAnimView.setVisibility(View.INVISIBLE);
}
}
@Override
public void onAnimationRepeat(Animation animation) {}
@Override
public void onAnimationStart(Animation animation) {
if(mAnimIn) {
mAnimView.setVisibility(View.VISIBLE);
}
}
}package com.example.animatetest;
import android.app.Activity;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ScrollView;
public class ObservableScrollView extends ScrollView {
private OnScrollChangedListener onScrollChangedListener;
public ObservableScrollView(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
//this.context = context;
}
public ObservableScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public ObservableScrollView(Context context) {
super(context);
}
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
super.onScrollChanged(l, t, oldl, oldt);
if(this.onScrollChangedListener != null) {
onScrollChangedListener.onScrollChanged(this.getContext(), t, oldt);
}
}
public void setOnScrollChangedListener(OnScrollChangedListener onScrollChangedListener) {
this.onScrollChangedListener = onScrollChangedListener;
}
}package com.example.animatetest;
import android.app.Activity;
import android.content.Context;
import android.widget.ScrollView;
public abstract interface OnScrollChangedListener {
public abstract void onScrollChanged(Context context, int top, int oldTop);
}源代码下载地址如下：
http://download.csdn.net/detail/opzoonzhuzhengke/6999895
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 仿 <赶集生活android客户端> 的介绍动画界面
- Android实战简易教程<三十二>（自定义View登录注册界面EditText-实现一键清空）
- Android Netroid框架介绍及使用，又一简单粗暴的网络框架！<Garry进阶(二)>
- 仿<赶集生活>客户端启动动画效果
- Android 自定义View背景动画 流程简读 <2>
- Android UI设计之<二>自定义SwitchButton开关，实现类似IOS中UISwitch的动画效果
- Android实战简易教程<十七>（LayoutAnimation布局动画）
- Graphics->BitmapDecode 介绍Android 平台对图像的解码功能，Android平台支持PNG, JPEG图像格式，并可以支持 gif动画。
- 从零开始学android<使用嵌套布局实现计算器界面.十七.>
- <Android> 在Activity之间进行滑动效果的切换Anim动画
- <Android>界面美化的一点点积累
- Android--SparseArray<E>详细介绍
- Android实战简易教程<五十六>（模拟美团客户端进度提示框）
- Android实战简易教程<六十三>（动画实现唱片播放界面）
- Android拨号界面输入*#*#<code>#*#*转入自定义Activity流程
- Android--SparseArray<E>详细介绍
- Android开源中国客户端学习 微博分享模块 <8>
- Android系统移植与调试之------->如何修改开机动画的两种方式剖析
- AndroidManifest.xml中的<meta-data>属性介绍
- Android实战简易教程<三十七>（ListView中点击button跳转到拨号界面实例）