Android 開發(八十五) Lolipop Activity Transition ShareElement (part2)

第一眼看到上面的transition時，覺得這個transition沒什麼，使用shareelement就可以很輕鬆的做到，但是在使用了activity transition 一陣子之後，發現有一個很嚴重的問題，
如果前一個view是recyclerview，後面一個view也是recyclerview的話，
image移動的動畫是不會出現的.

不會動的原因是當shareelement的動畫開始執行的時候，view 還沒有被lay出來，這個問題一直找不到解決的辦法，直到最近意外的看到了幾個method之後，這個問題才出現的解決方案

postponeEnterTransition(); and startPostponedEnterTransition();
顧名思義，我們可以延遲transition的時間，並且自己決定何時要start transition，
不過在這邊會有一個比較tricky的地方，假設postpone之後沒有立刻call startPostponedEnterTransition，整個ui會呈現卡住的狀態，（例如 postpone之後又等httprequest回來才lay 圖，就會造成ui呈現卡住的樣子），所以假設要使用這類的transition，必須要先把這層需要的資料帶進來. 這樣才能在postpone之後立刻使用
startPostponedEnterTransition.

最後附上sample code https://github.com/nightbear1009/LolipopActivityTransition
請切換到branch recyclerviewTorecyclerview

Android 開發(八十四) TripleLayoutRecyclerView

今天要介紹如何利用recyclerview建立可切換layout，如下圖所示

要建立這樣的layout有兩個挑戰必須克服
1.如何動態切換column
2.如何動態切換layout


1.如何動態切換column

要解決這個問題，我們可以使用 GridLayoutManager裡的method setSpanSizeLookup
SpanSizeLookup可以幫我們決定特定position的span是多少，
for example:
mManager = new GridLayoutManager(this,2);
代表著這個gridlayout每一行的Span size都會是2，當某個item的SpanSize 為 1則該行可以放兩個item，當某個item的SpanSize為2則該行只能放一個item，利用這個特性，我們就可以改變我們的layout每行的個數. 這樣我們就能動態的切換column數了
如下，當改變mViewSpan則每行item的數量就會改變
           ((GridLayoutManager) layout).setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
                @Override
                public int getSpanSize(int i) {
                    return ((GridLayoutManager) getLayoutManager()).getSpanCount() - mViewSpan +1;
                }
            });


在我們解決切換column的問題之後，接著要處理的就是如何動態切換layout

所幸這個問題非常容易解決，我們只需要修改getItemViewType，根據不同的type回傳不同的值，再利用onCreateView去實作不同的view即可.

最後還是要附上sample code

how to capture screen to gif

首先 mac 裡的 quickTimePlayer可以擷取螢幕

擷取完螢幕之後可以去下載
https://gist.github.com/dergachev/4627207


安裝完成之後

執行

ffmpeg -i firstgif.mov -vf "scale=min(iw\,600):-1" -pix_fmt rgb24 -r 10 -f gif - | gifsicle --optimize=3 --delay=7 --colors 128 > out16.gif

就可以輕鬆擷取螢幕資料了

Android 開發(八十三) Lolipop Activity Transition ShareElement

在android 5.0裡除了新增RecyclerView toolBar之外，另一個最特別的就是
Activity Transition，而且可以根據圖片的位置坐相對應的移動，如上圖，
假設我們的圖片在畫面底部，當點擊完成時，我們會導到另外的頁面，同時該圖片會從原本的位置移動到新的Activity放的位置. 這會增加很多的user experience. 當然個人也相當喜歡這個功能.

接下來要講如何實作

首先要先有兩個Activity(廢話..)
接著我們必須在Theme底下修改一些參數

 <style name="AppTheme" parent="android:Theme.Material.Light">
        <item name="android:windowSharedElementEnterTransition">
            @transition/change_image_transform</item>
        <item name="android:windowSharedElementExitTransition">
            @transition/change_image_transform</item>
    </style>

這是為了將動畫加入


接著必須在 res/transition/ 加入change_image_transform

<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">
    <changeBounds />
    <changeImageTransform/>
</transitionSet>

接著當圖片被點擊時

        Intent intent = new Intent(this,NextActivity.class);
        ActivityOptions options = ActivityOptions
                .makeSceneTransitionAnimation(this,
                        Pair.create(event.getView(),
                                NextActivity.VIEW_NAME));
        startActivity(intent, options.toBundle());

利用 view 以及 對應到下個view的參數 NextActivity.VIEW_NAME 產生ActivityOptions

