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

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

2016-04-29 4315

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

产品经理用的是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实现,带动画效果

热门文章

最新文章

相关课程

相关电子书

探索云世界

热门

云计算

大数据

云原生

人工智能

数据库

开发与运维

活动广场

任务中心

训练营

直播

乘风者计划

下载

镜像站

技术资料

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

热门文章

最新文章

相关课程

相关电子书