最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

安卓(Android)實(shí)現(xiàn)3DTouch效果

 更新時(shí)間:2016年08月15日 15:09:06   投稿:daisy  
3DTouch是什么效果的大家應(yīng)該都知道了。本文將介紹在Android中如何實(shí)現(xiàn)3DTouch的效果,有需要的可以參考學(xué)習(xí)。

本篇博客要做的效果圖:

來(lái)個(gè)低質(zhì)量動(dòng)圖:

這個(gè)動(dòng)圖效果不是很好,實(shí)際上模糊效果應(yīng)該是像上面第一張圖那樣的,后面會(huì)放出代碼,有興趣的可以試著運(yùn)行一下看看效果。 

先說(shuō)一下思路,我們要實(shí)現(xiàn)這個(gè)效果其實(shí)只需要掌握幾個(gè)東西:

      1、屏幕截圖

      2、模糊高斯模糊)

      3、添加視圖

      4、彈出動(dòng)畫(huà)

      5、處理長(zhǎng)按事件

      6、優(yōu)化(模糊速度和強(qiáng)度)

流程:當(dāng)用戶長(zhǎng)按一個(gè)Item的時(shí)候,我們先截取一張當(dāng)前屏幕的圖片,接著將這張圖片進(jìn)行壓縮后再進(jìn)行高斯模糊,再覆蓋在整個(gè)布局上面(包括覆蓋Toolbar),這樣界面模糊的效果就出來(lái)了。接著我們動(dòng)態(tài)的向界面添加一個(gè)CardView來(lái)呈現(xiàn)我們的Item布局,這個(gè)CardView要出現(xiàn)在我們點(diǎn)擊的對(duì)應(yīng)的Item上。最后添加一個(gè)對(duì)應(yīng)3D Touch彈出的動(dòng)畫(huà)即可。 

接下來(lái)我們一步一步的完成整個(gè)流程:

① 屏幕截圖

這一部分相對(duì)比較簡(jiǎn)單,因?yàn)槲覀円玫疆?dāng)前屏幕顯示內(nèi)容的Bitmap是有現(xiàn)成方法的,代碼如下:

  private Bitmap getScreenImage() { // 截取一張屏幕的圖片
    View view = root;
    view.setBackgroundColor(Color.WHITE);
    view.setDrawingCacheEnabled(true);
    view.buildDrawingCache();
    Bitmap bitmap = Bitmap.createBitmap(view.getDrawingCache(), 0, 0, view.getWidth(), view
        .getHeight());
    view.destroyDrawingCache();
    return bitmap;
  }

先說(shuō)一下布局,這里的布局文件如下所示:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/activity_main"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context="com.fndroid.threedtouchdemo.MainActivity">

  <LinearLayout
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:background="@color/colorPrimary"
      app:title="@string/app_name"
      app:titleTextColor="#fff"/>

    <ListView
      android:id="@+id/lv"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      tools:listitem="@layout/item"/>
  </LinearLayout>

  <ImageView
    android:id="@+id/cover"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

  <android.support.v7.widget.CardView
    android:id="@+id/cv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:translationZ="5dp"
    app:cardCornerRadius="10dp"/>

</FrameLayout>

可以看到我們最外層用了一個(gè)FrameLayout,原因是我們需要往整個(gè)布局中覆蓋一個(gè)高斯模糊了的截圖,可以看到最下面的ImageView就是用來(lái)做模糊效果的,最開(kāi)始我們只需要給它的ImageAlpha設(shè)置為0讓其透明即可。最下面的CardView則是彈出的控件,這個(gè)等下再說(shuō)。我們截圖的rootFrameLayout下的LinearLayout,因?yàn)槲覀冃枰?code>ToolBar也模糊化。 

② 高斯模糊

