การใช้ Alert Dialog
จากที่ผ่าน ๆ มานั้นเราได้เรียนรู้วิธีการเขียนโปรแกรมเพื่อสร้าง UI ต่าง ๆ ไปแล้ว และในบทความนี้จะกล่าวถึง สิ่งที่เอาไว้โต้ตอบ เตือน หรือ สอบถาม กับผู้ใช้ ซึ่งนั่นก็คือ Dialog ซึ่ง Dialog ที่เราจะกล่าวถึงใน บทความนี้ก็คือ Alert Dialog นั่นเองครับ
เราสามารถทำการแสดง Dialog ประเภทนี้ได้ด้วยคำสั่งต่อไปนี้ครับ
เรามาดู Property ที่เราอาจจะได้ใช้งานกันบ่อย ๆ นะครับ
จาก Property ข้างต้นอาจจะไม่เห็นภาพ ถ้าอย่างนั้นเราสร้างมันขึ้นมาเลยดีกว่าครับ
เมื่อเรียบร้อยแล้วก็ สั่งให้มันแสดงครับ โดยใช้คำสั่ง
ก็จะได้ตามรูปครับ
ส่วนในกรณีที่ต้องการให้โปรแกรมทำอะไรเพิ่มเติมหลังจากการกดปุ่ม ก็สามารถที่จะเขียน addEventListener เพิ่มจับ event click ได้ครับ ด้วยคำสั่งต่อไปนี้ครับ
วันนี้คงต้องขอจบเพียงเท่านี้ก่อนครับ แต่บทความความต่อไป จะเป็นเรื่องเกี่ยวกับ Dialog อีกประเภทหนึ่งที่ ถูกเรียกใช้ค่อนข้างบ่อยไม่แพ้ Alert Dialog จะเป็นอย่างไรน้ัน ติดตามกันต่อในบทความหน้า ส่วนในบทความนี้ หากมีอะไรผิดพลาด ก็ขออภัยมา ณ ที่นี้ด้วยนะครับ ขอบคุณครับ
Alert Dialog |
เราสามารถทำการแสดง Dialog ประเภทนี้ได้ด้วยคำสั่งต่อไปนี้ครับ
var altDialog = Titanium.UI.createAlertDialog({
message:'Hello from Alert Dialog',
buttonNames:['Ok']
});
เรามาดู Property ที่เราอาจจะได้ใช้งานกันบ่อย ๆ นะครับ
- message ชื่อก็บอกกันตรง ๆ แล้วครับ มันคือ ข้อความที่จะให้แสดงอยู่บน Dialog นั่นเอง ครับ
- title อันนี้จะเป็นส่วนที่เอาไว้แสดงด้านบนของ message อีกที่ครับ
- buttonNames เป็นส่วนที่เอาไว้กำหนดปุ่มที่เราจะเอาไว้แสดงเช่น OK , Cancel
- androidView เป็น View ที่เอาไว้ แสดงตามที่เราต้องการสามารถนำเอา object ต่าง ๆ มาใส่ได้ เหมือน View ตัวนึงครับ **** เฉพาะ Android เท่านั้น
- ok ใช้สำหรับระบุตำแหน่งของ ปุ่ม ok
- cancel ใช้สำหรับระบุุตำแหน่งของปุ่ม Cancel
จาก Property ข้างต้นอาจจะไม่เห็นภาพ ถ้าอย่างนั้นเราสร้างมันขึ้นมาเลยดีกว่าครับ
var altDialog = Titanium.UI.createAlertDialog({
title : 'Title' ,<
message : 'message' ,
buttonNames : ['OK','Cancel'],
ok : 0 ,
cancel : 1
});
เมื่อเรียบร้อยแล้วก็ สั่งให้มันแสดงครับ โดยใช้คำสั่ง
altDialog.show();
ก็จะได้ตามรูปครับ
ส่วนในกรณีที่ต้องการให้โปรแกรมทำอะไรเพิ่มเติมหลังจากการกดปุ่ม ก็สามารถที่จะเขียน addEventListener เพิ่มจับ event click ได้ครับ ด้วยคำสั่งต่อไปนี้ครับ
altDialog.addEventListener('click',function(e)
{
//// ระบุสิ่งที่ต้องการให้ โปรแกรมทำงาน
});
วันนี้คงต้องขอจบเพียงเท่านี้ก่อนครับ แต่บทความความต่อไป จะเป็นเรื่องเกี่ยวกับ Dialog อีกประเภทหนึ่งที่ ถูกเรียกใช้ค่อนข้างบ่อยไม่แพ้ Alert Dialog จะเป็นอย่างไรน้ัน ติดตามกันต่อในบทความหน้า ส่วนในบทความนี้ หากมีอะไรผิดพลาด ก็ขออภัยมา ณ ที่นี้ด้วยนะครับ ขอบคุณครับ
0 ความคิดเห็น:
แสดงความคิดเห็น