การใช้งาน Tab Group เพื่อเปิด Window ใหม่ (เฉพาะ iOS)

หลังจากที่เราได้รู้จักกับ Navigator Group และ Tab Group  ไปแล้ว แต่สิ่งหนึ่งที่ผมยังไม่ได้นำเสนอไปคือ การใช้ Tab Group เพื่อเปิด Window อีก window นึง นั่นเองครับ ซึ่งลักษณะการทำงานของ Navigator Group ที่อยู่ใน Tab Group นั้นก็จะเหมือนกับ Navigator Group ธรรมดา ๆ ครับ วิธีการก็ไม่ยากครับ





ก่อนอื่น เราก็ต้องมี Tab Group ครับ โดยผมเอา Code ในบทความ Tab Group มาใช้ต่อเลยนะครับ เราจะต้องเพิ่ม Code ลงไปนิดหน่อยโดยการเพิ่ม event ให้กับ TabGroup โดยเพิ่มที่ event focus ครับ
tabGroup.addEventListener('focus',function(e){ Titanium.UI.currentTab = e.tab; });
จากนั้นก็ทำการเพิ่ม window เข้าไปอีก 1 อันครับ
var window = Titanium.UI.createWindow({ backgroundColor : '#ff0' });
และเพิ่ม ปุ่ม เข้าไปใน Win1 เพื่อใช้เปิด Window ใหม่นี้ครับ
var button = Titanium.UI.createButton({ title : 'Open New Window', width : 200, height : 50, top : 50 }); win1.add(button);
ก็จะได้ แบบนี้


หลังจากนั้นทำการ สร้าง event ให้กับปุ่มครับ
button.addEventListener(‘click’,function(){ Titanium.UI.currentTab.open(window); });
เมื่อเรากดที่ปุ่ม  Tab Group ก็จะเปิด Window อีกอันนึงขึ้นมาครับ ดังภาพ


จะเห็นได้ว่า ปุ่ม Back นั้น ถูกสร้างขึ้นมาโดยอัตโนมัติ แต่ก็จะเหมือนกับ Navigator Group ที่จะ สร้างขึ้นตาม Title ของ หน้าจอก่อนหน้า หากต้องการเปลี่ยนก็ ให้ใส่ Property : backButtonTitle ลงไปใน window ใหม่ แบบนี้
var window = Titanium.UI.createWindow({ backgroundColor : '#ff0', backButtonTitle : 'Back' });
เท่านี้ก็จะได้ ปุ่ม Back ในแบบที่คุณต้องการแล้วหล่ะครับ

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

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