這個(gè)在我的上一篇博客--動(dòng)態(tài)高斯模糊怎么做中已經(jīng)說(shuō)過(guò)了,可以進(jìn)行參考,這個(gè)給出對(duì)應(yīng)的代碼:

  private Bitmap blur(Bitmap bitmap, float radius) {
    Bitmap output = Bitmap.createBitmap(bitmap); // 創(chuàng)建輸出圖片
    RenderScript rs = RenderScript.create(this); // 構(gòu)建一個(gè)RenderScript對(duì)象
    ScriptIntrinsicBlur gaussianBlue = ScriptIntrinsicBlur.create(rs, Element.U8_4(rs)); //
    // 創(chuàng)建高斯模糊腳本
    Allocation allIn = Allocation.createFromBitmap(rs, bitmap); // 開(kāi)辟輸入內(nèi)存
    Allocation allOut = Allocation.createFromBitmap(rs, output); // 開(kāi)辟輸出內(nèi)存
    gaussianBlue.setRadius(radius); // 設(shè)置模糊半徑,范圍0f<radius<=25f
    gaussianBlue.setInput(allIn); // 設(shè)置輸入內(nèi)存
    gaussianBlue.forEach(allOut); // 模糊編碼,并將內(nèi)存填入輸出內(nèi)存
    allOut.copyTo(output); // 將輸出內(nèi)存編碼為Bitmap,圖片大小必須注意
    rs.destroy(); // 關(guān)閉RenderScript對(duì)象,API>=23則使用rs.releaseAllContexts()
    return output;
  }

配置對(duì)應(yīng)Module的build.gradle文件:

  defaultConfig {
    ...
    renderscriptTargetApi 18
    renderscriptSupportModeEnabled true
  }

 ③ 彈出視圖

這個(gè)視圖我們需要將ItemView添加到CardView中,并且讓CardView的位置在對(duì)應(yīng)Item位置之上。

  // 顯示對(duì)應(yīng)的卡片
  private void showView(int position, View view){
    newView = LayoutInflater.from(this).inflate(R.layout.item, null); // 加載Itme的布局
    TextView tv = (TextView) newView.findViewById(R.id.item_tv); // 獲取對(duì)應(yīng)控件
    tv.setText(data.get(position).get("name")); // 將Item對(duì)應(yīng)控件的值設(shè)置回去
    newView.setBackgroundColor(Color.WHITE);
    // 設(shè)置卡片的樣式,位置通過(guò)margintop來(lái)計(jì)算
    FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(view.getWidth() - 30, view.getHeight());
    params.topMargin = (int) (view.getY() + mToolbar.getHeight()); // 卡片的marginTop設(shè)置為item的Y加上toolbar的高度
    params.leftMargin = 15;
    params.rightMargin = 15;
    mCardView.setVisibility(View.VISIBLE);
    mCardView.setLayoutParams(params);
    mCardView.addView(newView, view.getLayoutParams()); // 把View加載進(jìn)CardView,并設(shè)置樣式為item樣式
    startAnimate(mCardView); // 播放動(dòng)畫(huà)
  }

這里不能直接把itemview加載進(jìn)CardView中,因?yàn)?code>item的View已經(jīng)有父布局了,會(huì)拋異常。解決辦法是重新根據(jù)布局映射一個(gè),然后填充數(shù)據(jù)進(jìn)去。接著設(shè)定卡片的位置信息和大小信息,因?yàn)槲覀円尶ㄆ@示在對(duì)應(yīng)Item上面。 

④ 彈出動(dòng)畫(huà)

這是比較簡(jiǎn)單的部分了,我們直接使用PropertyValuesHolder來(lái)做一個(gè)彈出和收縮的動(dòng),因?yàn)槲覀冃枰瑫r(shí)縮放X和Y,當(dāng)然也可以用其他方法,代碼如下:

  private void startAnimate(CardView cardView) {
    PropertyValuesHolder pyhScaleX = PropertyValuesHolder.ofFloat("scaleX", 0.1f, 1.05f);
    PropertyValuesHolder pyhScaleY = PropertyValuesHolder.ofFloat("scaleY", 0.1f, 1.05f);
    ObjectAnimator animator_out = ObjectAnimator.ofPropertyValuesHolder(mCardView, pyhScaleX,
        pyhScaleY); // 同時(shí)縮放X和Y
    animator_out.setInterpolator(new AccelerateDecelerateInterpolator());
    animator_out.setDuration(350);
    PropertyValuesHolder pyhScaleX2 = PropertyValuesHolder.ofFloat("scaleX", 1.05f, 1f);
    PropertyValuesHolder pyhScaleY2 = PropertyValuesHolder.ofFloat("scaleY", 1.05f, 1f);
    ObjectAnimator animator_in = ObjectAnimator.ofPropertyValuesHolder(mCardView, pyhScaleX2,
        pyhScaleY2);
    animator_in.setInterpolator(new AccelerateDecelerateInterpolator());
    animator_in.setDuration(100);

    AnimatorSet animatorSet = new AnimatorSet();
    animatorSet.playSequentially(animator_out, animator_in); // 按順序執(zhí)行兩個(gè)動(dòng)畫(huà)
    animatorSet.start();
  }

