Android实用视图动画及工具系列之十:漂亮的发布动画,仿新浪首页加号发布微博动画框

实现效果



功能说明

本视图工具的创作灵感来自于新浪微博手机客户端,新浪微博手机客户端的微博发表界面便是类似的实现效果,其实实现方法比较简单,主要用到几种动画效果,如旋转,透明,转移,以及计时器等,将动画效果附加到按钮上,然后将整个界面作为一个Dialog实现就可以了。
适用于新手及新学习Android的码友们,老玩家当然也可以看看,这个还是挺简单挺实用的,在后面会简略介绍实现方法及源代码,同时博客的最后还提供源代码和图片等资源github下载地址。

实现步骤

步骤一:认识安卓动画

在编写下面的代码前,我们先来认识下Android的基本动画,本视图工具主要用到了三种动画形式:

alpha:
透明动画,主要根据alpha值的变化改变控件的透明度
  • android:fromAlpha   动画开始的透明度,从0.0 –1.0 ,0.0表示全透明,1.0表示完全不透明
  • android:toAlpha       动画结束时的透明度,也是从0.0 –1.0 ,0.0表示全透明,1.0表示完全不透明
  • android:duration        动画持续时间,以毫秒为单位 
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。
  1. <?xml version=“1.0” encoding=“utf-8”?>  
  2. <alpha xmlns:android=“http://schemas.android.com/apk/res/android”  
  3.     android:duration=“400”  
  4.     android:fromAlpha=“1.0”  
  5.     android:toAlpha=“0” />  
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="400"
    android:fromAlpha="1.0"
    android:toAlpha="0" />
rotate:
旋转动画,主要以其中心为旋转点,循环匀速旋转
  • android:fromDegrees     开始旋转的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:toDegrees         结束时旋转到的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:pivotX               缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:pivotY               缩放起点Y轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p
  • android:duration        动画持续时间,以毫秒为单位 
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。
  1. <?xml version=“1.0” encoding=“utf-8”?>  
  2. <rotate xmlns:android=“http://schemas.android.com/apk/res/android”  
  3.     android:duration=“400”  
  4.     android:fromDegrees=“0”  
  5.     android:toDegrees=“-135”  
  6.     android:pivotX=“50%”  
  7.     android:pivotY=“50%”  
  8.     />  
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="400"
    android:fromDegrees="0"
    android:toDegrees="-135"
    android:pivotX="50%"
    android:pivotY="50%"
    />
translate
位移动画,主要以控件的x,y轴为圆点,进行方位移动
  • android:fromXDelta     起始点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:fromYDelta    起始点Y轴从标,可以是数值、百分数、百分数p 三种样式;
  • android:toXDelta         结束点X轴坐标
  • android:toYDelta        结束点Y轴坐标
  • android:duration        动画持续时间,以毫秒为单位 
  • android:fillAfter          如果设置为true,控件动画结束时,将保持动画最后时的状态
  • android:fillBefore       如果设置为true,控件动画结束时,还原到开始动画前的状态
  • android:fillEnabled    与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态
  • android:repeatCount 重复次数
  • android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。
  • android:interpolator  设定插值器,其实就是指定的动作效果,比如弹跳效果等,不在这小节中讲解,后面会单独列出一单讲解。
  1. <?xml version=“1.0” encoding=“utf-8”?>  
  2. <translate xmlns:android=“http://schemas.android.com/apk/res/android”  
  3.     android:duration=“600”  
  4.     android:fromYDelta=“100%”  
  5.     android:interpolator=“@android:anim/anticipate_overshoot_interpolator”  
  6.     android:toYDelta=“0” />  
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="600"
    android:fromYDelta="100%"
    android:interpolator="@android:anim/anticipate_overshoot_interpolator"
    android:toYDelta="0" />

整个Demo项目的结构如下:



步骤二:添加Dialog布局

