android标题栏下面弹出提示框(一) TextView实现,带动画效果-阿里云开发者社区

产品经理用的是ios手机,于是android就走上了模仿的道路.做这个东西也走了一些弯路,写一篇博客放在这里,以后自己也可用参考,也方便别人学习。

弯路:

1.刚开始本来用PopupWindow去实现,做着之后发现如果用popupwindow实现的话,从标题栏下面弹出就比较麻烦.

2.最外层的布局本来是用LinearLayout去实现的,然后标题栏跟弹出的那个TextView外边包裹一层RelativeLayout,这样就会有一个问题,父布局RelativeLayout高度就是标题栏高度,提示框的高度最多也是标题栏高度,就算往下移动我们也看不到.

3.最外层布局改成RelativeLayout之后显示循序也是有秩序的,第一个是内容View,第二个是提示的View,第三个是标题栏的View. android绘制View的原理就是最新画上去的一定在最上面,我们要保证标题栏始终显示,提示框可以遮住内容,内容是最后面的,所以需要第一个绘制。

实现步骤:

1.把显示提示View封装成自定义控件,继承自TextView.提供两个公共方法供外部调用.封装View的目的是代码复用,如果在其他地方也需要这种显示效果,在布局文件中引用自定义

View即可

1).showTips 显示提示View,调用向下移动动画,移动完成后延时一秒,再向上移动,并且改变透明度,动画结束后隐藏View。

2).setTitleHeight 看名字就知道设置标题栏的高度,因为我们这边是从标题栏下面弹出,所以我们得计算标题栏的高度是多少,才能知道往下面移动多少合适.移动上去同理.

2.Activity中显示自定义View.调用自定义View的公共方法.

1).在activity中注册回调接口来获取标题栏的高度,然后赋值给自定义View,

2).当我们需要提示的时候调用自定View的公共方法就行.

效果图如下:

ViewTestActivity.java 主Activity,程序的入口.

 
 /** 
 *  
 * @author ansen 
 * @create time 2015-10-20 
 */  
public class ViewTestActivity extends Activity implements OnGlobalLayoutListener{  
    private TipTextView tvTips;//提示  
    private TextView tvTitle;//标题  
      
    @Override  
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.activity_test);  
          
        tvTips=(TipTextView) findViewById(R.id.tv_tips);  
        tvTitle=(TextView) findViewById(R.id.tv_title);  
          
        //tvTitle在一个视图树中的焦点状态发生改变时，注册回调接口来获取标题栏的高度  
        ViewTreeObserver vto = tvTitle.getViewTreeObserver();     
        vto.addOnGlobalLayoutListener(this);  
          
        findViewById(R.id.btn_show_tip).setOnClickListener(clickListener);  
    }  
      
    private OnClickListener clickListener=new OnClickListener() {  
        @Override  
        public void onClick(View v) {  
            switch (v.getId()) {  
            case R.id.btn_show_tip://显示提示  
                tvTips.showTips();  
                break;  
            }  
        }  
    };  
      
    @SuppressLint("NewApi")  
    @Override  
    public void onGlobalLayout() {  
        tvTitle.getViewTreeObserver().removeOnGlobalLayoutListener(this);//删除监听  
        tvTips.setTitleHeight(tvTitle.getHeight());//把标题栏的高度赋值给自定义的TextView  
    }  
}  
 

activity_test.xml 显示的布局文件

 
 <?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:orientation="vertical" >  
      
    <View   
        android:layout_above="@+id/btn_show_tip"  
        android:layout_below="@+id/tv_title"  
        android:layout_height="match_parent"  
        android:layout_width="match_parent"  
        android:background="#00FFFF"/>  
  
    <com.example.tips.view.TipTextView  
        android:id="@+id/tv_tips"  
        android:layout_width="match_parent"  
        android:layout_height="wrap_content"  
        android:background="#faf3a1"  
        android:gravity="center"  
        android:paddingBottom="5dp"  
        android:paddingTop="5dp"  
        android:textColor="#ff4e00"  
        android:text="用动画实现提示"  
        android:visibility="gone"/>  
  
    <TextView  
        android:id="@+id/tv_title"  
        android:layout_width="match_parent"  
        android:layout_height="40dp"  
        android:gravity="center"  
        android:text="这是一个标题栏"  
        android:background="#FF00FF"  
        android:textSize="18sp"/>  
      
    <Button  
        android:id="@+id/btn_show_tip"  
        android:layout_width="match_parent"  
        android:layout_height="wrap_content"  
        android:layout_alignParentBottom="true"  
        android:text="弹窗提示!!!"/>  
  