⑤ 監(jiān)聽(tīng)長(zhǎng)按事件

因?yàn)檫@里只是使用了ListView來(lái)簡(jiǎn)化這個(gè)內(nèi)容,可以直接通過(guò)已有監(jiān)聽(tīng)器來(lái)實(shí)現(xiàn):

@Override
  public boolean onItemLongClick(AdapterView<?> parent, View view, int position, long id) {
    mCover.setImageBitmap(blur(blur(getScreenImage(), 25f),25f)); // 對(duì)截取的圖片兩次高斯模糊
    mCover.setVisibility(View.VISIBLE);
    mCover.setImageAlpha(0);
    new Thread(new Runnable() {
      int progress = 50;

      @Override
      public void run() {
        while (progress < 255) {
          try {
            Thread.sleep(1);
          } catch (InterruptedException e) {
            e.printStackTrace();
          }
          Message msg = new Message();
          msg.obj = progress++;
          mHandler.sendMessage(msg);
        }
      }
    }).start();
    showView(position, view);
    return true;
  }

這里的第3行中調(diào)用了兩次blur方法來(lái)對(duì)圖片進(jìn)行高斯模糊 ,如果看過(guò)上一篇博客,每次高斯模糊的最大模糊半徑是25,如果要做到向iOS那也的模糊效果,25是不夠的,所以可以對(duì)模糊出來(lái)的圖片再模糊化一次,對(duì)比圖(左邊為2次模糊,右邊1次):

   

 ⑥ 優(yōu)化

但是實(shí)際上,對(duì)于一個(gè)分辨率比較高的手機(jī),截取的屏幕分辨率較大的情況下,通過(guò)多次模糊這樣的做法也是不推薦的。這里可以試想一下,假設(shè)我們先獲取到截屏,接著是否能將這個(gè)截取的圖片先進(jìn)行壓縮,畢竟后期還是需要模糊的,也就是這個(gè)圖片被壓縮了其實(shí)并不影響我們進(jìn)行模糊(因?yàn)榈阶詈蠖际悄:耍?shí)際上,當(dāng)我們進(jìn)行圖片壓縮的之后,會(huì)發(fā)現(xiàn)在相同模糊半徑之下,圖片的模糊效果不同了,如下兩圖:

   

原因是:高斯模糊采用的算法中確定一個(gè)點(diǎn)的顏色是通過(guò)這個(gè)點(diǎn)附近的其他點(diǎn)來(lái)求平均(帶權(quán))得到的,而取附近多是個(gè)像素點(diǎn),就是通過(guò)模糊半徑來(lái)確定。當(dāng)圖片被壓縮之后,相同模糊半徑下,每次取樣的區(qū)域就變大了,所以模糊強(qiáng)度就更大了。

這樣,我們就可以不需要進(jìn)行多次模糊,并且,壓縮圖片后,總像素點(diǎn)變少,模糊速度也就變得更快了。

這里同樣給出圖片壓縮的代碼:

  private Bitmap getSmallSizeBitmap(Bitmap source, float percent) {
    if (percent > 1 || percent <= 0) {
      throw new IllegalArgumentException("percent must be > 1 and <= 0");
    }
    Matrix matrix = new Matrix();
    matrix.setScale(percent, percent);
    return Bitmap.createBitmap(source, 0, 0, source.getWidth(), source.getHeight(), matrix, true);
  }

總結(jié)

以上就是在安卓(Android)實(shí)現(xiàn)3DTouch效果的全部?jī)?nèi)容,剛興趣的可以自己動(dòng)手實(shí)踐起來(lái),希望本文的內(nèi)容對(duì)大家能有所幫助。

相關(guān)文章

最新評(píng)論

富锦市| 萨嘎县| 拉萨市| 义马市| 景谷| 高阳县| 常德市| 巴彦县| 阳谷县| 巫溪县| 文山县| 报价| 萍乡市| 耒阳市| 徐闻县| 四川省| 乾安县| 黑山县| 乌拉特前旗| 芮城县| 林甸县| 安泽县| 云安县| 仁化县| 鄱阳县| 双鸭山市| 古田县| 阳西县| 洞头县| 顺平县| 四会市| 潼关县| 钦州市| 通渭县| 镇远县| 景洪市| 无极县| 新宾| 平昌县| 德钦县| 澳门|