新建main_dialog_publish.xml布局,添加如下代码:
  1. <?xml version=“1.0” encoding=“utf-8”?>  
  2. <RelativeLayout xmlns:android=”http://schemas.android.com/apk/res/android”  
  3.     android:layout_width=”match_parent”  
  4.     android:layout_height=”match_parent” >  
  5.   
  6.     <RelativeLayout  
  7.         android:id=”@+id/mainPublish_dialog_rlMain”  
  8.         android:layout_width=”match_parent”  
  9.         android:layout_height=”match_parent”  
  10.         android:background=”#eeffffff”  
  11.         android:clickable=”true” >  
  12.   
  13.         <ImageView  
  14.             android:layout_width=”220dp”  
  15.             android:layout_height=”wrap_content”  
  16.             android:layout_centerHorizontal=”true”  
  17.             android:layout_marginTop=”60dp”  
  18.             android:contentDescription=”@null”  
  19.             android:scaleType=”centerInside”  
  20.             android:src=”@drawable/mainactivity_publish_worlduc” />  
  21.   
  22.         <LinearLayout  
  23.             android:layout_width=”match_parent”  
  24.             android:layout_height=”wrap_content”  
  25.             android:layout_alignParentBottom=”true”  
  26.             android:baselineAligned=”false”  
  27.             android:orientation=”horizontal” >  
  28.   
  29.             <LinearLayout  
  30.                 android:id=”@+id/mainPublish_dialog_llBtnArticle”  
  31.                 android:layout_width=”wrap_content”  
  32.                 android:layout_height=”wrap_content”  
  33.                 android:layout_weight=”1”  
  34.                 android:clickable=”true”  
  35.                 android:orientation=”vertical”  
  36.                 android:paddingBottom=”70dp”  
  37.                 android:paddingTop=”20dp” >  
  38.   
  39.                 <ImageView  
  40.                     android:layout_width=”55dp”  
  41.                     android:layout_height=”55dp”  
  42.                     android:layout_gravity=”center_horizontal”  
  43.                     android:contentDescription=”@null”  
  44.                     android:src=”@drawable/mainactivity_dialogpublish_article_selector” />  
  45.   
  46.                 <TextView  
  47.                     android:layout_width=”wrap_content”  
  48.                     android:layout_height=”wrap_content”  
  49.                     android:layout_gravity=”center_horizontal”  
  50.                     android:layout_marginTop=”5dp”  
  51.                     android:text=”文章”  
  52.                     android:textColor=”#3E3E3E”  
  53.                     android:textSize=”13sp” />  
  54.             </LinearLayout>  
  55.   
  56.             <LinearLayout  
  57.                 android:id=”@+id/mainPublish_dialog_llBtnMiniBlog”  
  58.                 android:layout_width=”wrap_content”  
  59.                 android:layout_height=”wrap_content”  
  60.                 android:layout_weight=”1”  
  61.                 android:clickable=”true”  
  62.                 android:orientation=”vertical”  
  63.                 android:paddingBottom=”70dp”  
  64.                 android:paddingTop=”20dp” >  
  65.   
  66.                 <ImageView  
  67.                     android:layout_width=”55dp”  
  68.                     android:layout_height=”55dp”  
  69.                     android:layout_gravity=”center_horizontal”  
  70.                     android:contentDescription=”@null”  
  71.                     android:src=”@drawable/mainactivity_dialogpublish_miniblog_selector” />  
  72.   
  73.                 <TextView  
  74.                     android:layout_width=”wrap_content”  
  75.                     android:layout_height=”wrap_content”  
  76.                     android:layout_gravity=”center_horizontal”  
  77.                     android:layout_marginTop=”5dp”  
  78.                     android:text=”微博”  
  79.                     android:textColor=”#3E3E3E”  
  80.                     android:textSize=”13sp” />  
  81.             </LinearLayout>  
  82.   
  83.             <LinearLayout  
  84.                 android:id=”@+id/mainPublish_dialog_llBtnLetter”  
  85.                 android:layout_width=”wrap_content”  
  86.                 android:layout_height=”wrap_content”  
  87.                 android:layout_weight=”1”  
  88.                 android:clickable=”true”  
  89.                 android:orientation=”vertical”  
  90.                 android:paddingBottom=”70dp”  
  91.                 android:paddingTop=”20dp” >  
  92.   
  93.                 <ImageView  
  94.                     android:layout_width=”55dp”  
  95.                     android:layout_height=”55dp”  
  96.                     android:layout_gravity=”center_horizontal”  
  97.                     android:contentDescription=”@null”  
  98.                     android:src=”@drawable/mainactivity_dialogpublish_letter_selector” />  
  99.   
  100.                 <TextView  
  101.                     android:layout_width=”wrap_content”  
  102.                     android:layout_height=”wrap_content”  
  103.                     android:layout_gravity=”center_horizontal”  
  104.                     android:layout_marginTop=”5dp”  
  105.                     android:text=”私信”  
  106.                     android:textColor=”#3E3E3E”  
  107.                     android:textSize=”13sp” />  
  108.             </LinearLayout>  
  109.   
  110.             <LinearLayout  
  111.                 android:id=”@+id/mainPublish_dialog_llBtnPhoto”  
  112.                 android:layout_width=”wrap_content”  
  113.                 android:layout_height=”wrap_content”  
  114.                 android:layout_weight=”1”  
  115.                 android:clickable=”true”  
  116.                 android:orientation=”vertical”  
  117.                 android:paddingBottom=”70dp”  
  118.                 android:paddingTop=”20dp” >  
  119.   
  120.                 <ImageView  
  121.                     android:layout_width=”55dp”  
  122.                     android:layout_height=”55dp”  
  123.                     android:layout_gravity=”center_horizontal”  
  124.                     android:contentDescription=”@null”  
  125.                     android:src=”@drawable/mainactivity_dialogpublish_photo_selector” />  
  126.   
  127.                 <TextView  
  128.                     android:layout_width=”wrap_content”  
  129.                     android:layout_height=”wrap_content”  
  130.                     android:layout_gravity=”center_horizontal”  
  131.                     android:layout_marginTop=”5dp”  
  132.                     android:text=”照片”  
  133.                     android:textColor=”#3E3E3E”  
  134.                     android:textSize=”13sp” />  
  135.             </LinearLayout>  
  136.         </LinearLayout>  
  137.     </RelativeLayout>  
  138.   
  139.     <LinearLayout  
  140.         android:id=”@+id/mainPublish_dialog_llBtnMenu”  
  141.         android:layout_width=”wrap_content”  
  142.         android:layout_height=”wrap_content”  
  143.         android:layout_alignParentBottom=”true”  
  144.         android:layout_centerHorizontal=”true”  
  145.         android:clickable=”true”  
  146.         android:gravity=”bottom|center_horizontal”  
  147.         android:orientation=”vertical”  
  148.         android:paddingLeft=”10dp”  
  149.         android:paddingRight=”10dp” >  
  150.   
  151.         <ImageView  
  152.             android:id=”@+id/mainPublish_dialog_ivMenu”  
  153.             android:layout_width=”45dp”  
  154.             android:layout_height=”45dp”  
  155.             android:layout_marginBottom=”4dp”  
  156.             android:contentDescription=”@null”  
  157.             android:src=”@drawable/mainactivity_publish_publish2” />  
  158.     </LinearLayout>  
  159.   
  160. </RelativeLayout>  