</RelativeLayout>  
 

TipTextView.java 自定义View,继承TextView

 
 /** 
 * 自定义TextView  显示提示信息,显示时有动画效果(从上面弹出,然后改变透明度慢慢隐藏) 
 * @author ansen 
 * @create time 2015-10-20 
 */  
public class TipTextView extends TextView{  
    private static final int START_TIME=400;//动画显示时间  
    private static final int END_TIME=400;//动画移出时间  
    private static final int SHOW_TIME=1000;//动画显示时间  
      
    private int titleHeight=100;//标题栏默认的高度设置成100  
  
    public TipTextView(Context context) {  
        super(context);  
    }  
      
    public TipTextView(Context context, AttributeSet paramAttributeSet) {  
        super(context, paramAttributeSet);  
    }  
  
    public TipTextView(Context context, AttributeSet paramAttributeSet,int paramInt) {  
        super(context, paramAttributeSet, paramInt);  
    }  
      
    public void showTips(){  
        setVisibility(View.VISIBLE);  
          
        //向下移动动画  
        TranslateAnimation downTranslateAnimation=new TranslateAnimation(0,0,0,titleHeight);  
        downTranslateAnimation.setDuration(START_TIME);  
        downTranslateAnimation.setFillAfter(true);  
          
        startAnimation(downTranslateAnimation);  
          
        //动画监听  
        downTranslateAnimation.setAnimationListener(new AnimationListener() {  
            @Override  
            public void onAnimationStart(Animation animation) {}  
            @Override  
            public void onAnimationEnd(Animation animation){//向下移动动画结束  
                topTranslateAnimation();  
            }  
            @Override  
            public void onAnimationRepeat(Animation animation) {}  
        });  
    }  
      
    private void topTranslateAnimation(){  
        new Handler().postDelayed(new Runnable() {//延时1秒之后再向上移动  
            @Override  
            public void run(){  
                  
                //向上移动动画  
                TranslateAnimation topTranslateAnimation=new TranslateAnimation(0,0,titleHeight,0);  
                topTranslateAnimation.setDuration(END_TIME);  
                topTranslateAnimation.setFillAfter(true);  
                  
                //改变透明度  
                AlphaAnimation alphaAnimation=new AlphaAnimation(1,0);  
                alphaAnimation.setDuration(END_TIME);  
                  
                //两个动画添加到动画集合中  
                AnimationSet animationSet=new AnimationSet(true);  
                animationSet.addAnimation(topTranslateAnimation);  
                animationSet.addAnimation(alphaAnimation);  
                  
                startAnimation(animationSet);//开启动画  
                  
                animationSet.setAnimationListener(new AnimationListener() {  
                    @Override  
                    public void onAnimationStart(Animation animation) {}  
                    @Override  
                    public void onAnimationRepeat(Animation animation) {}  
                    @Override  
                    public void onAnimationEnd(Animation animation){//动画结束隐藏提示的TextView  
                        setVisibility(View.GONE);  
                    }  
                });  
            }  
        },SHOW_TIME);  
    }  
  
    /** 
     * 设置标题栏高度 
     * @param titleHeight 
     */  
    public void setTitleHeight(int titleHeight) {  
        this.titleHeight = titleHeight;  
    }  
}  
 

这篇就用TextView实现了,如果你所有的activity都需要加上这个提示,请阅读我的的下篇博客.android标题栏上面弹出提示框(二) PopupWindow实现,带动画效果

以上有步骤说明,效果图,源码,相信大家都能看懂....推荐下自己创建的android QQ群:202928390 欢迎大家的加入.

点击下载源码

android标题栏下面弹出提示框(一) TextView实现,带动画效果

热门文章

最新文章

相关课程

相关电子书