Android实现第三方登录的上拉展开,下拉隐藏,下拉隐藏示例
程序员文章站
2024-02-13 18:23:22
android的ui和交互是很重要的一部分,直接影响到用户对软件的体验。随着项目经验的积累,发现android中动画的运用越来越重要。本篇文章抽出了项目登录界面中实现的第三...
android的ui和交互是很重要的一部分,直接影响到用户对软件的体验。随着项目经验的积累,发现android中动画的运用越来越重要。本篇文章抽出了项目登录界面中实现的第三方登录,用户可以上拉展开,下拉隐藏第三方登录这么一个效果,提高用户和软件的交互性。
实现效果:
(1)activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <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="com.example.propertyanimation.mainactivity"> <relativelayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignparentbottom="true" android:orientation="vertical"> <relativelayout android:id="@+id/re_controlshowhideview" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginbottom="10dp" android:orientation="vertical"> <relativelayout android:id="@+id/re_showarrowhead" android:layout_width="match_parent" android:layout_height="wrap_content"> <view android:layout_width="match_parent" android:layout_height="0.1dp" android:layout_marginleft="12dp" android:layout_marginright="12dp" android:layout_margintop="17dip" android:background="#dadada" /> <imageview android:id="@+id/arrowhead" android:layout_width="30dip" android:layout_height="30dip" android:layout_centerinparent="true" android:src="@drawable/jiantoubelow" /> </relativelayout> <textview android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/re_showarrowhead" android:layout_margintop="10dp" android:gravity="center" android:text="-其他登录方式-" /> </relativelayout> <relativelayout android:id="@+id/showhideview" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/re_controlshowhideview" android:gravity="center" android:visibility="gone" android:orientation="vertical"> <button android:id="@+id/btn_qq" android:layout_width="40dp" android:layout_height="57.5dp" android:layout_gravity="center_vertical" android:layout_marginleft="10dp" android:background="@drawable/qqlogin" android:clickable="true" android:gravity="center" android:paddingleft="10dp" android:textsize="16sp" /> <button android:id="@+id/btn_weixin" android:layout_width="40dp" android:layout_height="57.5dp" android:layout_gravity="center_vertical" android:layout_marginleft="10dp" android:layout_torightof="@+id/btn_qq" android:background="@drawable/weixinlogin" android:clickable="true" android:gravity="center" android:paddingleft="10dp" android:textsize="16sp" /> </relativelayout> </relativelayout> </relativelayout>
(2)propertyanimation.java 这个文件主要是把实现的属性动画封装到一个类里,这样一个功能就成为一个模块。其它调用者也可以很方便的使用。
package com.example.propertyanimation; import android.animation.animator; import android.animation.animatorlisteneradapter; import android.animation.valueanimator; import android.content.context; import android.view.view; import android.view.viewgroup; import android.view.animation.animation; import android.view.animation.rotateanimation; public class propertyanimation { private float mdensity; private int mhiddenviewmeasuredheight; //点击箭头的时候,需要隐藏的控件最终到达一个高度, // 这个就是我们要控件到达的目标值。 public propertyanimation(context context){ //点击箭头的时候,需要隐藏的控件最终到达一个高度,这个就是我们的目标值,只需要通过布局中的dp转换成像素就行了。 mdensity = context.getresources().getdisplaymetrics().density; mhiddenviewmeasuredheight = (int) (mdensity * 57.5 + 0.5); } public void animateopen(view v) { v.setvisibility(view.visible); //createdropanimator()自定义的一个动画效果函数 valueanimator animator = createdropanimator(v, 0, mhiddenviewmeasuredheight); animator.start(); } /** * 给控制动画的箭头设置动画. * 给箭头设置向上的动画 * @param view 控件 */ public void animationivopen(view view) { //旋转动画,参数说明:new rotateanimation(旋转的开始角度,旋转的结束角度,x轴的伸缩模式:可以取值为absolute、 // relative_to_self、relative_to_parent,x坐标的伸缩值,y轴的伸缩模式:可以取值为absolute、relative_to_self、 // relative_to_parent,y坐标的伸缩值); rotateanimation animation = new rotateanimation(0, 180, animation.relative_to_self, 0.5f, animation.relative_to_self, 0.5f); //动画执行完后是否停留在执行完的状态 animation.setfillafter(true); //持续时间 animation.setduration(100); //为箭头图片绑定动画 view.startanimation(animation); } /** * 给控制动画的箭头设置动画. * 给箭头设置向下的动画 * @param view */ public void animationivclose(view view) { rotateanimation animation = new rotateanimation(180, 0, animation.relative_to_self, 0.5f, animation.relative_to_self, 0.5f); animation.setfillafter(true); animation.setduration(100); view.startanimation(animation); } /** * 设置隐藏动画 * * @param view //动画作用的控件 */ public void animateclose(final view view) { //获得控件的高度 int origheight = view.getheight(); //createdropanimator()自定义的一个动画效果函数 valueanimator animator = createdropanimator(view, origheight, 0); //如果你不想实现animator.animatorlistener中的所有接口,你可以通过继承animatorlisteneradapter。 //animatorlisteneradapter类为所有的方法提供了一个空实现,所以你可以根据需要实现你需要的,覆盖animatorlisteneradapter原来的方法 animator.addlistener(new animatorlisteneradapter() { @override public void onanimationend(animator animation) { //动画结束时调用 view.setvisibility(view.gone); } }); animator.start(); } /** * 自定义的动画效果 * * @param v //动画作用的控件 * @param start //动画的开始值 * @param end //动画的结束值 * @return */ private valueanimator createdropanimator(final view v, int start, int end) { //这里我们利用valueanimator.ofint创建了一个值从start到end的动画 valueanimator animator = valueanimator.ofint(start, end); //为valueanimator注册animatorupdatelistener监听器,在该监听器中可以 // 监听valueanimator计算出来的值的改变,并将这些值应用到指定对象 animator.addupdatelistener(new valueanimator.animatorupdatelistener() { @override public void onanimationupdate(valueanimator arg0) { //获取动画当前值 int value = (int) arg0.getanimatedvalue(); //得到控件的属性集合 viewgroup.layoutparams layoutparams = v.getlayoutparams(); //设置控件的高属性 layoutparams.height = value; //把属性绑定到需要动画的控件上 v.setlayoutparams(layoutparams); } }); return animator; } }
(3)mainactivity.java 这个文件开始使用封装好的属性动画了。
package com.example.propertyanimation; import android.app.activity; import android.os.bundle; import android.view.view; import android.widget.button; import android.widget.imageview; import android.widget.relativelayout; import android.widget.toast; public class mainactivity extends activity implements view.onclicklistener{ private imageview miv_arrowhead; private relativelayout mhiddenlayout; private propertyanimation propertyanimation; private button btn_qq; //qq登录按钮 private button btn_weixin; //微信登录按钮 @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); //自己定义的属性动画类 propertyanimation=new propertyanimation(this); //隐藏/显示第三方登录的箭头图标 miv_arrowhead = (imageview) this.findviewbyid(r.id.arrowhead); miv_arrowhead.setonclicklistener(this); //隐藏/显示的布局 mhiddenlayout = (relativelayout) this.findviewbyid(r.id.showhideview); //qq登录 btn_qq = (button) this.findviewbyid(r.id.btn_qq); btn_qq.setonclicklistener(this); //微信登录 btn_weixin=(button)this.findviewbyid(r.id.btn_weixin); btn_weixin.setonclicklistener(this); } @override public void onclick(view v) { switch (v.getid()) { case r.id.arrowhead: if (mhiddenlayout.getvisibility() == view.gone) { propertyanimation.animateopen(mhiddenlayout); propertyanimation.animationivopen(miv_arrowhead); } else { propertyanimation.animateclose(mhiddenlayout); propertyanimation.animationivclose(miv_arrowhead); } break; case r.id.btn_qq: //qq授权登录 toast.maketext(this,"qq登录",toast.length_short).show(); break; case r.id.btn_weixin: //微信授权登录 toast.maketext(this,"微信登录",toast.length_short).show(); break; } } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。