<?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" >

    <RelativeLayout
        android:id="@+id/mainPublish_dialog_rlMain"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#eeffffff"
        android:clickable="true" >

        <ImageView
            android:layout_width="220dp"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="60dp"
            android:contentDescription="@null"
            android:scaleType="centerInside"
            android:src="@drawable/mainactivity_publish_worlduc" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:baselineAligned="false"
            android:orientation="horizontal" >

            <LinearLayout
                android:id="@+id/mainPublish_dialog_llBtnArticle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:clickable="true"
                android:orientation="vertical"
                android:paddingBottom="70dp"
                android:paddingTop="20dp" >

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:layout_gravity="center_horizontal"
                    android:contentDescription="@null"
                    android:src="@drawable/mainactivity_dialogpublish_article_selector" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:layout_marginTop="5dp"
                    android:text="文章"
                    android:textColor="#3E3E3E"
                    android:textSize="13sp" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/mainPublish_dialog_llBtnMiniBlog"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:clickable="true"
                android:orientation="vertical"
                android:paddingBottom="70dp"
                android:paddingTop="20dp" >

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:layout_gravity="center_horizontal"
                    android:contentDescription="@null"
                    android:src="@drawable/mainactivity_dialogpublish_miniblog_selector" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:layout_marginTop="5dp"
                    android:text="微博"
                    android:textColor="#3E3E3E"
                    android:textSize="13sp" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/mainPublish_dialog_llBtnLetter"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:clickable="true"
                android:orientation="vertical"
                android:paddingBottom="70dp"
                android:paddingTop="20dp" >

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:layout_gravity="center_horizontal"
                    android:contentDescription="@null"
                    android:src="@drawable/mainactivity_dialogpublish_letter_selector" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:layout_marginTop="5dp"
                    android:text="私信"
                    android:textColor="#3E3E3E"
                    android:textSize="13sp" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/mainPublish_dialog_llBtnPhoto"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:clickable="true"
                android:orientation="vertical"
                android:paddingBottom="70dp"
                android:paddingTop="20dp" >

                <ImageView
                    android:layout_width="55dp"
                    android:layout_height="55dp"
                    android:layout_gravity="center_horizontal"
                    android:contentDescription="@null"
                    android:src="@drawable/mainactivity_dialogpublish_photo_selector" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:layout_marginTop="5dp"
                    android:text="照片"
                    android:textColor="#3E3E3E"
                    android:textSize="13sp" />
            </LinearLayout>
        </LinearLayout>
    </RelativeLayout>

    <LinearLayout
        android:id="@+id/mainPublish_dialog_llBtnMenu"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:clickable="true"
        android:gravity="bottom|center_horizontal"
        android:orientation="vertical"
        android:paddingLeft="10dp"
        android:paddingRight="10dp" >

        <ImageView
            android:id="@+id/mainPublish_dialog_ivMenu"
            android:layout_width="45dp"
            android:layout_height="45dp"
            android:layout_marginBottom="4dp"
            android:contentDescription="@null"
            android:src="@drawable/mainactivity_publish_publish2" />
    </LinearLayout>

