Ionic3 UI组件之Gallery Modal详解
更新时间：2017年06月07日 15:13:34 作者：tomKart
这篇文章主要为大家详细介绍了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是默认加载的图片的索引，不要超出索引范围。
效果如下：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
js设置cookie过期也就相当于清除浏览器对应名称的cookie，下面有个不错的示例，感兴趣的朋友可以参考下2013-10-10
Bootstrap每天必学之折叠，本文向大家讲解了Bootstrap折叠操作，感兴趣的小伙伴们可以参考一下2016-04-04
这篇文章主要介绍了JavaScript正则验证密码强弱度的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-05-05
这篇文章主要介绍了详解小程序循环require之坑，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
这篇文章主要介绍了一文理解JavaScript装饰器模式，文章基于JavaScript的相关资料展开详细介绍，具有一定的参考价值，需要的小伙伴可以参考一下2022-04-04
做一个弹出dialog时用到了取父页面的宽度和高度的方法,需要的朋友可以参考下2014-02-02
透明渐变导航是一种解决滚动条通顶的变通方案。这篇文章主要介绍了原生JS实现 MUI导航栏透明渐变效果,需要的朋友可以参考下2017-11-11
这篇文章主要为大家详细介绍了JavaScript实现文字展开和收起效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
这篇文章主要为大家介绍了盘点7个简单但棘手的JavaScript面试问题分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-11-11
这篇文章主要介绍了javascript面向对象之对象的深入理解,将javascript面向对象程序设计中一切都视为对象,并以实例形式进一步分析了面向对象的特性,需要的朋友可以参考下2015-01-01
最新评论