根據material design 的 best practice 要求如果在每個頁面的icon不同,
必須出現animation的動作如下
這是很合理的行為
但是.... google 的sample 卻沒有教我們怎麼實做這個方法
今天花了一點時間研究了一下該如何實作出這樣的效果(以現有api,而不去使用自幹animation的方法)
其實就是在viewpager 的 onPageSelected的時候 直接call
fab.hide() 然後在fab 消失的時(onHidden被call的時候)再將新的圖換上,並且call fab.show()
目前看起來一切都很正常,但是比較好的做法還是應該在onHidden做點判斷
避免animation回來的時候,view消失就crash了
最後,如果大家有其它的做法也歡迎分享給我知道XD
2016年3月23日 星期三
2016年3月12日 星期六
Android 開發(117) what's new in N - java8 - Default and static interface methods
Android N 支援了java8部份的語法,今天要介紹的是
Default and static interface methods,
熟悉interface的大家應該都知道interface 只能定義"行為"不像是abstract class
除了定義行為之外還可以實作相關的內容,舉個最簡單的例子
這是我們熟悉的interface 只能定義"行為"

這是我們熟悉的abstract class 可以定義相關實作內容

不過這件事情在java8出現了改變
在java8 你可以針對interface 定義預設的行為,只要你不實作該功能,
他就會使用default的方法
如下,我針對DefaultInterface 定義了一個預設的getViewType行為

然後我並沒有在DefaultImp 裡面override getViewType這個method

所以當我new DefaultImp().getViewType()時會出現 DefaultInterface的 message
相對的假設我今天override了getViewType則message 會出現我override的方法
如下,假設我使用new CustomImp().getViewType則會出現 CustomImp的message

不過,這樣interface 和abstract的定義看起來就有點模糊了?
其實不會..
interface 還是只能定義"行為" CustomImp 並不能使用super.getViewType這種call 法
也不能定義field ,只能說interface的功能變強大了點!? 多了支援default 行為的這種功能
順道提一下現在interface 也可以定義static method了,不過這個看起來就跟原本的static method沒什麼太大差別,所以在這邊就不提了
android 上可以使用的java8 功能還有很多,會在之後再跟大家提到
Default and static interface methods,
熟悉interface的大家應該都知道interface 只能定義"行為"不像是abstract class
除了定義行為之外還可以實作相關的內容,舉個最簡單的例子
這是我們熟悉的interface 只能定義"行為"

這是我們熟悉的abstract class 可以定義相關實作內容

不過這件事情在java8出現了改變
在java8 你可以針對interface 定義預設的行為,只要你不實作該功能,
他就會使用default的方法
如下,我針對DefaultInterface 定義了一個預設的getViewType行為

然後我並沒有在DefaultImp 裡面override getViewType這個method

所以當我new DefaultImp().getViewType()時會出現 DefaultInterface的 message
相對的假設我今天override了getViewType則message 會出現我override的方法
如下,假設我使用new CustomImp().getViewType則會出現 CustomImp的message

不過,這樣interface 和abstract的定義看起來就有點模糊了?
其實不會..
interface 還是只能定義"行為" CustomImp 並不能使用super.getViewType這種call 法
也不能定義field ,只能說interface的功能變強大了點!? 多了支援default 行為的這種功能
順道提一下現在interface 也可以定義static method了,不過這個看起來就跟原本的static method沒什麼太大差別,所以在這邊就不提了
android 上可以使用的java8 功能還有很多,會在之後再跟大家提到
2016年3月11日 星期五
Android 開發(116) what's new in N - resizeable activity
Android N 在最近這幾天出了preview版,身為一個android 開發人員當然要嘗鮮一下
今天要介紹的是 resizeableActivity
大家先看一下圖

簡單的說就是可以在一個頁面下開兩個activity ,你只需要長按就可以將有支援的activity
放在另一個視窗
今天就要來說明我們該如何實作
首先你必須將 gradle 升級到N 外加N的模擬器or 手機
接著你必須將gradle的設定先升到N preview的版本

注意 compilesdk, buildTool, minsdk, targetsdk, dependencies的設定
接著Android Manifest必須做一個設定

可以注意到有新增一個taskAffinity ,目前還不清楚為何,但是如果沒有設定就不會work
最後是呼叫activity的方法

FLAG_ACTIVITY_LAUNCH_ADJACENT是指當spilte mode開啟時,我們可以直接將activity開在新的視窗,而不會直接蓋在原本的視窗
FLAG_ACTIVITY_NEW_TASK 根據官方文件的說法是,避免activity直接在同一個task開啟(造成在同個視窗開啟)
也就是說利用上面兩個flag就可以正常的在新的視窗中開啟我們的activity
接著如果想要知道acitivty的size ,我們可以在configChange裡面得到相關的資訊
前提是必須先在manifest裡面加上相關設定,如下