</RelativeLayout>

步骤三:添加主代码

新建PublishDialog类,代码如下:
  1. package com.jaiky.publishpopup;  
  2.   
  3. import android.app.Dialog;  
  4. import android.content.Context;  
  5. import android.os.Bundle;  
  6. import android.os.Handler;  
  7. import android.view.KeyEvent;  
  8. import android.view.View;  
  9. import android.view.ViewGroup;  
  10. import android.view.WindowManager;  
  11. import android.view.animation.AnimationUtils;  
  12. import android.widget.ImageView;  
  13. import android.widget.LinearLayout;  
  14. import android.widget.RelativeLayout;  
  15.   
  16. /** 
  17.  * Author by Jaiky, Email jaikydota@163.com, Date on 3/2/2015. 
  18.  * PS: Not easy to write code, please indicate. 
  19.  */  
  20. public class PublishDialog extends Dialog {  
  21.   
  22.     private RelativeLayout rlMain;  
  23.   
  24.     private Context context;  
  25.   
  26.     private LinearLayout llBtnArticle, llBtnMiniBlog, llBtnLetter, llBtnPhoto, llBtnMenu;  
  27.   
  28.     private Handler handler;  
  29.   
  30.     private ImageView ivMenu;  
  31.   
  32.     public PublishDialog(Context context) {  
  33.         this(context, R.style.main_publishdialog_style);  
  34.     }  
  35.   
  36.     private PublishDialog(Context context, int theme) {  
  37.         super(context, theme);  
  38.         this.context = context;  
  39.         init();  
  40.     }  
  41.   
  42.     /** 
  43.      * 初始化 
  44.      */  
  45.     private void init() {  
  46.         handler = new Handler();  
  47.         //填充视图  
  48.         setContentView(R.layout.main_dialog_publish);  
  49.         rlMain = (RelativeLayout) findViewById(R.id.mainPublish_dialog_rlMain);  
  50.   
  51.         llBtnArticle = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnArticle);  
  52.         llBtnMiniBlog = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnMiniBlog);  
  53.         llBtnLetter = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnLetter);  
  54.         llBtnPhoto = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnPhoto);  
  55.         llBtnMenu = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnMenu);  
  56.         ivMenu = (ImageView) findViewById(R.id.mainPublish_dialog_ivMenu);  
  57.   
  58.   
  59.         llBtnMenu.setOnClickListener(new View.OnClickListener() {  
  60.   
  61.             @Override  
  62.             public void onClick(View v) {  
  63.                 outputDialog();  
  64.             }  
  65.         });  
  66.         rlMain.setOnClickListener(new View.OnClickListener() {  
  67.   
  68.             @Override  
  69.             public void onClick(View v) {  
  70.                 outputDialog();  
  71.             }  
  72.         });  
  73.     }  
  74.   
  75.   
  76.     /** 
  77.      * 进入对话框(带动画) 
  78.      */  
  79.     private void inputDialog() {  
  80.         llBtnArticle.setVisibility(View.INVISIBLE);  
  81.         llBtnMiniBlog.setVisibility(View.INVISIBLE);  
  82.         llBtnLetter.setVisibility(View.INVISIBLE);  
  83.         llBtnPhoto.setVisibility(View.INVISIBLE);  
  84.         //背景动画  
  85.         rlMain.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_fade_in));  
  86.         //菜单按钮动画  
  87.         ivMenu.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_rotate_right));  
  88.         //选项动画  
  89.         llBtnArticle.setVisibility(View.VISIBLE);  
  90.         llBtnArticle.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));  
  91.         handler.postDelayed(new Runnable() {  
  92.   
  93.             @Override  
  94.             public void run() {  
  95.                 llBtnMiniBlog.setVisibility(View.VISIBLE);  
  96.                 llBtnMiniBlog.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));  
  97.             }  
  98.         }, 100);  
  99.         handler.postDelayed(new Runnable() {  
  100.   
  101.             @Override  
  102.             public void run() {  
  103.                 llBtnLetter.setVisibility(View.VISIBLE);  
  104.                 llBtnLetter.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));  
  105.             }  
  106.         }, 200);  
  107.         handler.postDelayed(new Runnable() {  
  108.   
  109.             @Override  
  110.             public void run() {  
  111.                 llBtnPhoto.setVisibility(View.VISIBLE);  
  112.                 llBtnPhoto.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));  
  113.             }  
  114.         }, 300);  
  115.     }  
  116.   
  117.   
  118.     @Override  
  119.     public boolean onKeyDown(int keyCode, KeyEvent event) {  
  120.         if (isShowing()) {  
  121.             outputDialog();  
  122.             return true;  
  123.         }  
  124.         else {  
  125.             return super.onKeyDown(keyCode, event);  
  126.         }  
  127.     }  
  128.   
  129.   
  130.     /** 
  131.      * 取消对话框(带动画) 
  132.      */  
  133.     private void outputDialog() {  
  134.         //退出动画  
  135.         rlMain.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_fade_out));  
  136.         ivMenu.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_rotate_left));  
  137.         handler.postDelayed(new Runnable() {  
  138.   
  139.             @Override  
  140.             public void run() {  
  141.                 dismiss();  
  142.             }  
  143.         }, 400);  
  144.         llBtnArticle.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));  
  145.         llBtnArticle.setVisibility(View.INVISIBLE);  
  146.         handler.postDelayed(new Runnable() {  
  147.   
  148.             @Override  
  149.             public void run() {  
  150.                 llBtnMiniBlog.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));  
  151.                 llBtnMiniBlog.setVisibility(View.INVISIBLE);  
  152.             }  
  153.         }, 50);  
  154.         handler.postDelayed(new Runnable() {  
  155.   
  156.             @Override  
  157.             public void run() {  
  158.                 llBtnLetter.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));  
  159.                 llBtnLetter.setVisibility(View.INVISIBLE);  
  160.             }  
  161.         }, 100);  
  162.         handler.postDelayed(new Runnable() {  
  163.   
  164.             @Override  
  165.             public void run() {  
  166.                 llBtnPhoto.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));  
  167.                 llBtnPhoto.setVisibility(View.INVISIBLE);  
  168.             }  
  169.         }, 150);  
  170.   
  171.     }  
  172.   
  173.   
  174.     @Override  
  175.     public void show() {  
  176.         super.show();  
  177.         inputDialog();  
  178.     }  
  179.   
  180.     @Override  
  181.     protected void onCreate(Bundle savedInstanceState) {  
  182.         super.onCreate(savedInstanceState);  
  183.         //全屏  
  184.         WindowManager.LayoutParams params = getWindow().getAttributes();  
  185.         params.height = ViewGroup.LayoutParams.MATCH_PARENT;  
  186.         params.width = ViewGroup.LayoutParams.MATCH_PARENT;  
  187.         getWindow().setAttributes((android.view.WindowManager.LayoutParams) params);  
  188.     }  
  189.   
  190.   
  191.     public PublishDialog setArticleBtnClickListener(android.view.View.OnClickListener clickListener) {  
  192.         llBtnArticle.setOnClickListener(clickListener);  
  193.         return this;  
  194.     }  
  195.   
  196.     public PublishDialog setMiniBlogBtnClickListener(android.view.View.OnClickListener clickListener) {  
  197.         llBtnMiniBlog.setOnClickListener(clickListener);  
  198.         return this;  
  199.     }  
  200.   
  201.     public PublishDialog setLetterBtnClickListener(android.view.View.OnClickListener clickListener) {  
  202.         llBtnLetter.setOnClickListener(clickListener);  
  203.         return this;  
  204.     }  
  205.   
  206.     public PublishDialog setPhotoBtnClickListener(android.view.View.OnClickListener clickListener) {  
  207.         llBtnPhoto.setOnClickListener(clickListener);  
  208.         return this;  
  209.     }  
  210. }  
