SlideView是一個Android上的以滑動揭示的方式顯示並切換圖片的View,以視覺對比的方式把一套相似的圖片展示出來。
示例
- 翻頁圖片揭示效果:
特性
-
設置一組(List<ImageInfo>)待加載的圖片(本地圖片,網絡圖片),通過(ImageLoader)庫加載出圖片並按List的順序顯示圖片。
-
通過手勢識別(GestureDetector),判斷用戶手指往左或者往右滑動,根據滑動位移揭開和蓋上圖片,當手指松開時,根據滑動速度和滑動位移的距離決定是翻頁,還是滑回當前頁。
-
翻頁或滑回時通過ScrollerCompat來計算並畫出平滑動畫,在規定時間內平滑過度。
-
繼承自View,可在xml布局文件中使用,也可以java代碼使用。
-
在View的onDraw方法中畫出當前要顯示的圖片,文字(名字)和指示器。
源碼:
使用方法
-
布局中定義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>
-
設置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); } }
-
build.gradle中加入ImageLoader的依賴:
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.5' }