自定义控件实现学习

1.优酷菜单的实现-利用现有的控件实现
实现优酷菜单的步骤分四步：
*在xml文件中进行布局设计
*给指定的控件添加点击事件
*执行动画（设定animationUtils类，里面完成动画类设计）–旋转动画–补间动画
*手机菜单按钮的捕获
主要代码如下
(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.youkumenu.MainActivity">    <RelativeLayout        android:id="@+id/rl_level1"        android:layout_width="100dp"        android:background="@mipmap/level1"        android:layout_alignParentBottom="true"        android:layout_centerHorizontal="true"        android:layout_height="50dp">        <ImageButton            android:id="@+id/ib_home"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/icon_home"            android:layout_centerInParent="true"            android:background="@null"/>    </RelativeLayout>    <RelativeLayout        android:id="@+id/rl_level2"        android:layout_width="180dp"        android:background="@mipmap/level2"        android:layout_alignParentBottom="true"        android:layout_centerHorizontal="true"        android:layout_height="90dp">        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/icon_search"            android:layout_alignParentBottom="true"            android:layout_marginLeft="10dp"            android:layout_marginBottom="5dp"            android:background="@null"            />        <ImageButton            android:id="@+id/ib_menu"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/icon_menu"            android:layout_centerHorizontal="true"            android:layout_marginTop="5dp"            android:background="@null"/>        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/icon_myyouku"            android:layout_alignParentBottom="true"            android:layout_alignParentRight="true"            android:layout_marginRight="10dp"            android:layout_marginBottom="5dp"            android:background="@null"/>    </RelativeLayout>    <RelativeLayout        android:id="@+id/rl_level3"        android:layout_width="280dp"        android:background="@mipmap/level3"        android:layout_height="140dp"        android:layout_alignParentBottom="true"        android:layout_centerHorizontal="true">        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel1"            android:layout_alignParentBottom="true"            android:layout_marginLeft="10dp"            android:layout_marginBottom="5dp"            android:background="@null"            />        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel2"           android:layout_marginLeft="30dp"            android:layout_marginTop="60dp"            android:background="@null"/>        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel3"            android:layout_marginLeft="65dp"            android:layout_marginTop="25dp"            android:background="@null"/>        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel4"            android:layout_centerHorizontal="true"            android:layout_marginTop="5dp"            android:background="@null"/>        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel5"            android:layout_alignParentRight="true"            android:layout_marginRight="65dp"            android:layout_marginTop="25dp"            android:background="@null"/>        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel6"            android:layout_alignParentRight="true"            android:layout_marginRight="30dp"            android:layout_marginTop="60dp"            android:background="@null"/>        <ImageButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@mipmap/channel7"            android:layout_alignParentBottom="true"            android:layout_alignParentRight="true"            android:layout_marginRight="10dp"            android:layout_marginBottom="5dp"            android:background="@null"/>    </RelativeLayout></RelativeLayout>

(2)MainActivity.java

package com.youkumenu;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.KeyEvent;import android.view.View;import android.widget.RelativeLayout;import com.youkumenu.utils.AnimationUtils;public  class MainActivity extends AppCompatActivity implements View.OnClickListener{    private RelativeLayout rl_level1;    private RelativeLayout rl_level2;    private RelativeLayout rl_level3;    boolean isLevel1Display=true;    boolean isLevel2Display=true;    boolean isLevel3Display=true;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        //初始化控件        initViews();    }    //自定义方法，初始化UI布局    private void  initViews(){        findViewById(R.id.ib_home).setOnClickListener(this);        findViewById(R.id.ib_menu).setOnClickListener(this);        rl_level1= (RelativeLayout) findViewById(R.id.rl_level1);        rl_level2= (RelativeLayout) findViewById(R.id.rl_level2);        rl_level3= (RelativeLayout) findViewById(R.id.rl_level3);    }    //捕获手机菜单键的按下    @Override    public boolean onKeyDown(int keyCode, KeyEvent event) {        //keycode 事件码        //keyevent 保存了当前事件的其他信息，如单击，双击等等        if(keyCode == KeyEvent.KEYCODE_MENU){//如果按下去的是手机菜单            if(isLevel1Display){                long delay=0;                if(isLevel3Display){                    AnimationUtils.rotateOutAnim(rl_level3,0);//如果三级菜单存在，转出去                    isLevel3Display=false;                    delay+=200;                }                if(isLevel2Display){                    AnimationUtils.rotateOutAnim(rl_level2,delay);//如果第二级级菜单存在，转出去                    isLevel2Display=false;                    delay+=200;                }                    AnimationUtils.rotateOutAnim(rl_level1,delay);//如果第二级级菜单存在，转出去            }else{                //顺次转进来，一级，二级，三级                AnimationUtils.rotateInAnim(rl_level1,0);                AnimationUtils.rotateInAnim(rl_level2,200);                isLevel2Display=true;                AnimationUtils.rotateInAnim(rl_level3,400);                isLevel3Display=true;            }            isLevel1Display=!isLevel1Display;            return true;//表示消费了当前事件        }        return super.onKeyDown(keyCode, event);    }    @Override    public void onClick(View v){        if(AnimationUtils.runningAnimationCount>0){            //表示当前有动画正在执行，不执行当前点击事件            return;        }       switch (v.getId()){           case R.id.ib_home:               //逻辑代码               //如果三级菜单已经显示，点击-->让菜单转出去               //如果三级菜单没有显示，点击-->让菜单转进来显示               if(isLevel2Display){                   //定义新变量，来保存level2延迟的时间，如果三级菜单存在，延迟200，如果三级菜单不存在，则保持默认0                   long delay=0;                   //考虑三级菜单是否存在                   if(isLevel3Display){                       AnimationUtils.rotateOutAnim(rl_level3,0);                       isLevel3Display=false;                       delay=200;                   }                   AnimationUtils.rotateOutAnim(rl_level2,delay);//设置level3先转，然后level2转                   isLevel2Display=false;               }else{                   AnimationUtils.rotateInAnim(rl_level2, 0);                   isLevel2Display=true;               }                break;           case R.id.ib_menu:               //逻辑代码               //如果三级菜单已经显示，点击-->让菜单转出去               //如果三级菜单没有显示，点击-->让菜单转进来显示                if(isLevel3Display){                    AnimationUtils.rotateOutAnim(rl_level3,0);                    isLevel3Display=false;                }else{                    AnimationUtils.rotateInAnim(rl_level3, 0);                    isLevel3Display=true;                }               break;           default:               break;       }    }}

(3)工具类 AnimationUtils

package com.youkumenu.utils;import android.view.animation.Animation;import android.view.animation.RotateAnimation;import android.widget.RelativeLayout;/** * Created by zuojx on 2017/12/12. */public class AnimationUtils {    public static int runningAnimationCount=0;//表示当前在执行的动画的数量    //旋转出去的动画    public static void rotateOutAnim(RelativeLayout layout,long delay) {       //如果转出去了，则找到所有的子view，进行隐藏        int childCount = layout.getChildCount();        for (int i=0;i<childCount;i++){            layout.getChildAt(i).setEnabled(false);        }        RotateAnimation ra= new RotateAnimation(               0f,-180f,  //开始、结束的角度 逆时针旋转，角度递减；顺时针旋转，角度递增               Animation.RELATIVE_TO_SELF,0.5f,//相对的坐标点，指定旋转中心的X值               Animation.RELATIVE_TO_SELF,1f);//相对的坐标点，指定旋转中心的Y值        ra.setDuration(500);  //设定执行时长        ra.setFillAfter(true); //设定动画停止在结束位置--->补间动画必须设定的参数        ra.setStartOffset(delay);//设置动画开始延时时间        ra.setAnimationListener(new MyAnimationListener());//转出动画添加监听事件        layout.startAnimation(ra);    }    public static void rotateInAnim(RelativeLayout layout, long delay) {        //如果转进来了，则找到所有的子view，进行启用        int childCount = layout.getChildCount();        for (int i=0;i<childCount;i++){            layout.getChildAt(i).setEnabled(true);        }        RotateAnimation ra= new RotateAnimation(                -180f,0f,  //开始、结束的角度 逆时针旋转，角度递减；顺时针旋转，角度递增                Animation.RELATIVE_TO_SELF,0.5f,//相对的坐标点，指定旋转中心的X值                Animation.RELATIVE_TO_SELF,1f);//相对的坐标点，指定旋转中心的Y值        ra.setDuration(500);  //设定执行时长        ra.setFillAfter(true); //设定动画停止在结束位置--->补间动画必须设定的参数        ra.setStartOffset(delay);//设置动画开始延时时间        ra.setAnimationListener(new MyAnimationListener());//转入动画添加监听事件        layout.startAnimation(ra);    }    static class MyAnimationListener implements Animation.AnimationListener{        @Override        public void onAnimationStart(Animation animation) {            runningAnimationCount++;        }        @Override        public void onAnimationEnd(Animation animation) {            runningAnimationCount--;        }        @Override        public void onAnimationRepeat(Animation animation) {        }    }}