十年專注于品牌網站建設 十余年專注于網站建設_小程序開發_APP開發,低調、敢創新、有情懷!
      南昌百恒網絡微信公眾號 掃一掃關注
      小程序
      tel-icon全國服務熱線:400-680-9298,0791-88117053
      掃一掃關注百恒網絡微信公眾號
      掃一掃打開百恒網絡微信小程序

      百恒網絡

      南昌百恒網絡

      如何創建circular reveal動畫特效?

      百恒網絡 2017-08-17 6047

      南昌APP開發中,同行朋友都知道,material design引入了很多漂亮的動畫特效。實現時,有些很容易,有些比較困難,需要花點力氣。不過,如果能善用Android提供的便利工具,事情就好辦得多。

      就拿circular reveal動畫來說,circular reveal動畫看起來就像墨滴在一張紙上向外快速擴散。從一個交互點出發(通常是用戶的按壓點),視圖或是一段文字向外擴散式顯現。模擬效果如圖1所示。

      circular reveal動畫特效演示

      圖1 circular reveal動畫特效演示

      那么如何創建circular reveal動畫特效呢?其實也不難,要創建circular reveal動畫特效,可調用ViewAnimationUtils的createCircularReveal(...) 方法。該方法有5個參數:

      static Animator createCircularReveal(View view, int centerX, int centerY,float startRadius, float endRadius)

      第一個View參數就是要向外擴散顯現的視圖。在圖1中,這個視圖就是和 BeatBoxFragment寬高一致的紅色實心視圖。如果動畫從startRadius(值為0)圓點開始到 endRadius結束,這個紅點視圖會先變為透明狀態,并隨著一個不斷放大的圓慢慢顯現。centerX 和centerY是這個圓的圓點坐標(也就是View的坐標)。該方法會返回一個Animator。

      此外,南昌APP制作開發公司-百恒網絡認為,circular reveal動畫應該開始于用戶手指在屏幕上的觸點。所以,首先要找到用戶點擊視圖的坐標,具體操作看如下代碼。

      找到點擊視圖坐標

      @Override

      public void onClick(View clickSource) {

      int[] clickCoords = new int[2];

      // Find the location of clickSource on the screen

      clickSource.getLocationOnScreen(clickCoords);

      // Tweak that location so that it points at the center of the view,

      // not the corner

      clickCoords[0] += clickSource.getWidth() / 2;

      clickCoords[1] += clickSource.getHeight() / 2;

      performRevealAnimation(mViewToReveal, clickCoords[0], clickCoords[1]);

      }

      然后開始執行circular reveal動畫,如下代碼所示。

      執行circular reveal動畫

      private void performRevealAnimation(View view, int screenCenterX, int screenCenterY) {

      // Find the center relative to the view that will be animated

      int[] animatingViewCoords = new int[2];

      view.getLocationOnScreen(animatingViewCoords);

      int centerX = screenCenterX - animatingViewCoords[0];

      int centerY = screenCenterY - animatingViewCoords[1];

      // Find the maximum radius

      Point size = new Point();

      getActivity().getWindowManager().getDefaultDisplay().getSize(size);

      int maxRadius = size.y;

      if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {

      ViewAnimationUtils.createCircularReveal(view, centerX, centerY, 0, maxRadius)

      .start();

      }

      }

      注意,成功調用createCircularReveal(...)方法的前提條件是,布局中已有目標視圖。

      以上便是本公司為大家介紹的關于在南昌APP開發中創建circular reveal動畫特效的方法,這種特效的實現比較簡單,大家也應該比較好理解,如果大家還有哪些不明白的地方,可隨時來電和我們聯系,百恒專業為您講解。此外,若有需要開發APP的朋友,百恒網絡期待與您的合作,我們將隨時為您效勞!

      400-680-9298,0791-88117053
      掃一掃關注百恒網絡微信公眾號
      掃一掃打開百恒網絡小程序

      歡迎您的光顧,我們將竭誠為您服務×

      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售前咨詢 售前咨詢
       
      售后服務 售后服務
       
      售后服務 售后服務
       
      備案專線 備案專線
       
      ×
      国产伦精品一区二区三区视频金莲| 精品久久亚洲一级α| 亚洲精品国偷自产在线| 永久无码精品三区在线4| 免费观看四虎精品国产永久| 尤物国午夜精品福利网站| 精品午夜国产福利观看| 亚洲精品在线播放| 日产精品久久久久久久| 免费精品99久久国产综合精品| 国产亚洲精品影视在线产品| 国产精品 综合 第五页| 成人午夜精品视频在线观看| 日韩精品一线二线三线优势| 日韩经典午夜福利发布| 中文字幕日韩精品有码视频| 国产精品R级最新在线观看| 国产精品十八禁在线观看| 国产精品视频视频久久| 99久久免费精品国产72精品九九 | 91麻豆精品在线观看| 无码精品国产VA在线观看| 久久99热成人精品国产| 久久66久这里精品99| 日韩欧精品无码视频无删节| 久久丫精品久久丫| 久久99国产这里有精品视| 人妻精品久久久久中文字幕69 | 久久国产精品亚洲一区二区| 久热re这里只有精品视频 | 国产啪精品视频网站丝袜| 国产精品va无码二区| 午夜精品久久久久蜜桃| 日韩视频在线观看一区二区| 日韩免费码中文在线观看| 精品国产日韩亚洲一区| 手机看片福利日韩国产| 日韩精品专区AV无码| 尤物TV国产精品看片在线| 国产精品无打码在线播放| 久久99精品久久久久久齐齐|