เปิด Photo Gallery ด้วย Titanium Mobile

ในบทความนี้ จะเป็นการเปิด Photo Gallery เพื่อเลือก ภาพที่อยู่ในเครื่องมาทำการแสดงบน Application ครับการแสดงภาพอันนี้ไม่จำเป็นต้องทดสอบบนเครื่องจริง ๆ ก็ได้ครับ  สามารถทดสอบบน Emulator ได้เลยครับ เพียงแต่ใน Emulator นั้นต้องมีรูปภาพอยู่เท่านั้นเอง


เรามาเริ่มกันเลยดีกว่าครับ สำหรับคำสั่งในการเปิด Gallery นั่นก็คือ
Titanium.Media.openPhotoGallery();
โดยคำสั่งนี้ก็จะมี Property ที่เราจะใช้งานมันบ่อย ๆ นั่นก็คือ
  • mediaTypes สำหรับระบุว่าสิ่งที่เราต้องการนั้นเป็น รูปภาพหรือวีดีโอ โดยจะกำหนดค่าได้ดังนี้
    • Titanium.Media.MEDIA_TYPE_PHOTO
    • Titanium.Media.MEDIA_TYPE_VIDEO
  • allowEditing สำหรับระบุว่าเมื่อถ่ายภาพแล้วจะสามารถ Crop หรือ แก้ไขได้หรืไม่  (สำหรับ iOS)
  • success สำหรับระบุว่าเมื่อเลือกภาพแล้วจะให้ Application ทำอย่างไรต่อไป
  • cancel สำหรับระบุว่าเมื่อมีการยกเลิกการเลือกภาพแล้วจะให้ Application ทำอย่างไรต่อไป
  • error สำหรับระบุว่าเมื่อมีความผิดพลาดเกิดขึ้นแล้วจะให้ Application ทำอย่างไรต่อไป
เรามาสร้างเป็น Application กันเลยนะครับ ซึ่งการสร้างก็จะเหมือนกับ ใช้งานกล้องถ่ายรูปด้วย Titanium Mobile นะครับ นั่นคือ มี window,button และ imageview ครับ
var win = Titanium.UI.createWindow({ backgroundColor : '#fff', navBarHidden : true }); var openGallery = Titanium.UI.createButton({ title : 'Open Gallery' , width : Titanium.Platform.displayCaps.platformWidth - 20, height : 50 , top : 0 }); var imageView = Titaniu.UI.createImageView({ width : Titanium.Platform.displayCaps.platformWidth - 20, top : 60 }); win.add(openGallery ); win.add(imageView); win.open();
หลังจากนั้นก็เพิ่ม Function ของการกดที่ปุ่ม โดยใช้การ addEventListener ครับ
openGallery.addEventListener('click',function(){ Titanium.Media.openGallery({ mediaTypes : Titanium.Media.MEDIA_TYPE_PHOTO, success : function(event){ imageView .image = event.media } }); });
สำหรับ Android นะครับ เหมือนเดิมครับ ต้องเพิ่ม Permission เข้าไปด้วยใน file tiapp.xml ครับ
<android xmlns:android="http://schemas.android.com/apk/res/android"/>
<manifest>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.FLASHLIGHT"/>
</manifest>
</android>

หลังจาก Coding เสร็จแล้วก็ ทดลองรันดูครับ บน Emulator หรือ บนเครื่องก็ได้นะครับ  ก็ จะได้ Application ที่สามารถเปิดดู Gallery ได้แบบง่าย ๆ แล้วครับ สำหรับบทความนี้ก็ขอจบลงตรงนี้ก่อนนะครับ บทความต่อไปจะเป็นเรื่องเกี่ยวกับอะไรนั้น ติดตามกันต่อไปนะครับ ท่านใดมีข้อคิดเห็นหรือข้อติชมสามารถ comment ได้นะครับ แล้วก็ อย่าลืมกด Like Fanpage ด้วยนะครับ

1 ความคิดเห็น: