一個Android上的以滑動揭示的方式顯示並切換圖片的View

SlideView是一個Android上的以滑動揭示的方式顯示並切換圖片的View，以視覺對比的方式把一套相似的圖片展示出來。

示例

• 翻頁圖片揭示效果：
  

特性

• 設置一組(List<ImageInfo>)待加載的圖片(本地圖片，網絡圖片)，通過(ImageLoader)庫加載出圖片並按List的順序顯示圖片。

• 通過手勢識別(GestureDetector)，判斷用戶手指往左或者往右滑動，根據滑動位移揭開和蓋上圖片，當手指松開時，根據滑動速度和滑動位移的距離決定是翻頁，還是滑回當前頁。

• 翻頁或滑回時通過ScrollerCompat來計算並畫出平滑動畫，在規定時間內平滑過度。

• 繼承自View，可在xml布局文件中使用，也可以java代碼使用。

• 在View的onDraw方法中畫出當前要顯示的圖片，文字(名字)和指示器。

  ​

源碼：

• 完整源碼地址：SlideView (https://github.com/homgwu/slideview)

使用方法

1. 布局中定義SlideImageView:

   <?xml version="1.0" encoding="utf-8"?>
   <RelativeLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:app="http://schemas.android.com/apk/res-auto"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:background="@android:color/darker_gray"
       >
   
       <com.homg.slideview.SlideImageView
           android:id="@+id/main_siv"
           android:layout_width="match_parent"
           android:layout_height="match_parent"
           android:layout_centerInParent="true"
           app:indicatorColor="#FF0000FF"
           app:indicatorRadius="5dp"
           app:nameTextColor="#FF0000FF"
           app:nameTextSize="26sp"
           app:textMargin="5dp"
           />
   </RelativeLayout>
   

2. 設置SlideImageView，設置圖片源，和圖片切換監聽器:

   public class MainActivity extends AppCompatActivity {
       private static final String TAG = MainActivity.class.getSimpleName();
       private SlideImageView mSlideImageView;
       private String[] urls = new String[]{"assets://test_1.jpg", "assets://test_2.jpg",
               "assets://test_3.jpg",
               "assets://test_4.jpg",
               "assets://test_5.jpg"};
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           ImageLoaderConfiguration configuration = ImageLoaderConfiguration
                   .createDefault(this);
           ImageLoader.getInstance().init(configuration);
           setContentView(R.layout.activity_main);
           mSlideImageView = (SlideImageView) findViewById(R.id.main_siv);
           mSlideImageView.setOnSlideImageListener(new         SlideImageView.OnSlideImageListener() {
               @Override
               public void onShowImage(int index, SlideImageView.ImageInfo imageInfo) {
                   Log.i(TAG, String.format("index=%d,image info=%s", index, imageInfo));
               }
           });
           List<SlideImageView.ImageInfo> imageInfoList = new ArrayList<>(5);
           for (int i = 0; i < urls.length; i++) {
               SlideImageView.ImageInfo tempInfo = new SlideImageView.ImageInfo(urls[i], "Image-" + i);
               imageInfoList.add(tempInfo);
           }
           mSlideImageView.setImageInfos(imageInfoList);
       }
   }
   

3. build.gradle中加入ImageLoader的依賴：

   dependencies {
       compile fileTree(dir: 'libs', include: ['*.jar'])
       compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.5'
   }