接著在下個Activity裡
img.setTransitionName(VIEW_NAME);

這樣就大功告成了


最後附上github https://github.com/nightbear1009/LolipopActivityTransition

Android 開發(八十二) Scroll with ToolBar

不知道大家有沒有看過google play的toolbar會隨著滑動顯示隱藏，如下圖所示

我相當喜歡這個滑動的效果，所以最近花了一點時間研究這個的實踐辦法，
要實踐這個方法
1.首先我們必須使用toolbar而不是actionbar，使用toolbar我們才能控制這個view.
2.接著我們必須使用recyclerview，因為recyclerview的setOnScrollListener才可以計算scroll的距離.

看到這裡我猜大部分的人都已經猜到我們要怎麼實做這個行為了，
當recyclerview往上滑動時，我們就要想辦法把toolbar往上移動直到整個toolbar消失，
當recyclerview往下滑動時，我們就要想辦法把toolbar往下移動直到整個toolbar出現，
當toolbar出現>一半時則利用動畫將toolbar顯示
當toolbar出現<一半時則利用動畫將toolbar隱藏

當我們將這些邏輯定義完成，接著我們只需要將這些邏輯寫出來即可

最後附上sample code

從逆襲到稱王

由於公司讀書會的緣故，讓我有機會能夠從做產品的角度去閱讀一本書，這也是我第一次覺得一本書讀起來那麼有份量，總共六次的分享討論，還有每個人的意見分享，讓我獲益良多，對於作者的一些想法也有相當的認同，在這邊就稍微述說一下這本書讓我特別有印象的幾個part吧!!


解決用戶的問題 -> 累積到海量用戶 -> 賺錢模式自然會出現

周鴻禕提到，要用心觀察使用者的行為，想辦法去解決使用者的痛點，這樣就會有用戶來使用你的服務，這時候通常賺錢模式還不是很清楚，但是等到累積到了大量的用戶時，賺錢模式就會自然出現.

就像是line，提供了我們非常方便的傳訊聊天功能，但是這些服務都不用錢，那line怎麼賺錢呢？賣貼圖，廠商onAir，廠商廣告，他打破了以前傳訊息的商業模式，同時也創造了新的模式.

使用者體驗

周鴻禕提到，使用者體驗很重要，使用者體驗很重要，使用者體驗很重要，因為很重要所以要講三次，他利用了大量的篇幅告訴我們使用者體驗很重要，舉個最近的例子好了，最近有一個app提供每個月100分鐘的免費市話，這相當的吸引我，我知道的當天就下載了，可是點進去隨便點幾下就crash了，然後放在背景還會不斷crash，然後....我用完第一次之後就刪掉了，雖然他解決了我的痛點，可是他的用戶體驗真的不是很好，所以被我用完就刪掉了...

就如同周鴻禕提到的360衛士並不會在開機時掃毒，或者使用者在玩遊戲時掃毒，我覺得這個真的很重要，以前我就有幾次在中路pk的時候防毒軟體跳出來害死我，那種感覺真的很!#@$#，還會被隊友罵，如果那個時候就有360的話我或許會直接換防毒軟體.


看完這本書之後對互聯網有了新的認識，當然對於自家的產品也有不一樣的想法，還有身為一個ＲＤ重新對”需求“的定義有了新的想法.

這時候又忽然想起了多年前朋友跟我說的一句話，要讓ＲＤ能夠理解需求的原由就是把ＲＤ帶到用戶面前他就會懂了XD

Android開發(八十一) 如何使用recyclerview 畫出多種span的layout 例如gridview Header

先看一下下面的圖

在recyclerview出現以前要畫出上面這樣的layout其實是比較困難的，那時候必須要自己想辦法刻，如果是更複雜的layout就需要花更多時間來設法客製化了.

但是在recyclerview出現之後，要畫出這樣的layout就變得相對簡單了許多，
recyclerview強大的地方在於他有layoutmanger
使用gridlayout manager就可以讓layout長的像gridview一樣，
不過要如何才能動態控制我們想要的Span呢？

gridlayoutmanager有提供一個method叫做 setSpanSizeLookup，
在callback裡面只需要回傳某個位置所需要的spansize，最終在layout被畫出來時就會是我們所指定的size，就是那麼簡單就可以完成我們所想要的功能了!!

那要完成gridview header呢？...我想也是相當容易的事情~
只需要將position = 0 的 span size 設為 colum size 即可


最後附上sample code
https://gist.github.com/nightbear1009/bd09fdbd30f92504290f