Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android系統教程 >> Android開發教程 >> Android屬性動畫之實現靈動菜單效果

Android屬性動畫之實現靈動菜單效果

編輯:Android開發教程

前段時間,我學習了自定義View,基本能夠繪制一些比較好看的控件,那麼今天開始,我將會學習屬性動畫。前面我也簡單的看過屬性動畫的概念,然後也是看了一下效果,了解了一些基本概念,比如Animator、ObjectAnimator、插值器等等。為此我還特意寫了博客Android技術進階的要素——Android屬性動畫,但是沒有一個項目去鞏固,也一直耿耿於懷,今天終於可以開始寫這方面的程序了,好了,講了這麼多的廢話,下面開始看看今天的內容,我是通過demo來了解屬性動畫的。先看你效果:

這個就是展開後的效果了,由於不是動態圖,所以看不到全部效果,我簡單的描述一下,當點擊中間的“”+“的時候,會從“+”處靈動的彈出三個按鈕,這三個按鈕的出現過程中,也帶有動畫效果,同樣的,關閉也是如此,同樣的,這三個按鈕也同樣的注冊了點擊事件。

接下來,我們開始編碼,因為這個菜單是以一個整體的形式展現出來的,所以,我這裡是把這個控件當成一個ViewGroup來實現,

新建一個類,名字叫MMenu,繼承自RelativeLayout,並且實現了點擊事件的接口,下面看看我們這一次所用到的變量:

     ImageView center,home,call,hyperlink;

     List<ImageView> oViews;

      mFlag=;

      mHiddenViewMeasuredHeight;

不多,首先是有四個圖片控件、然後是一個list集合,用於裝載Imageview,下面的一個標志,是用來區分打開或者關閉菜單欄,再一個就是動畫的位移長度。

下面開始初始化操作:

    private void initView(Context context) {

        LayoutInflater(context)(R_layout, this)
        center=(ImageView) findViewById(R)
        =(ImageView) findViewById(R)
        home=(ImageView) findViewById(R)
        hyperlink=(ImageView) findViewById(R)

        //將四個Imageview放在集合裡,方便管理
        oViews=new ArrayList<ImageView>()
        oViews(center)
        oViews()
        oViews(home)
        oViews(hyperlink)

        center(this)
        (this)
        home(this)
        hyperlink(this)
    }

這裡加載了布局文件、然後引入了控件、設置了點擊事件等等。接下來在onSizeChanged方法裡面給位移的大小賦值,代碼如下:

    
      ( w,  h,  oldw,  oldh) {
        .onSizeChanged(w, h, oldw, oldh);
        mHiddenViewMeasuredHeight = () (w*/);
        Anim(mHiddenViewMeasuredHeight,-mHiddenViewMeasuredHeight ,f, f, f, f);

    }

這裡我們一開始設置對菜單進行關閉。下面開始主要代碼,對控件的動畫效果進行一個操作,代碼如下:

      ( mHiddenViewMeasuredHeightBegin, mHiddenViewMeasuredHeightyClose, x, y, anglex, angley){

        
        ObjectAnimator animator0=ObjectAnimator.ofFloat(oViews.(), , x,y);

        ObjectAnimator animator1=ObjectAnimator.ofFloat(oViews.(), ,mHiddenViewMeasuredHeightBegin);

        ObjectAnimator animator2=ObjectAnimator.ofFloat(oViews.(), ,mHiddenViewMeasuredHeightBegin);

        ObjectAnimator animator3=ObjectAnimator.ofFloat(oViews.(), ,mHiddenViewMeasuredHeightyClose);



        
        ObjectAnimator animator4=ObjectAnimator.ofFloat(oViews.(), , anglex,f,angley);

        ObjectAnimator animator5=ObjectAnimator.ofFloat(oViews.(), , anglex,f,angley);

        ObjectAnimator animator6=ObjectAnimator.ofFloat(oViews.(), , anglex,f,angley);

        ObjectAnimator animator7=ObjectAnimator.ofFloat(oViews.(), , anglex,f,angley);

        AnimatorSet  =  AnimatorSet();
        .setDuration();
        .setInterpolator( OvershootInterpolator());
        .playTogether(animator0,animator1,animator2,animator3,animator4,animator5,animator6,animator7);
        .start();


    }

注釋也是比較詳細,這裡定義個多個控件屬性,並且還用到了集合容器,整個的動畫效果就是在這裡實現的,對於新手而言,這裡面的效果很微妙,所以要自己多運行細細體會。

然後就是對面暴露一個點擊事件,用於事件的回調,

    
      ( onMenuClickListener listener){
        .listener=listener;
    }

這是這個控件的主要代碼,接下來我附上所有的代碼:

布局文件:

menu_layout.xml
主頁面的布局文件,:
接下來是主界面代碼,Main

/**

* 小瓶蓋 2016年7月14日16:30:36

*

* @author Android屬性動畫——實現靈動菜單效果

*

*相關博客地址 http://blog.csdn.net/qq_25193681

*/

public class Main extends Activity {

private MMenu menu;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);



    menu=(MMenu) findViewById(R.id.MMenu);
    menu.setonMenuClickListener(new onMenuClickListener() {
        @Override
        public void hyperlink() {
            Toast.makeText(Main.this, "點擊了hyperlink", 0).show();
        }
        @Override
        public void Home() {
            Toast.makeText(Main.this, "點擊了home", 0).show();
        }
        @Override
        public void Call() {
            Toast.makeText(Main.this, "點擊了Call", 0).show();
        }
    });
}

}

MMenu

/**

* 小瓶蓋 2016年7月14日16:30:36

*

* @author Android屬性動畫——實現靈動菜單效果

*

*相關博客地址 http://blog.csdn.net/qq_25193681

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved