Android高级--自定义控件一，优酷…

布局：

      
http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

               android:layout_alignParentBottom="true"
        android:id="@+id/rl_out"
        android:layout_width="280dip"
        android:layout_height="140dip"
        android:layout_centerHorizontal="true" >

                    android:layout_width="280dip"
            android:layout_height="140dip"
            android:background="@drawable/level3" />

                    android:id="@+id/iv_channel1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginLeft="7dip"
            android:src="@drawable/channel1" />

                    android:id="@+id/iv_channel7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginRight="7dip"
            android:src="@drawable/channel7" />

                    android:id="@+id/iv_channel2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="44dip"
            android:layout_marginLeft="26dip"
            android:src="@drawable/channel2" />

                    android:id="@+id/iv_channel6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="44dip"
            android:layout_marginRight="26dip"
            android:src="@drawable/channel6" />

                    android:id="@+id/iv_channel3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="82dip"
            android:layout_marginLeft="60dip"
            android:src="@drawable/channel3" />

                    android:id="@+id/iv_channel5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginBottom="82dip"
            android:layout_marginRight="60dip"
            android:src="@drawable/channel5" />

                    android:id="@+id/iv_channel4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="3dip"
            android:src="@drawable/channel4" />
   

            android:id="@+id/rl_middle"
        android:layout_width="180dip"
        android:layout_height="90dip"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" >

                    android:layout_width="180dip"
            android:layout_height="90dip"
            android:background="@drawable/level2" />

                    android:id="@+id/iv_info"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_marginLeft="5dip"
            android:src="@drawable/icon_myyouku" />

                    android:id="@+id/iv_search"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_marginRight="5dip"
            android:src="@drawable/icon_search" />

                    android:id="@+id/iv_menu"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="3dip"
            android:src="@drawable/icon_menu" />
   

            android:id="@+id/rl_inner"
        android:layout_width="100dip"
        android:layout_height="50dip"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true" >

                    android:layout_width="100dip"
            android:layout_height="50dip"
            android:background="@drawable/level1" />

                    android:id="@+id/iv_home"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:src="@drawable/icon_home" />
   

代码：

package com.itheima.youku;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.RotateAnimation;
import android.widget.ImageView;
import android.widget.RelativeLayout;

public class MenuView extends RelativeLayout implements OnClickListener {
 // 最外层
 private RelativeLayout rl_out;
 // 中间层
 private RelativeLayout rl_middle;
 // 最内层
 private RelativeLayout rl_inner;

 private ImageView iv_channel1;
 private ImageView iv_channel2;
 private ImageView iv_channel3;
 private ImageView iv_channel4;
 private ImageView iv_channel5;
 private ImageView iv_channel6;
 private ImageView iv_channel7;

 private ImageView iv_home;
 private ImageView iv_info;
 private ImageView iv_search;
 private ImageView iv_menu;

 
 private OnYouKuItemClickedListener mOnYouKuItemClickedListener;

 
 public void setOnYouKuItemClickedListener(
   OnYouKuItemClickedListener mOnYouKuItemClickedListener) {
  this.mOnYouKuItemClickedListener = mOnYouKuItemClickedListener;
 }

 
 private boolean showing = true;

 
 private boolean isOutAnimating;

 
 private boolean isInAnimating;

 // 初始化优酷菜单的布局
 public MenuView(Context context, AttributeSet attrs) {
  super(context, attrs);
  initUI(context);
 }

 // 初始化优酷菜单的布局
 public MenuView(Context context) {
  super(context);
  initUI(context);
 }

 
 private void initUI(Context context) {
  View.inflate(context, R.layout.youku_menu_view, this);
  rl_out = (RelativeLayout) findViewById(R.id.rl_out);
  rl_middle = (RelativeLayout) findViewById(R.id.rl_middle);
  rl_inner = (RelativeLayout) findViewById(R.id.rl_inner);
  
  iv_home = (ImageView) findViewById(R.id.iv_home);
  iv_info = (ImageView) findViewById(R.id.iv_info);
  iv_menu = (ImageView) findViewById(R.id.iv_menu);
  iv_search = (ImageView) findViewById(R.id.iv_search);

  
  
  int count = rl_out.getChildCount();
  for(int i = 0;i
   rl_out.getChildAt(i).setOnClickListener(this);
  }
  
  iv_home.setOnClickListener(this);
  iv_info.setOnClickListener(this);
  iv_menu.setOnClickListener(this);
  iv_search.setOnClickListener(this);

 }

 
 public void rotateOutLayer(int from, int to, int offsetTime) {
  RotateAnimation ra = new RotateAnimation(from, to,
    Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
    1.0f);
  ra.setDuration(300);
  // 设置fillafter为true 动画停留在播放完毕的最后一帧的状态
  ra.setFillAfter(true);
  // 设置动画等待多久才开始播放
  ra.setStartOffset(offsetTime);
  ra.setAnimationListener(new MyAnimationLinstener(
    MyAnimationLinstener.TYPEOUT));
  rl_out.startAnimation(ra);
 }

 
 public void rotateMiddleLayer(int from, int to, int offsetTime) {
  RotateAnimation ra = new RotateAnimation(from, to,
    Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
    1.0f);
  ra.setDuration(300);
  ra.setFillAfter(true);
  ra.setStartOffset(offsetTime);
  rl_middle.startAnimation(ra);
 }

 
 public void rotateInnerLayer(int from, int to, int offsetTime) {
  RotateAnimation ra = new RotateAnimation(from, to,
    Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
    1.0f);
  ra.setDuration(300);
  ra.setAnimationListener(new MyAnimationLinstener(
    MyAnimationLinstener.TYPEIN));
  ra.setFillAfter(true);
  ra.setStartOffset(offsetTime);
  rl_inner.startAnimation(ra);
 }

 
 public void hideMenu() {
  rotateOutLayer(0, -180, 0);
  rotateMiddleLayer(0, -180, 300);
  rotateInnerLayer(0, -180, 600);
  showing = false;
 }

 
 public void showMenu() {
  rotateInnerLayer(-180, 0, 0);
  rotateMiddleLayer(-180, 0, 300);
  rotateOutLayer(-180, 0, 600);
  showing = true;
 }

 
 public void switchHideAndShow() {
  // 判断当前显示的状态
  if (showing) {
   if (isOutAnimating) {
    return;
   }
   hideMenu();
   // 出去的监听
  } else {
   if (isInAnimating) {
    return;
   }
   showMenu();
   // 进来的监听
  }
 }

 private class MyAnimationLinstener implements AnimationListener {
  public int TYPE;
  
  public static final int TYPEIN = 1;
  
  public static final int TYPEOUT = 2;

  

  @Override
  public void onAnimationStart(Animation animation) {
   if (TYPE == TYPEIN) {
    isInAnimating = true;
   } else if (TYPE == TYPEOUT) {
    isOutAnimating = true;
   }
  }

  public MyAnimationLinstener(int tYPE) {
   TYPE = tYPE;
  }

  
  @Override
  public void onAnimationEnd(Animation animation) {
   if (TYPE == TYPEIN) {
    isInAnimating = false;
   } else if (TYPE == TYPEOUT) {
    isOutAnimating = false;
   }
  }

  @Override
  public void onAnimationRepeat(Animation animation) {

  }
 }

 @Override
 public void onClick(View v) {
  if (mOnYouKuItemClickedListener != null) {
   mOnYouKuItemClickedListener.onItemClicked(v.getId());
  }
 }

 
 public interface OnYouKuItemClickedListener {
  public void onItemClicked(int viewid);
 }

}