การใช้ ScrollableView

Scrollable  View คือ Container สำหรับจัดเก็บ View เพื่อแสดงในรูปแบบของ Paging เพื่อให้เห็นภาพได้ง่าย ๆ ให้นึกถึง Photo Gallery ใน โทรศัพท์​ของพวกเรา ครับ เอาหล่ะครับ เราไปเริ่มกันดีกว่าครับ ว่า มันใช้งานอย่างไร

เริ่มต้นก็​ทำการสร้าง ScrollableView ขึ้นมาก่อนเลยครับ
var scrollableView = Ti.UI.createScrollableView({ width: Ti.Platform.displayCaps.platformWidth, height:'auto', showPagingControl:true });
เมื่อสร้างเสร็จแล้วก็ ทำการสร้าง View ภายในกันครับ
var view1 = Ti.UI.createView({ backgroundColor:'#123', width:Ti.Platform.displayCaps.platformWidth, height:Ti.Platform.displayCaps.platformHeight }); var view2 = Ti.UI.createView({ backgroundColor:'#456', width:Ti.Platform.displayCaps.platformWidth, height:Ti.Platform.displayCaps.platformHeight }); var view3 = Ti.UI.createView({ backgroundColor:'#789', width:Ti.Platform.displayCaps.platformWidth, height:Ti.Platform.displayCaps.platformHeight });
หลังจากได้ View แล้วก็​นำเข้า ScrollableView ด้วยคำสั่งนี้ครับ
scrollableView.addView(view1); scrollableView.addView(view2); scrollableView.addView(view3);
จากนั้นก็ นำ Scollableview ไปใส่ใน window แล้วทดลองรันดู ก็ จะได้ ดังภาพ
เป็นอย่างไรกันบ้างครับ Scrollable View ไม่ยากเลยนะครับ ในบทความต่อ ๆ ไปจะ กล่าวถึงเรื่องอะไร ลองติดตามกันต่อไปนะครับ ยังงัยก็​อย่าลืม กด Like Fanpage และ Join Titanium Mobile Group ด้วยนะครับ

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

แสดงความคิดเห็น