Tutorial

カメラで撮影(送信)するには

端末のカメラで写真を撮影し、その写真を保存するにはJavascriptを記述します。
保存先は端末内またはサーバを指定出来ます。

Javascript

(function() {
	/*
	 * optionsの引数一覧:
	 * 		DestinationType.DATA_URL				画像を Base64 形式で取得
	 * 		DestinationType.FILE_URI				画像をファイル URI として取得
	 * 		PictureSourceType.PHOTOLIBRARY		写真ライブラリから取得
	 * 		PictureSourceType.CAMERA				写真を撮る
	 * 		PictureSourceType.SAVEDPHOTOALBUM	アルバムから取得
	 * 		EncodingType.JPEG					画像を JPEG 形式で取得
	 * 		EncodingType.PNG					画像を PNG 形式で取得
	 * 		MediaType.PICTURE					取得元は静止画像のみとします。
	 * 		MediaType.VIDEO					取得元はビデオのみとします。
	 * 		MediaType.ALLMEDIA					全てのメディアタイプからの取得を許可します。
	 * 		PopoverArrowDirection.ARROW_UP		ポップオーバの矢印(上)
	 * 		PopoverArrowDirection.ARROW_DOWN		ポップオーバの矢印(下)
	 * 		PopoverArrowDirection.ARROW_LEFT		ポップオーバの矢印(左)
	 * 		PopoverArrowDirection.ARROW_RIGHT		ポップオーバの矢印(右)
	 * 		PopoverArrowDirection.ARROW_ANY		ポップオーバの矢印
	 */
	
	//画像データ
	var imageData = null;
	
	/*
	 * 撮影してBase64で取得
	 */
	getPictureByBase64 = function() {
		var options = {
			quality:         70,
			destinationType: applican.camera.DestinationType.DATA_URL,
			sourceType:      applican.camera.PictureSourceType.CAMERA,
			encodingType:    applican.camera.EncodingType.JPEG,
			targetWidth:     220,
			targetHeight:    220
		};
		applican.camera.getPicture(getPictureByBase64Success, getPictureByBase64Error, options);
	}
	
	/*
	 * 撮影してBase64で取得成功時のCallback処理
	 * 	res:画像データ
	 */
	function getPictureByBase64Success(res) {
		imageData = res;
		var dump = "getPictureByBase64Success\n";
		dump    += "size:" + res.length + "\n";
		document.getElementById("dumpAreaCamera01").value = dump;

		var image = document.getElementById("photoImg");
			image.src = "data:image/jpeg;base64," + res;
	}
	
	/*
	 * 撮影してBase64で取得失敗時のCallback処理
	 */
	function getPictureByBase64Error(message) {
		var dump = "getPictureByBase64Error\n";
		dump    += "message:" + message + "\n";
		document.getElementById("dumpAreaCamera01").value = dump;
	}

	/*
	 * カメラ撮影パスで取得
	 */
	getPictureByPath = function() {
		var options = {
			quality:            70,
			destinationType:    applican.camera.DestinationType.FILE_URI,
			sourceType:         applican.camera.PictureSourceType.CAMERA,
			encodingType:       applican.camera.EncodingType.JPEG,
			targetWidth:        220,
			targetHeight:       220,
			saveToPhotoAlbum:   false,
			correctOrientation: true,
			allowEdit:          false
		};
		applican.camera.getPicture(getPictureByPathSuccess, getPictureByPathError, options);
	}
	
	/*
	 * カメラ撮影パスで取得成功時のCallback処理
	 * 	res:画像のパス
	 */
	function getPictureByPathSuccess(res) {
		imageData = res;

		var dump = "getPictureByPathSuccess\n";
		dump    += "result:" + res + "\n";
		document.getElementById("dumpAreaCamera01").value = dump;

		var image = document.getElementById("photoImg");
			image.src = res;
	}
	
	/*
	 * カメラ撮影パスで取得失敗時のCallback処理
	 */
	function getPictureByPathError(message) {
		var dump = "getPictureByPathError\n";
		dump    += "message:" + message + "\n";
		document.getElementById("dumpAreaCamera01").value = dump;
	}

	/*
	 * 取得した画像を→ライブラリへ保存
	 */
	saveToPhotoAlbum = function() {
		if(imageData == null) {
			alert('データがありません');
			return;
		}
		applican.camera.saveToPhotoAlbum(imageData, saveToPhotoAlbumSuccess, saveToPhotoAlbumError);
	}
	
	/*
	 * 取得した画像を→ライブラリへ保存成功時のCallback処理
	 */
	function saveToPhotoAlbumSuccess() {
		var dump = "saveToPhotoAlbumSuccess\n";
		document.getElementById("dumpAreaCamera01").value = dump;
	}
	
	/*
	 * 取得した画像を→ライブラリへ保存失敗時のCallback処理
	 */
	function saveToPhotoAlbumError(message) {
		var dump = "saveToPhotoAlbumError\n";
		dump    += "message:" + message;
		document.getElementById("dumpAreaCamera01").value = dump;
	}

})();

解説

ライブラリ画像から画像を取得したい場合や、一時ディレクトリに保存された画像ファイルを削除したい場合の処理はリファレンスのCameraの項目を参考にしてください。

会員登録(無料)はこちらから