現在很多Android應用上都增加了Activity右滑退出的效果,這個效果最早來源于iOS,這樣的操作優化確實提升了用戶體驗。所以目前很多App在Android上也新增了這一功能,例如簡書、酷狗音樂等,今天我就來學習一下可以實現這個功能的開源框架SwipeBackLayout。
下面先看一下具體效果圖:
SwipeBackLayout的使用方法
首先在開發前將SwipeBackLayout開源庫添加到項目中,添加庫的方式有兩種:
- 直接添加庫文件
- 添加依賴 compile 'me.imid.swipebacklayout.lib:library:1.0.0'
之后我們寫一個基類Activity繼承自庫中的SwipeBackActivity,代碼如下:
public class BaseActivity extends SwipeBackActivity {
private SwipeBackLayout mSwipeBackLayout;
@Override
protected void onCreate(BundlesavedInstanceState) {
super.onCreate(savedInstanceState);
// 可以調用該方法,設置是否允許滑動退出
setSwipeBackEnable(true);
mSwipeBackLayout = getSwipeBackLayout();
// 設置滑動方向,可設置EDGE_LEFT, EDGE_RIGHT, EDGE_ALL, EDGE_BOTTOM
mSwipeBackLayout.setEdgeTrackingEnabled(SwipeBackLayout.EDGE_LEFT);
// 滑動退出的效果只能從邊界滑動才有效果,如果要擴大touch的范圍,可以調用這個方法
//mSwipeBackLayout.setEdgeSize(200);
}
}
然后我們就可以寫自己的Activity了,只要繼承自BaseActivity就可以了,為了測試一下效果我寫了三個非常簡單的Activity,在此也就不貼代碼了。到此所有工作就結束了,下面我就開始跑程序了,效果如下圖所示:
這個時候我們可以很清楚的看到效果和我們想象的并不一樣,在向右滑動時上一個Activity變成了黑屏,通過查閱資料得知,我們還需要在AppTheme中添加一個屬性:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="android:windowIsTranslucent">true</item>
</style>
并在清單文件中設置這個Theme,然后我再跑一次程序試了一下,依舊還是出現上述情況,這是為什么呢?原來我們需要將主界面MainActivituy主題的windowIsTranslucent設置為false,而其他Activity設置為true,因此我又添加了一個樣式:
<style name="AppThemeMain" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="android:windowIsTranslucent">false</item>
</style>
然后在清單文件中進行相應的配置,測試成功,效果如圖1所示。
windowIsTranslucent屬性
程序測試完成之后我想為Activity之間的跳轉添加一些動畫,所以我又寫了一下代碼:
<style name="anim_activity" parent="@android:style/Animation.Activity">
<item name="android:activityOpenEnterAnimation">@anim/activity_open_in_anim</item>
<item name="android:activityOpenExitAnimation">@anim/activity_open_out_anim</item>
<item name="android:activityCloseEnterAnimation">@anim/activity_close_in_anim</item>
<item name="android:activityCloseExitAnimation">@anim/activity_close_out_anim</item>
</style>
但是我驚奇的發現這些動畫竟然不起作用,幾經波折終于找到了解決方法,解決辦法就是,windowAnimationStyle需要繼承Animation.Translucent,一般情況是繼承的Animation.Activity,這是由于windowIsTranslucent這個屬性設置為了true,然后我將代碼改為:
<style name="animation_translucent_translate" parent="@android:style/Animation.Translucent">
<item name="android:windowEnterAnimation">@anim/activity_open_in_anim</item>
<item name="android:windowExitAnimation">@anim/activity_open_out_anim</item>
</style>
至此測試成功!
以上Demo是在Android4.4系統進行測試的,后來我在5.0以上系統上測試發現,不設置windowIsTranslucent屬性也是可以的,但是4.4系統是不行的,所以個人認為,為了適配還是盡量按照以上做法來開發比較好。好了,到此我的學習就結束了,還是有很多東西需要學習的啊,歡迎大家指導建議。