WeChose Imageの使い方(ローカルアルバムから写真を選択するか、カメラで写真を撮る)
3176 ワード
一、APIを使用するwx.choo seImage(OBJECT)
wx.choo seImage(OBJECT)
ローカルアルバムから画像を選択したり、カメラで写真を撮ったりします。
OBJECTパラメータの説明:
パラメータ
タイプ
必要とする
説明
count
Number
いいえ、
最大選択できる画像の枚数は、デフォルト9
size Type
StrigAray
いいえ、
original原図、copresed圧縮図、デフォルトの両方があります。
sourceType
StrigAray
いいえ、
アルバムからアルバムを選んで、カメラを使って、デフォルトの二つがあります。
success
Function
はい、
成功すると画像のローカルファイルパスの一覧を返します。
fail
Function
いいえ、
インターフェースの呼び出しに失敗したコールバック関数
complettee
Function
いいえ、
インターフェース呼び出しが完了したコールバック関数(コール成功、失敗はいずれも実行されます)
注:ファイルの一時パスは、小プログラムの起動時に正常に使用できます。長期保存が必要なら、アクティブにwx.saveFileを起動して、次の起動時にアクセスできます。
success戻りパラメータの説明:
パラメータ
タイプ
説明
最低バージョン
tempFilePaths
StrigAray
画像のローカルファイルパスのリスト
temp Files
Object Aray
画像のローカルファイルリストは、各項目がFileオブジェクトです。
1.2.0
Fileオブジェクトの構造は以下の通りです。
フィールド
タイプ
説明
パス
String
ローカルファイルパス
size
Number
ローカルファイルサイズ、単位:B
1、wx.choo seImageカメラまたはアルバムを呼び出します。
2、<image class=「show-mage」mode=「aspectFitf」src=「{src}」>データバインディング
3、jsで文書の経路を動的に変更する
wx.choo seImage(OBJECT)
ローカルアルバムから画像を選択したり、カメラで写真を撮ったりします。
OBJECTパラメータの説明:
パラメータ
タイプ
必要とする
説明
count
Number
いいえ、
最大選択できる画像の枚数は、デフォルト9
size Type
StrigAray
いいえ、
original原図、copresed圧縮図、デフォルトの両方があります。
sourceType
StrigAray
いいえ、
アルバムからアルバムを選んで、カメラを使って、デフォルトの二つがあります。
success
Function
はい、
成功すると画像のローカルファイルパスの一覧を返します。
fail
Function
いいえ、
インターフェースの呼び出しに失敗したコールバック関数
complettee
Function
いいえ、
インターフェース呼び出しが完了したコールバック関数(コール成功、失敗はいずれも実行されます)
注:ファイルの一時パスは、小プログラムの起動時に正常に使用できます。長期保存が必要なら、アクティブにwx.saveFileを起動して、次の起動時にアクセスできます。
success戻りパラメータの説明:
パラメータ
タイプ
説明
最低バージョン
tempFilePaths
StrigAray
画像のローカルファイルパスのリスト
temp Files
Object Aray
画像のローカルファイルリストは、各項目がFileオブジェクトです。
1.2.0
Fileオブジェクトの構造は以下の通りです。
フィールド
タイプ
説明
パス
String
ローカルファイルパス
size
Number
ローカルファイルサイズ、単位:B
var util = require('../../utils/util.js')
Page({
data:{
src:"../image/pic4.jpg"
},
gotoShow: function(){var _this = this
wx.chooseImage({
count: 9, // , 9
sizeType: ['original', 'compressed'], // original ,compressed ,
sourceType: ['album', 'camera'], // album ,camera ,
success: function(res){
// success
console.log(res)
_this.setData({
src:res.tempFilePaths
})
},
fail: function() {
// fail
},
complete: function() {
// complete
}
})
}
二、画像パスをデータバインディングする
<view class="container">
<view>
<button type="default" bindtap="gotoShow" > </button>
</view>
<view>
<image class= "show-image" mode="aspectFitf" src="{{src}}"></image>
</view>
</view>
号外:1、wx.choo seImageカメラまたはアルバムを呼び出します。
2、<image class=「show-mage」mode=「aspectFitf」src=「{src}」>データバインディング
3、jsで文書の経路を動的に変更する
var _this = this
wx.chooseImage({
count: 9, // , 9
sizeType: ['original', 'compressed'], // original ,compressed ,
sourceType: ['album', 'camera'], // album ,camera ,
success: function(res){
// success
console.log(res)
_this.setData({
src:res.tempFilePaths
})
},
fail: function() {
// fail
},
complete: function() {
// complete
}
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。