类似path登陆的卡片实现

大家作为程序开发人员，相信对path这款应用程序都相当熟悉，path界面的设计就算不是最优秀，也是业界顶级的。最近Path为自己的应用程序添加了卡片的功能，比如卡片登陆的功能，看起来非常拉风。所以，我也尝试了实现了一下，虽然不可能达到Path那么变态的交互，但是基本的功能还是可以实现的。

    废话不说，直接进入主题。首先你肯定必须集成一个dialogFragment类，在子类中覆写onCreateDialog方法，在里面实现自定义布局，代码如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77

package  com.example.layouttrans;   import  android.app.AlertDialog; import  android.app.AlertDialog.Builder; import  android.app.Dialog; import  android.app.DialogFragment; import  android.content.DialogInterface; import  android.os.Bundle; import  android.util.Log; import  android.view.LayoutInflater; import  android.view.View;   public  class  WeiDialogFragment  extends  DialogFragment {        /**       * Create a new instance of MyDialogFragment, providing "num" as an       * argument.       */      static  WeiDialogFragment newInstance(String title, String message) {          WeiDialogFragment f =  new  WeiDialogFragment();            Bundle args =  new  Bundle();          args.putString( "title" , title);          args.putString( "message" , message);          f.setArguments(args);            return  f;      }        @Override      public  void  onCreate(Bundle savedInstanceState) {          super .onCreate(savedInstanceState);        }        @Override      public  Dialog onCreateDialog(Bundle savedInstanceState) {          Log.d( "wei" ,  "this is onCreateDialog" );            View view = LayoutInflater.from(getActivity()).inflate(                    R.layout.fragment_dialog,  null );            String title = getArguments().getString( "title" );          String message = getArguments().getString( "message" );            Builder builder =  new  AlertDialog.Builder(getActivity());          builder                  .setView(view)                  .setTitle(title)                  .setMessage(message)                  .setPositiveButton( "确定" ,  new  DialogInterface.OnClickListener() {                        @Override                      public  void  onClick(DialogInterface dialog,  int  which) {                          // TODO Auto-generated method stub                        }                  })                  .setNegativeButton( "取消" ,  new  DialogInterface.OnClickListener() {                        @Override                      public  void  onClick(DialogInterface dialog,  int  which) {                          // TODO Auto-generated method stub                          dismiss();                      }                  });            Dialog dialog = builder.create();            dialog.getWindow().setWindowAnimations(R.style.weiDialog);            return  dialog;        }   }

    代码中最重要的是dialog.getWindow().setWindowAnimation(R.style.weiDialog)方法。因为DialogFragment其实是Fragment中嵌套一个dialog。你必须获得window对象才能设置动画。下面是style文件和动画文件

style.xml

?

1 2 3 4

< style  name = "weiDialog"  parent = "@android:style/Animation.Dialog" >        < item  name = "android:windowEnterAnimation" >@anim/dialog_in</ item >       < item  name = "android:windowExitAnimation" >@anim/dialog_out</ item > </ style >

dialog_in.xml

?

1 2 3 4 5 6 7

<? xml  version = "1.0"  encoding = "utf-8" ?> < translate  xmlns:android = "http://schemas.android.com/apk/res/android"      android:duration = "300"      android:fromYDelta = "-200%p"      android:interpolator = "@android:anim/accelerate_interpolator"      android:toYDelta = "0%p"  > </ translate >

dialog_out.xml

?

1 2 3 4 5 6 7

<? xml  version = "1.0"  encoding = "utf-8" ?> < translate  xmlns:android = "http://schemas.android.com/apk/res/android"      android:duration = "300"      android:fromYDelta = "-200%p"      android:interpolator = "@android:anim/accelerate_interpolator"      android:toYDelta = "0%p"  > </ translate >

在这里值得注意的是有些数值是负值，这是因为dialog窗口本身只占据屏幕的一小部分，所以如果动画效果从0开始，那么就不是从屏幕最上面向下划出，而是从中间凭空出现（这样显得很怪异），具体情况看情况而定。

另外，布局文件和MainActivity就不给出了，相信对大家没什么难度，本人也是android新手，如果有什么不对的敌方，欢迎指正。