• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

小程序之选择拍照或者本地相册

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

html

<!--pages/testdemo/testdemo.wxml-->
<view class="">
    <view class="container">
        <view class=\'img_body\'>
            <view class=\'img_list\'>
                <view class=\'img_li\' wx:for="{{imglist}}" wx:key="{{index}}">
                    <image src="{{item}}"></image>
                </view>
                <view class=\'addimg\' bindtap=\'img_w_show\'>
                    <image src=\'../../imgs/add.png\'></image>
                </view>
            </view>
        </view>
    </view>
</view>

css

.img_list {
    width: 100vw;
    display: flex;
    display: -webkit-flex;
    padding: 0 20rpx;
    box-sizing: border-box;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}

.img_list .img_li,
.addimg {
    width: 200rpx;
    height: 250rpx;
    border: 1px solid #999999;
    margin: 5rpx;
    flex-shrink: 0;
    -webkit-flex-shrink: 0;
}

.addimg image {
    width: 150rpx;
    height: 150rpx;
    margin: 50rpx 25rpx;
}

.img_list .img_li image {
    width: 100%;
    height: 100%;
}

只是一个弹框

 imglist: [
      "https://img.yzcdn.cn/vant/cat.jpeg",
      "https://img.yzcdn.cn/vant/cat.jpeg"
    ]
  img_w_show() {
    // 弹框 是相机拍照还是 从相册中选择的哈
    wx.showActionSheet({
      itemList: ["从手机相册选择", "拍照"],
      success: function(res) {

        <!-- 判断你自己选择的是相机还是相机  -->
        console.log("选择的是 :", res.tapIndex);

        let sourceType = "camera";
        if (res.tapIndex == 0) {
          sourceType = "camera"; //相机
        } else if (res.tapIndex == 1) {
          sourceType = "album"; //相册
        }

      },
      fail: function(res) {
        console.log(res.errMsg);
      }
    });
  }

选择本地相册图片 或者是 相机拍照

  var _this = this;
    wx.showActionSheet({
      itemList: ["拍照", "从相册中选择"],
      success(res) {
        console.log("选择的是 :", res.tapIndex);
        let sourceType = "camera";
        if (res.tapIndex == 0) {
          sourceType = "camera"; //相机
        } else if (res.tapIndex == 1) {
          sourceType = "album"; //相册
        }

        wx.chooseImage({
          count: 9,
          sizeType: ["original", "compressed"], // 可以指定是原图还是压缩图,默认二者都有
          sourceType: [sourceType],
          success: function(res) {
            var tempFilePaths = res.tempFilePaths;
            console.log(tempFilePaths);//图片路径为 https
            _this.setData({
              imglist: _this.data.imglist.concat(tempFilePaths)
            });
          }
        });
      }
    });

点击加号直接拍照

  img_w_show() {
    var _this = this;
    // 只是单纯的嗲用是拍照 还是相册中选择弹框

    let sourceType = "camera";

    //  从本地相册选择图片或使用相机拍照。
    wx.chooseImage({
      count: 9,
      sizeType: ["original", "compressed"], // 可以指定是原图还是压缩图,默认二者都有
      sourceType: [sourceType],
      success: function(res) {
        var tempFilePaths = res.tempFilePaths;
        console.log(tempFilePaths); //图片路径为 https
        _this.setData({
          imglist: _this.data.imglist.concat(tempFilePaths)
        });
      }
    });
  },


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap