文档章节

微信小程序 - 选择图片显示操作菜单

举个_栗子
 举个_栗子
发布于 06/17 19:18
字数 412
阅读 19
收藏 0
点赞 0
评论 0

之前我分享过选择图片这个文章,但是我在实际开发测试使用中发现一个问题在使用 wx.chooseImage 选择照片显示出第一格是拍照,后面是相册里的图片。这种实现之前说过了,效果如下。

但是你从用户体验角度多想一下来说无疑是下面这种方式比较好,类似微信点击发朋友圈这种形式,效果如下。(微信就是屌奥)

做法:可使用小程序API wx.showActionSheet 显示操作菜单 。

我的实现方式直接贴代码:

  chooseimage: function () {
    var that = this;
    wx.showActionSheet({
      itemList: ['从相册中选择', '拍照'],
      itemColor: "#CED63A",
      success: function (res) {
        if (!res.cancel) {
          if (res.tapIndex == 0) {
            that.chooseWxImage('album')
          } else if (res.tapIndex == 1) {
            that.chooseWxImage('camera')
          }
        }
      }
    })
  },

  chooseWxImage: function (type) {
   var that = this;
    wx.chooseImage({
      sizeType: ['original', 'compressed'],
      sourceType: [type], // 可以指定来源是相册还是相机
      success: function (res) {
        console.log(res);
        that.setData({
          tempFilePaths: res.tempFilePaths[0],
        })
      }
    })
  }

实现效果如下:

我相信在产品上为用户多想一点,多做一点,就可能可以更受用户欢迎。做事上比别人多想一点,多坚持一些,也许你就会比他人更幸运一些。

 

水平有限,若有问题请留言交流!

互相学习,共同进步:) 转载请注明出处谢谢!

 

© 著作权归作者所有

共有 人打赏支持
举个_栗子
粉丝 5
博文 68
码字总数 30840
作品 0
深圳
程序员
米8抢到没?不急,撸个小程序先😎

前言 小程序发布以来,凭借无需安装、用完即走、触手可及、无需注册、无需登录、以及社交裂变等多个优势,一路高歌,变得愈来愈火爆,它革命性的降低了移动应用的开发成本,也正好迎合了用户...

云中玉卷
06/12
0
0
微信公众号管理系统 RhaPHP 1.5.0 发布,支持小程序

RhaPHP 1.5.0 发布。 RhaPHP 是微信平台管理系统,支持多公众号管理,小程序开发,APP接口开发,平台独立且快速简洁易用。灵活的扩展应用机制,具有容易上手,几乎融合微信接口,简单的调用对...

疯狂的二哈
04/12
0
0
win10系统升级后远程连接 出现身份验证错误

一、出现问题原因,说明 昨天系统关机更新后,今天连接服务器出现 远程连接错误,“出现身份验证错误” 对应的win10 更新版本, 2018-适用于 Windows 10 Version 1709 的 05 累积更新,适合基...

tianma3798
05/11
0
0
微信小程序获取二维码接口整理,前台获取二维码

一、说明 小程序获取二维码常用接口B 指定小程序AccessToken ,指定二维码参数 使用 Post方式提交就返回二维码图片 二、获取小程二维码步骤 1.获取access_token 小程序的token获取和公众号获...

tianma3798
05/12
0
0
分享几个微信小程序开发框架和工具

###【小程序开发框架】 1、官方框架MINA 小程序提供的开发框架为MINA框架,它类似于淘宝Weex、Vue框架。MINA框架通过封装微信客户端提供的文件系统、网络通信、任务管理、数据安全等基础功能...

codeGoogle
04/18
0
0
fiddler抓包显示Tunnel to .....443,酬谢

需要技术达人教我一点操作方法,使用fiddler,抓取手机上微信小程序的数据。我遇到的问题是,总是显示Tunnel to .....443。希望有高手教我怎么解决这个问题。酬谢。测试小程序可以选择:微信...

刘宇同
04/05
0
0
wx-jq:一套完全原创的微信小程序插件集合库

wx-jq (一套完全原创的微信小程序插件集合库) 微信小程序插件,微信小程序组件,微信小程序插件集合,微信小程序组件集合,微信小程序插件学习,微信小程序插件开发, 在线演示: 下载地址...

