Ionic3 UI組件之 Gallery Modal

Gallery Modal可以理解為相冊的預覽界面。可以顯示網絡圖片，也可以顯示base64Image。

在這個例子中，我用來實現圖片的預覽功能。

相機拍照，或者相冊選擇圖片后，用縮略圖組件顯示縮略圖，點擊縮略圖可以預覽大圖。

組件特性：

• 支持手勢縮放
• 可加載網絡圖片，也可以加載本地圖片或者base64Image

參考地址：https://github.com/nikini/ionic-gallery-modal

=========================================================

1）安裝包：

npm install ionic-gallery-modal --save

2）在app.module.ts中添加：

import { GalleryModal } from 'ionic-gallery-modal';
import { ZoomableImage } from 'ionic-gallery-modal';

3）在你的頁面中直接使用ModalController來展示：

 

注意photos數組里面，加上url屬性，默認格式為Array[{ url: string }],否則組件找不到url。

initialSlide是默認加載的圖片的索引，不要超出索引范圍。

效果如下：