ionic3图片预览插件-可以左右滑动的图片预览插件

下面给大家介绍的这款插件是基于 photoswipe.js的一款ionic3图片预览插件,支持图片左右滑动,并且还支持手势。



它的名字叫:ionic-gallery-modal



ionic3图片预览插件ionic-gallery-modal的为主要功能:


     根据Url显示图片
     支持手势,可放大缩小
     带关闭按钮
     支持多个图片左右滑动

     类似qq空间和微信朋友圈的图片轮播



演示效果:








用法:



1、安装Installation

npm install ionic-gallery-modal --save




2、你的app.module.ts引入安装

import * as ionicGalleryModal from 'ionic-gallery-modal';
import { HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';



imports: [
  //...
  ionicGalleryModal.GalleryModalModule,
  //...
],
and to your providers


providers: [
  //...
  {
    provide: HAMMER_GESTURE_CONFIG,
    useClass: ionicGalleryModal.GalleryModalHammerConfig,
  },
  //...
],



3、找到你的对应的组件页面执行下面操作



import { ModalController } from 'ionic-angular';
import { GalleryModal } from 'ionic-gallery-modal';
let modal = this.modalCtrl.create(GalleryModal, {
  photos: photos,
  initialSlide: index
});
modal.present();




如果你还是不知道如何操作,


这里有ionic3图片预览插件,支持图片左右滑动,并且还支持手dmeo:


https://github.com/nikini/ionic-gallery-modal-demo


https://github.com/htzhanglong/ionic-gallery-modal-demo