Android自定义控件总结（一）

     背景：

android原生的各种控件不能完全满足我们的开发的需求，这个时候就需要我们自己来定义开发控件，这样就可以开发出各式各样的控件。

 自定义控件可以分为三大类型：

1. 组合已有的控件实现
2. 完全自定义控件（继承View或ViewGroup)
3. 集成已有的控件实现(扩展已有的功能)

（一）组合已有的控件实现自定义的控件

         效果图

首先这就是组合已有的控件来实现的，三个RelativeLayout的叠加就可以实现这种的效果，在放上不同的点击的图片接下来看代码

布局文件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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
>

    <RelativeLayout
        android:id="@+id/rl_leve1"
        android:layout_width="100dp"
        android:layout_height="50dp"
        android:background="@mipmap/level1"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        >
        <ImageButton
            android:id="@+id/main_home_bt"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_home"
            android:background="@android:color/transparent"
            android:layout_centerInParent="true"
            />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/rl_leve2"
        android:layout_width="180dp"
        android:layout_height="90dp"
        android:background="@mipmap/level2"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        >
        <ImageButton
            android:id="@+id/main_muti_bt"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_menu"
            android:background="@android:color/transparent"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="5dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_search"
            android:background="@android:color/transparent"
            android:layout_alignParentLeft="true"
            android:layout_marginTop="50dp"
            android:layout_marginLeft="10dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/icon_myyouku"
            android:background="@android:color/transparent"
            android:layout_alignParentRight="true"
            android:layout_marginTop="50dp"
            android:layout_marginRight="10dp"
            />


    </RelativeLayout>


    <RelativeLayout
        android:id="@+id/rl_leve3"
        android:layout_width="280dp"
        android:layout_height="140dp"
        android:background="@mipmap/level3"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        >

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel1"
            android:background="@android:color/transparent"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="10dp"
            android:layout_alignParentBottom="true"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel2"
            android:background="@android:color/transparent"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="30dp"
            android:layout_marginTop="65dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel3"
            android:background="@android:color/transparent"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="65dp"
            android:layout_marginTop="25dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel4"
            android:background="@android:color/transparent"
            android:layout_marginTop="10dp"
            android:layout_centerHorizontal="true"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel7"
            android:background="@android:color/transparent"
            android:layout_alignParentRight="true"
            android:layout_marginRight="10dp"
            android:layout_alignParentBottom="true"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel6"
            android:background="@android:color/transparent"
            android:layout_alignParentRight="true"
            android:layout_marginRight="30dp"
            android:layout_marginTop="65dp"
            />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/channel5"
            android:background="@android:color/transparent"
            android:layout_alignParentRight="true"
            android:layout_marginRight="65dp"
            android:layout_marginTop="25dp"
            />
    </RelativeLayout>


</RelativeLayout>

com.example.lql.heloas.MainActivity

package com.example.lql.heloas;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageButton;
import android.widget.RelativeLayout;

import com.example.lql.utils.AniMationUtils;

public class MainActivity extends AppCompatActivity {

    private ImageButton btHome;
    private ImageButton btMutiplay;
    private boolean ISDISPLAYLEVE3 = true;//三级菜单是否显示的标志
    private boolean ISDISPLAYLEVE2 = true;//二级菜单是否显示的标志
    private boolean ISDISPLAYLEVE1 = true;//一级菜单是否显示
    private RelativeLayout rlLeve1;
    private RelativeLayout rlLeve2;
    private RelativeLayout rlLeve3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        initView();
        initEvent();
    }

    private void initEvent() {

        View.OnClickListener listener = new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                  switch (view.getId())
                  {
                    case R.id.main_home_bt:
                        //二级标签是否显示
                        long time = 0;
                         if(ISDISPLAYLEVE2){

                             if(ISDISPLAYLEVE3){

                                 AniMationUtils.RoateOut(rlLeve3,0);
                                 time = 50;
                                 ISDISPLAYLEVE3 = false;
                             }
                             AniMationUtils.RoateOut(rlLeve2,time);
                         }else{

                             AniMationUtils.RoateIn(rlLeve2);
                         }
                        ISDISPLAYLEVE2 = !ISDISPLAYLEVE2;
                        break;
                      case R.id.main_muti_bt:
                         //三级标签是否显示
                        //显示就让他转下去
                        if(ISDISPLAYLEVE3){
                           AniMationUtils.RoateOut(rlLeve3,0);
                        }else{
                            AniMationUtils.RoateIn(rlLeve3);
                        }
                        ISDISPLAYLEVE3 = !ISDISPLAYLEVE3;
                        break;


                  }
            }
        };
        btMutiplay.setOnClickListener(listener);
        btHome.setOnClickListener(listener);
    }

    private void initView() {

        setContentView(R.layout.activity_main);
        btHome = (ImageButton) findViewById(R.id.main_home_bt);
        btMutiplay = (ImageButton) findViewById(R.id.main_muti_bt);
        rlLeve1 = (RelativeLayout) findViewById(R.id.rl_leve1);
        rlLeve2 = (RelativeLayout) findViewById(R.id.rl_leve2);
        rlLeve3 = (RelativeLayout) findViewById(R.id.rl_leve3);

    }
}

com.example.lql.utils.AniMationUtils

package com.example.lql.utils;

import android.view.animation.Animation;
import android.view.animation.RotateAnimation;
import android.widget.RelativeLayout;

/**
 * Created by Administrator on 2017/3/6.
 */
public class AniMationUtils {



    public static void RoateOut(RelativeLayout rl,long time) {
            int count = rl.getChildCount();
        for(int i=0;i<count;i++){//补间动画虽然 看不见了但是他还是在原来的位置，这个把旋转下去的Relatice
          rl.getChildAt(i).setEnabled(false);

        }
        RotateAnimation rotate = new RotateAnimation(0f,-180f, Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,1f);
        rotate.setDuration(500);
        rotate.setFillAfter(true);
        rl.startAnimation(rotate);
        rotate.setStartOffset(time);
    }

    public static void RoateIn(RelativeLayout rl) {

        int count = rl.getChildCount();
        for(int i=0;i<count;i++){
            rl.getChildAt(i).setEnabled(true);
//补间动画虽然 看不见了但是他还是在原来的位置，这个把旋转下去的RelativeLayout上的孩子的点击效果恢复
 } RotateAnimation rotate = new RotateAnimation(-180f,0f, Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,1f); rotate.setDuration(500); rotate.setFillAfter(true); rl.startAnimation(rotate); }}