Android 自定义view之扇形菜单（上）

最近模仿猎豹清理大师中的快切功能，一个扇形菜单，分三个菜单，可以滑动切换，每个菜单可以长按编辑，添加，删除，排序等，同时工具菜单中有系统的各种功能开关设置，话不多说，先看效果：

就是这样，猎豹的提供了各种皮肤，比较炫酷，这里我们就先实现一个简单版本的，因为整个项目内容还是比较多的，所以分三个部分来讲述，第一个部分先介绍布局，绘制，第二部分介绍点击，滑动切换，长按编辑，拖动排序等，最后一部分介绍添加删除，工具菜单实现，添加打开关闭动画等细节补充。（由于项目代码比较多，都贴出来会很长，所以我们在文章中只贴核心代码部分，后面我会把整个项目的下载地址发出来，有需要的可以直接下载源码查看）。

首先我们看到这样的需求，先考虑如何实现，很明显这次的需求包含了自定义view，touch事件分发，手势判断，属性动画，以及基本的数学圆弧角度和坐标计算等等，对自定义view比较了解的应该还是比较简单的，那我们就来分层次分模块来实现，步步击破最终完成需求。

一、布局

首先从布局开始，因为自定义复杂view的时候，我们一般是要分多模块，多层次，一个view不要搞太多功能，这样能尽可能简化逻辑，降低难度，如果全部写在一个view中，太过复杂容易出问题，而且不好查找和修改，所以我们就来写布局，从布局上划分区域和模块，这里我们可以从圆的中心开始，分为center中心点，selecttext三个tab，menu内容这三个部分，当然最底层我们需要一个background层，同时也方便后面添加皮肤，四大模块分好了，再考虑每一个模块的实现细节，其中center里面就只有一个x我们可以直接把cener作为一个view，selecttext里面有三个textview，同时有一个选中的indicator，menu是有三个扇形区域，每个里面的布局是一样的，然后按照旋转角度设置就可以了，背景暂时就一个半透明，ok了解到这里我们就分解完毕，现在就开始上代码，先新建layout，我们就叫fan_menu_root_layout.xml内容如下：

<?xml version="1.0" encoding="utf-8"?>
<com.jeden.fanmenu.view.FanRootView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:fanmenu="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/fan_menu_common_transparent_color">
    <com.jeden.fanmenu.view.FanBackgroundView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/fanmenu_background_view_id"
        android:background="@color/fan_menu_background_color"/>
    <com.jeden.fanmenu.view.FanMenuView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center|right"
        android:id="@+id/fanmenu_menu_view_id"
        android:background="@color/fan_menu_common_transparent_color">
        <com.jeden.fanmenu.view.FanMenuLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            fanmenu:menuType="1"
            fanmenu:longClickable="true"
            android:id="@+id/fanmenu_menu_layout_id_favorite"
            android:background="@color/fan_menu_common_transparent_color">

        </com.jeden.fanmenu.view.FanMenuLayout>
        <com.jeden.fanmenu.view.FanMenuLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            fanmenu:menuType="2"
            fanmenu:longClickable="true"
            android:id="@+id/fanmenu_menu_layout_id_toolbox"
            android:background="@color/fan_menu_common_transparent_color">

        </com.jeden.fanmenu.view.FanMenuLayout>
        <com.jeden.fanmenu.view.FanMenuLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:id="@+id/fanmenu_menu_layout_id_recently"
            fanmenu:menuType="3"
            fanmenu:longClickable="false"
            android:background="@color/fan_menu_common_transparent_color">

        </com.jeden.fanmenu.view.FanMenuLayout>
    </com.jeden.fanmenu.view.FanMenuView>
    <com.jeden.fanmenu.view.FanSelectTextLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="bottom|center|right"
        android:id="@+id/fanmenu_select_text_layout_id"
        android:background="@color/fan_menu_common_transparent_color">
        <com.jeden.fanmenu.view.FanSelectTextIndicator
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="@color/fan_menu_common_transparent_color"
            android:id="@+id/fanmenu_select_text_indicator_id"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/fanmenu_select_text_view_favorite"
            android:textSize="@dimen/fan_menu_select_text_size"
            android:textColor="@color/fan_menu_common_white_color"
            android:maxWidth="@dimen/fan_menu_select_text_max_width"
            android:text="@string/fan_menu_select_text_favorite"
            android:maxLines="1" />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/fanmenu_select_text_view_toolbox"
            android:textSize="@dimen/fan_menu_select_text_size"
            android:textColor="@color/fan_menu_common_white_color"
            android:maxWidth="@dimen/fan_menu_select_text_max_width"
            android:text="@string/fan_menu_select_text_toolbox"
            android:maxLines="1" />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/fanmenu_select_text_view_recently"
            android:textSize="@dimen/fan_menu_select_text_size"