根據官方說法,之後還會有free-form multi-window mode
不過目前還沒看到相關功能就是了,大家可以期待一下囉!!
今天要介紹的是 resizeableActivity
大家先看一下圖

簡單的說就是可以在一個頁面下開兩個activity ,你只需要長按就可以將有支援的activity
放在另一個視窗
今天就要來說明我們該如何實作
首先你必須將 gradle 升級到N 外加N的模擬器or 手機
接著你必須將gradle的設定先升到N preview的版本

注意 compilesdk, buildTool, minsdk, targetsdk, dependencies的設定
接著Android Manifest必須做一個設定

可以注意到有新增一個taskAffinity ,目前還不清楚為何,但是如果沒有設定就不會work
最後是呼叫activity的方法

FLAG_ACTIVITY_LAUNCH_ADJACENT是指當spilte mode開啟時,我們可以直接將activity開在新的視窗,而不會直接蓋在原本的視窗
FLAG_ACTIVITY_NEW_TASK 根據官方文件的說法是,避免activity直接在同一個task開啟(造成在同個視窗開啟)
也就是說利用上面兩個flag就可以正常的在新的視窗中開啟我們的activity
接著如果想要知道acitivty的size ,我們可以在configChange裡面得到相關的資訊
前提是必須先在manifest裡面加上相關設定,如下


根據官方說法,之後還會有free-form multi-window mode
不過目前還沒看到相關功能就是了,大家可以期待一下囉!!
2016年3月3日 星期四
Android 開發(115) new Design lib bottomSheet
最新發佈的support library 23.2.0 多了一個新的ui bottomSheet
算是一種蓋半頁的ui,常常可以在電商的app裡看到類似的用法
以前要做這種ui真的是要自己想辦法處理,現在google提供了新的方案
讓我們可以輕鬆做到這個功能
接下來讓我們看看這個lib 實際運作的樣子

要怎麼做到? 方法其實很簡單
只要在想要使用bottomsheet的 layout 上面加上
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"即可
就會出現像上面的運作樣式
如下圖

那如果你希望可以有背景暗掉的感覺bottomsheet也提供使用dialog的做法
如下圖

你需要將想要放入bottomSheetDialog的 ui 利用dialog.setContentView塞進去之後
接著call dialog.show即可

如果在ui 出現或藏起來的情況下,想要自動讓ui 彈出來或縮起來的話
則必須使用BottomSheetBehavior 的setState method ,
裡面有個STATE_EXPANDED的參數

不過這個方法很hardcode,你可以看到先將LayoutParams強轉成CoordinateLayoutParams然後再強轉成bottomSheetBehavior
還好google 有提供比較簡單的做法

只需要使用BottomSheetBehavior.from就可以達到我們的目標了
最後要再提一個peekheight
我們常常可以看到有部分的ui 會凸出一小部分,讓你知道是可以滑動的
google 也提供了類似的功能
我們只需要設定peekheight,當bottomsheet在縮下去的時候就不會縮到完全不見
而是根據你給定的高度顯示

好了,說了那麼多,相信大家都對bottomsheet有基本的了解了
最近google真的出了很多新的ui ,真的讓開發app簡單很多啊!!!
算是一種蓋半頁的ui,常常可以在電商的app裡看到類似的用法
以前要做這種ui真的是要自己想辦法處理,現在google提供了新的方案
讓我們可以輕鬆做到這個功能
接下來讓我們看看這個lib 實際運作的樣子

要怎麼做到? 方法其實很簡單
只要在想要使用bottomsheet的 layout 上面加上
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"即可
就會出現像上面的運作樣式
如下圖

那如果你希望可以有背景暗掉的感覺bottomsheet也提供使用dialog的做法
如下圖

你需要將想要放入bottomSheetDialog的 ui 利用dialog.setContentView塞進去之後
接著call dialog.show即可

如果在ui 出現或藏起來的情況下,想要自動讓ui 彈出來或縮起來的話
則必須使用BottomSheetBehavior 的setState method ,
裡面有個STATE_EXPANDED的參數

不過這個方法很hardcode,你可以看到先將LayoutParams強轉成CoordinateLayoutParams然後再強轉成bottomSheetBehavior
還好google 有提供比較簡單的做法

只需要使用BottomSheetBehavior.from就可以達到我們的目標了
最後要再提一個peekheight
我們常常可以看到有部分的ui 會凸出一小部分,讓你知道是可以滑動的
google 也提供了類似的功能
我們只需要設定peekheight,當bottomsheet在縮下去的時候就不會縮到完全不見
而是根據你給定的高度顯示

好了,說了那麼多,相信大家都對bottomsheet有基本的了解了
最近google真的出了很多新的ui ,真的讓開發app簡單很多啊!!!
訂閱:
文章 (Atom)