自定义View的第一个学习案例
ViewGroup是自动以View中比较常用也比较简单的一种方式，通过组合现有的UI控件，绘制出一个全新的View
效果如下：
主类实现如下：
package com.demo.youku; import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.KeyEvent;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.Toast; public class MainActivity extends AppCompatActivity {
/**
* False: hide
* 是否显示圆环 默认显示
* true:显示
* false:隐藏
*/
private Boolean showLevel1 = true;
private Boolean showLevel2 = true;
private Boolean showLevel3 = true;
private ImageView iconHome;
private ImageView iconMenu;
private RelativeLayout level1;//第一层
private RelativeLayout level2;//第二层
private RelativeLayout level3;//第三层
private Toolbar toolbar; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); toolbar = (Toolbar) findViewById(R.id.toolbar); toolbar.setTitle("优酷菜单");
//设置导航图标要在setSupportActionBar方法之后
setSupportActionBar(toolbar);
toolbar.setNavigationIcon(R.mipmap.icon_menu); iconHome = (ImageView) findViewById(R.id.home);
iconMenu = (ImageView) findViewById(R.id.icon_menu);
level1 = (RelativeLayout) findViewById(R.id.level1);
level2 = (RelativeLayout) findViewById(R.id.level2);
level3 = (RelativeLayout) findViewById(R.id.level3); MyOnclickListener myOnclickListener = new MyOnclickListener(); iconHome.setOnClickListener(myOnclickListener);
iconMenu.setOnClickListener(myOnclickListener);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//如果一级二级三级菜单显示 则关闭
if (showLevel1 || showLevel2 || showLevel3) {
showLevel1 = false;
showLevel2 = false;
if (showLevel3) {
showLevel3 = false;
Tools.hideView(level3);
Tools.hideView(level2, 400);
Tools.hideView(level1, 800);
} else {
Tools.hideView(level2);
Tools.hideView(level1, 300);
}
} else {
//如果都未显示 则显示一级二级菜单
showLevel1 = true;
showLevel2 = true; Tools.showView(level1);
Tools.showView(level2);
}
}
}); } class MyOnclickListener implements View.OnClickListener { @Override
public void onClick(View view) {
//
switch (view.getId()) {
case R.id.home:
if (showLevel2) {
showLevel2 = false;
Tools.hideView(level2);
if (showLevel3) {
showLevel3 = false;
Tools.hideView(level3, 400);
}
} else {
showLevel2 = true;
Tools.showView(level2);
}
break;
case R.id.icon_menu:
if (showLevel3) {
showLevel3 = false;
Tools.hideView(level3); } else {
showLevel3 = true;
Tools.showView(level3);
}
break; }
}
} }
Tools类主要用于控制View的显示和隐藏动画，提供了属性动画，不补间动画两种实现方式
package com.demo.youku; import android.animation.ObjectAnimator;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.RotateAnimation;
import android.widget.RelativeLayout; public class Tools { /**
* 顺时针旋转0-180度隐藏view
*
* @param view
*/
public static void hideView(ViewGroup view) {
hideView(view, 0);
} /**
* 顺时针旋转180-360度显示view
*
* @param view
*/
public static void showView(ViewGroup view) {
/* RotateAnimation ra = new RotateAnimation(180, 360, view.getWidth() / 2, view.getHeight());
ra.setDuration(500);
ra.setFillAfter(true);
view.startAnimation(ra); //启动ViewGroup中所有子元素的点击事件
for (int i = 0; i < view.getChildCount(); i++) {
View childView = view.getChildAt(i);
childView.setEnabled(true);
}*/ ObjectAnimator animator = ObjectAnimator.ofFloat(view, "Rotation", 180, 360);
animator.setDuration(500);
animator.start(); view.setPivotX(view.getWidth() / 2);
view.setPivotX(view.getHeight());
} /**
* 延迟旋转
*
* @param view 需要旋转的view
* @param setTimeOut 动画延迟时间
*/
public static void hideView(ViewGroup view, int setTimeOut) {
/*RotateAnimation ra = new RotateAnimation(0, 180, view.getWidth() / 2, view.getHeight());
ra.setDuration(500);//动画时间
ra.setFillAfter(true);//是否保留动画结束状态
ra.setStartOffset(setTimeOut);//设置延迟时间
view.startAnimation(ra); //禁用ViewGroup中错有元素的点击事件
for (int i = 0; i < view.getChildCount(); i++) {
View childView = view.getChildAt(i);
childView.setEnabled(false);
}*/
<?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.demo.youku.MainActivity"> <android.support.v7.widget.Toolbar
android:background="?attr/colorPrimary"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"> </android.support.v7.widget.Toolbar> <RelativeLayout
android:id="@+id/level3"
android:layout_width="280dp"
android:layout_height="140dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@mipmap/level3"> <ImageView
android:id="@+id/chanel1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:background="@mipmap/channel1" /> <ImageView
android:id="@+id/chanel2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/chanel1"
android:layout_marginBottom="8dp"
android:layout_marginLeft="30dp"
android:background="@mipmap/channel2" /> <ImageView
android:id="@+id/chanel3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/chanel2"
android:layout_marginBottom="8dp"
android:layout_marginLeft="60dp"
android:background="@mipmap/channel3" /> <ImageView
android:id="@+id/chanel4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:background="@mipmap/channel4" /> <ImageView
android:id="@+id/chanel5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
android:background="@mipmap/channel5" /> <ImageView
android:id="@+id/chanel6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/chanel5"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginRight="30dp"
android:background="@mipmap/channel6" /> <ImageView
android:id="@+id/chanel7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/chanel6"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginRight="60dp"
android:background="@mipmap/channel7" /> </RelativeLayout> <RelativeLayout
android:id="@+id/level2"
android:layout_width="180dp"
android:layout_height="90dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@mipmap/level2"> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:background="@mipmap/icon_search" /> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
android:background="@mipmap/icon_myyouku" /> <ImageView
android:id="@+id/icon_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="4dp"
android:background="@mipmap/icon_menu" />
</RelativeLayout> <RelativeLayout
android:id="@+id/level1"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@mipmap/level1"> <ImageView
android:id="@+id/home"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@mipmap/icon_home" /> </RelativeLayout> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="ViewGrou之优酷菜单"
android:textSize="24sp" /> </RelativeLayout>
animator.setStartDelay(setTimeOut);
animator.start();
view.setPivotX(view.getWidth() / 2);
view.setPivotY(view.getHeight());
}
}
页面布局如下，布局中使用Toolbar代替ActionBar:主要需要更换默认主题：Theme.AppCompat.Light.NoActionBar