透笔度
01/25
644
2
iWebShop 开源商城全新后台 UI 发布

好商城就要免费用!iWebShop开源系统免费使用~全新后台UI靓丽登场! 更新信息请关注:http://www.aircheng.com 新增部分 新增城市定位接口 IClient::getLocal(); 新增积分兑换商品功能 新增s...

north
05/31
0
0
WordPress 版微信小程序 - weimi-GZU

微觅贵大微信小程序 —— WordPress 版微信小程序 功能清单: 1.缩略图的方式显示文章列表(首页,分类文章),包括显示文章分类和发布时间,加载分页。 2.在首页用轮播方式显示置顶文章。 ...

似最初
05/24
0
0
不用懂技术,免费教大家如何开发制作微信小程序的优惠券功能

微信小程序上线之后,越来越多的企业特别是零售行业,电商行业等流量竞争激烈和流量导向型的,需要线上线下结合。微信小程序,背靠微信10.4亿的月活以及10亿用户,巨大的流量红利摆在眼前,谁...

微信小程序平台
昨天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

编程语言对比分析:Python与Java和JavaScript(图)

编程语言对比分析:Python与Java和JavaScript(图): 凭什么说“Python 太慢,Java 太笨拙,我讨厌 JavaScript”?[图] 编程语言生而为何? 我们人类从原始社会就是用语言表达自己,互相沟通...

原创小博客
10分钟前
0
0
Akka构建Reactive应用《one》

看到这Akka的官网,描述使用java或者scala构建响应式,并发和分布式应用更加简单,听着很高级的样子,下面的小字写着消息驱动,但是在quickstart里面又写容错事件驱动,就是这么钻牛角尖。 ...

woshixin
21分钟前
0
0
ffmpeg源码分析 (四)

io_open 承接上一篇,对于avformat_open_input的分析还差其中非常重要的一步,就是io_open,该函数用于打开FFmpeg的输入输出文件。 在init_input中有这么一句 if ((ret = s->io_open(s, &s-...

街角的小丑
23分钟前
0
0
String,StringBuffer ,StringBuilder的区别

不同点 一、基类不同 StringBuffer、StringBuilder 都继承自AbStractStringBuilder,String 直接继承自 Object 2、底层容器“不同” 虽然底层都是字符数组,但是String的是final修饰的不可变...

不开心的时候不要学习
38分钟前
0
0
nodejs 文件操作

写文件code // 加载文件模块var fs = require("fs");var content = 'Hello World, 你好世界!';//params 文件名,内容,编码,回调fs.writeFile('./hello.txt',content,'utf8',function (er......

yanhl
41分钟前
0
0
SpringBoot mybits 查询为0条数据 但是在Navicat 中可以查询到数据

1.页面请求: 数据库查询: 2018-07-16 17:56:25.054 DEBUG 17312 --- [nio-9010-exec-3] c.s.h.m.C.selectSelective : ==> Preparing: select id, card_number, customer_id, customer_nam......

kuchawyz
50分钟前
0
0
译:Self-Modifying cod 和cacheflush

date: 2014-11-26 09:53 翻译自: http://community.arm.com/groups/processors/blog/2010/02/17/caches-and-self-modifying-code Cache处在CPU核心与内存存储器之间,它给我们的感觉是,它具......

我叫半桶水
53分钟前
0
0
Artificial Intelligence Yourself

TensorFlow是谷歌基于DistBelief进行研发的第二代人工智能学习系统,其命名来源于本身的运行原理。Tensor(张量)意味着N维数组,Flow(流)意味着基于数据流图的计算,TensorFlow为张量从流...

孟飞阳
今天
0
0
press.one个人数字签名

这是我在press.one的数字签名 https://press.one/p/address/v?s=9d3d5b7ce019af357ab994775549e8f047a5b17fc9893364652fc67e4b95443b38ccb24c6655e0d252dd0154369eb9b7717c4ccf4e1835ca3596......

NateHuang
今天
1
0
Oracle 中的 SQL 分页查询原理和方法详解

本文分析并介绍 Oracle 中的分页查找的方法。 Oracle 中的表,除了我们建表时设计的各个字段,其实还有两个字段(此处只介绍2个),分别是 ROWID(行标示符)和 ROWNUM(行号),即使我们使用...

举个_栗子
今天
4
2

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部