package com.jaiky.publishpopup;

import android.app.Dialog;
import android.content.Context;
import android.os.Bundle;
import android.os.Handler;
import android.view.KeyEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;

/**
 * Author by Jaiky, Email jaikydota@163.com, Date on 3/2/2015.
 * PS: Not easy to write code, please indicate.
 */
public class PublishDialog extends Dialog {

    private RelativeLayout rlMain;

    private Context context;

    private LinearLayout llBtnArticle, llBtnMiniBlog, llBtnLetter, llBtnPhoto, llBtnMenu;

    private Handler handler;

    private ImageView ivMenu;

    public PublishDialog(Context context) {
        this(context, R.style.main_publishdialog_style);
    }

    private PublishDialog(Context context, int theme) {
        super(context, theme);
        this.context = context;
        init();
    }

    /**
     * 初始化
     */
    private void init() {
        handler = new Handler();
        //填充视图
        setContentView(R.layout.main_dialog_publish);
        rlMain = (RelativeLayout) findViewById(R.id.mainPublish_dialog_rlMain);

        llBtnArticle = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnArticle);
        llBtnMiniBlog = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnMiniBlog);
        llBtnLetter = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnLetter);
        llBtnPhoto = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnPhoto);
        llBtnMenu = (LinearLayout) findViewById(R.id.mainPublish_dialog_llBtnMenu);
        ivMenu = (ImageView) findViewById(R.id.mainPublish_dialog_ivMenu);


        llBtnMenu.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                outputDialog();
            }
        });
        rlMain.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                outputDialog();
            }
        });
    }


    /**
     * 进入对话框(带动画)
     */
    private void inputDialog() {
        llBtnArticle.setVisibility(View.INVISIBLE);
        llBtnMiniBlog.setVisibility(View.INVISIBLE);
        llBtnLetter.setVisibility(View.INVISIBLE);
        llBtnPhoto.setVisibility(View.INVISIBLE);
        //背景动画
        rlMain.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_fade_in));
        //菜单按钮动画
        ivMenu.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_rotate_right));
        //选项动画
        llBtnArticle.setVisibility(View.VISIBLE);
        llBtnArticle.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                llBtnMiniBlog.setVisibility(View.VISIBLE);
                llBtnMiniBlog.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));
            }
        }, 100);
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                llBtnLetter.setVisibility(View.VISIBLE);
                llBtnLetter.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));
            }
        }, 200);
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                llBtnPhoto.setVisibility(View.VISIBLE);
                llBtnPhoto.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_in));
            }
        }, 300);
    }


    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (isShowing()) {
            outputDialog();
            return true;
        }
        else {
            return super.onKeyDown(keyCode, event);
        }
    }


    /**
     * 取消对话框(带动画)
     */
    private void outputDialog() {
        //退出动画
        rlMain.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_fade_out));
        ivMenu.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_rotate_left));
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                dismiss();
            }
        }, 400);
        llBtnArticle.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));
        llBtnArticle.setVisibility(View.INVISIBLE);
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                llBtnMiniBlog.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));
                llBtnMiniBlog.setVisibility(View.INVISIBLE);
            }
        }, 50);
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                llBtnLetter.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));
                llBtnLetter.setVisibility(View.INVISIBLE);
            }
        }, 100);
        handler.postDelayed(new Runnable() {

            @Override
            public void run() {
                llBtnPhoto.startAnimation(AnimationUtils.loadAnimation(context, R.anim.mainactivity_push_bottom_out));
                llBtnPhoto.setVisibility(View.INVISIBLE);
            }
        }, 150);

    }


    @Override
    public void show() {
        super.show();
        inputDialog();
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //全屏
        WindowManager.LayoutParams params = getWindow().getAttributes();
        params.height = ViewGroup.LayoutParams.MATCH_PARENT;
        params.width = ViewGroup.LayoutParams.MATCH_PARENT;
        getWindow().setAttributes((android.view.WindowManager.LayoutParams) params);
    }


    public PublishDialog setArticleBtnClickListener(android.view.View.OnClickListener clickListener) {
        llBtnArticle.setOnClickListener(clickListener);
        return this;
    }

    public PublishDialog setMiniBlogBtnClickListener(android.view.View.OnClickListener clickListener) {
        llBtnMiniBlog.setOnClickListener(clickListener);
        return this;
    }

    public PublishDialog setLetterBtnClickListener(android.view.View.OnClickListener clickListener) {
        llBtnLetter.setOnClickListener(clickListener);
        return this;
    }

    public PublishDialog setPhotoBtnClickListener(android.view.View.OnClickListener clickListener) {
        llBtnPhoto.setOnClickListener(clickListener);
        return this;
    }
}

——————————————————————————————————————–
获取源代码及资源文件:
——————————————————————————————————————–

声明

欢迎转载,但请保留文章原始出处
作者:Jaiky_杰哥 
出处:http://blog.csdn.net/jaikydota163/article/details/52098884


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值