การใช้ ScrollableView
Scrollable View คือ Container สำหรับจัดเก็บ View เพื่อแสดงในรูปแบบของ Paging เพื่อให้เห็นภาพได้ง่าย ๆ ให้นึกถึง Photo Gallery ใน โทรศัพท์ของพวกเรา ครับ เอาหล่ะครับ เราไปเริ่มกันดีกว่าครับ ว่า มันใช้งานอย่างไร
เริ่มต้นก็ทำการสร้าง ScrollableView ขึ้นมาก่อนเลยครับ
เมื่อสร้างเสร็จแล้วก็ ทำการสร้าง View ภายในกันครับ
หลังจากได้ View แล้วก็นำเข้า ScrollableView ด้วยคำสั่งนี้ครับ
จากนั้นก็ นำ Scollableview ไปใส่ใน window แล้วทดลองรันดู ก็ จะได้ ดังภาพ
เริ่มต้นก็ทำการสร้าง 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 ความคิดเห็น:
แสดงความคิดเห็น