Android繞球心旋轉(zhuǎn)的引導(dǎo)頁效果
先看一下預(yù)覽效果：
嗯，整體效果還算理想，基本實現(xiàn)了頁面繞屏幕底部中心旋轉(zhuǎn)。
這里我們用到了Android系統(tǒng)的一個組件ViewFlipper，該控件的主要作用是為其中的View切換提供動畫效果，主要的方法如下：
setInAnimation：設(shè)置View進入屏幕時的動畫。
setOutAnimation：設(shè)置View退出屏幕時的動畫。
showNext：調(diào)用該方法可以顯示下一個View。
showPrevious：調(diào)用該方法可以來顯示上一個View。
setFilpInterval：設(shè)置View切換的時間間隔。參數(shù)為毫秒。
startFlipping：開始進行View的切換。
stopFlipping：停止View切換。
setAutoStart：設(shè)置是否自動開始。如果設(shè)置為“true”，當ViewFlipper顯示的時候View的切換會自動開始。
首先看一下布局代碼：
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/activity_main"android:layout_width="match_parent"android:layout_height="match_parent"android:background="#440000ff"><ImageViewandroid:layout_width="match_parent"android:layout_height="230dp"android:layout_alignParentBottom="true"android:background="@mipmap/guide_bg" /><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"><ViewFlipperandroid:id="@+id/vf"android:layout_width="match_parent"android:layout_height="match_parent"><fragmentclass="com.showly.progressbardemo.GuideOneFragment"android:layout_width="match_parent"android:layout_height="match_parent" /><fragmentclass="com.showly.progressbardemo.GuideTwoFragment"android:layout_width="match_parent"android:layout_height="match_parent" /><fragmentclass="com.showly.progressbardemo.GuideThreeFragment"android:layout_width="match_parent"android:layout_height="match_parent" /></ViewFlipper></RelativeLayout></RelativeLayout>
主要就是一張在頁面底部的白色半球圖片，以及ViewFlipper內(nèi)部的三個View，當然可以不用fragment，使用一般的Layout也行。
接下來就是對應(yīng)的Activity：
public class MainActivity extends AppCompatActivity {//處理手勢監(jiān)聽private GestureDetector detector;private ViewFlipper flipper;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);flipper = (ViewFlipper) findViewById(R.id.vf);detector = new GestureDetector(this, new GestureDetector.SimpleOnGestureListener() {@Overridepublic boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {if (e1.getX() - e2.getX() > 120.0F) { //從右向左滑動flipper.setInAnimation(MainActivity.this, R.anim.tip_left_in);flipper.setOutAnimation(MainActivity.this, R.anim.tip_left_out);if (flipper.getDisplayedChild() < 2) {flipper.showNext();}} else if (e1.getX() - e2.getX() < -120.0F) { //從左向右滑動flipper.setInAnimation(MainActivity.this, R.anim.tip_right_in);flipper.setOutAnimation(MainActivity.this, R.anim.tip_right_out);if (flipper.getDisplayedChild() > 0) {flipper.showPrevious();}}return false;}});}@Overridepublic boolean onTouchEvent(MotionEvent event) {if (detector != null) {return detector.onTouchEvent(event);}return super.onTouchEvent(event);}}
因為要實現(xiàn)手勢滑動來切換頁面，所以要創(chuàng)建一個GestureDetector對象：
detector = new GestureDetector(this, new GestureDetector.SimpleOnGestureListener() {@Overridepublic boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {//省略......return false;}});
由于我們只關(guān)心，手指的左右滑動，所以重寫SimpleOnGestureListener的onFling()即可，然后在onTouchEvent()進行手勢監(jiān)聽的綁定。到此我們的Activity就可以相應(yīng)滑動的手勢了。
在onFling()方法中，當從右向左滑動時，通過setInAnimation()、setOutAnimation()設(shè)置flipper中view從右側(cè)進入的動畫和從左側(cè)退出的動畫，然后調(diào)用showNext()方法開始切換到下一頁，這樣就可以看到對應(yīng)的動畫效果。從左向右滑動時情況類似，同樣需要設(shè)置view進入和退出的動畫，然后通過showPrevious()方法切換到上一頁。
具體的動畫文件可以參考源代碼，這里就不貼了。
到此整個實現(xiàn)流程就介紹完了。
需要源碼的童鞋公眾號回復(fù)：“繞球心旋轉(zhuǎn)” 即可獲取哦！