ขอกลับมาสู่บทความพื้นฐานสำหรับมือใหม่กันหน่อยนะครับ โดยจะเป็นเรื่องของการใช้ Intent นี่แหละ แต่ว่าจะละเอียดเสียหน่อย เพราะว่าบทความเรื่องนี้มีแต่ผู้ที่หลงเข้ามาอ่านที่หัดเขียนมาอ่าน ดังนั้นก็เลยทำบทความแบบทีละขั้นตอนอย่างละเอียดให้เลย
ก่อนอื่นขอพูดคร่าวๆก่อนเลยเกี่ยวกับ Activity ของแอนดรอยด์ Activity ก็เปรียบเสมือนหน้าหนึ่งหน้าในแอปพลิเคชันนั้นๆ ถ้าต้องการให้แอปพลิเคชันสามหน้า ก็จะมี Activity สามตัว (จริงๆแล้ว จำนวนหน้าก็ไม่ได้ขึ้นอยู่กับจำนวน Activity หรอก แต่ในกรณีที่ผู้ที่หลงเข้ามาอ่านยังเป็นมือใหม่ ให้เข้าใจแบบนี้ไปก่อน)
• สร้าง Layout ของหน้าที่สองขึ้นมาก่อน โดยคลิกขวาที่โฟลเดอร์ res/layout แล้วเลือก New > Other...
• จะมีหน้าต่าง New แสดงขึ้นมา ให้เลือก Android XML Layout File แล้วกด Next >
• ต่อมาก็จะเป็นการกำหนดชื่อของไฟล์ Layout และรูปแบบของ Layout หลัก ตัวอย่างนี้เจ้าของบล็อกจะตั้งชื่อไฟล์ว่า second_page.xml และกำหนดให้ใช้ Layout เป็น Relative Layout แล้วกดปุ่ม Finish
หมายเหตุ - เงื่อนไขในการตั้งชื่อของไฟล์ Layout คือ ต้องเป็นตัวพิมพ์เล็กและต้องขึ้นต้นด้วยตัวอักษรก่อนเท่านั้น ขึ้นต้นด้วยตัวเลขไม่ได้
• Layout ใหม่ก็จะถูกเพิ่มเข้ามาแล้ว ทีนี้เจ้าของบล็อกก็ลาก Text View มาใส่ไว้ตรงกลางจอ โดยกำหนดข้อความที่แสดงว่า Second Page เวลาทดสอบจะได้รู้ว่ากำลังแสดงหน้าไหนอยู่นั่นเอง
หมายเหตุ - เงื่อนไขในการตั้งชื่อไฟล์ Java คือขึ้นต้นด้วยตัวอักษรพิมพ์ใหญ่
• ทีนี้ไฟล์ Second.java ก็จะแสดงขึ้นมาให้เขียนโค๊ดลงไป โดยในนี้เอาไว้เขียนคำสั่งเพื่อควบคุมแอปพลิเคชันหน้าที่สอง
• ในการสร้าง Activity ใหม่ทุกครั้ง ไฟล์ Java ที่สร้างขึ้นมาต้องมีการสืบทอดคลาส Activity ตลอด ทำได้โดยการพิมต่อท้ายชื่อคลาสไปว่า extends Activity (เพราะไฟล์ Java ไม่ได้สร้างขึ้นมาเพื่อ Activity เสมอไป อาจจะสร้างมาเพื่ออย่างอื่น การที่จะรู้ว่าอันไหนเป็น Activity ก็ดูได้จากการสืบทอดคลาสนี่ล่ะว่ามาจาก Activity หรือป่าว) จะเห็นว่ามีเออเรอเป็นขีดเส้นใต้สีแดงใต้คำว่า Activity
• แต่ยังขาดอีกคำสั่งหนึ่งอยู่ คือคำสั่ง setContentView ซึ่งเป็นคำสั่งกำหนดว่าจะให้ Activity ใช้ไฟล์ Layout อันไหน ถ้าไม่กำหนดด้วยคำสั่งนี้ โค๊ดในไฟล์ Java นี้ก็จะไม่รู้ว่าตัวมันเองใช้กับ Layout ไฟล์ไหน จึงต้องกำหนดให้มันรู้ด้วย
หมายเหตุ - ไฟล์ XML ที่เป็น Layout และไฟล์ Java ที่เป็น Activity ไม่จำเป็นต้องชื่อเหมือนกันก็ได้ เพราะมันก็ไม่รู้อยู่แล้วว่าทำงานร่วมกัน ยังไงผู้เขียนก็ต้องเป็นคนกำหนดเองอยู่ดีว่าไฟล์ไหนทำงานร่วมกัน แต่ในการตั้งชื่อให้ใกล้เคียงกัน ก็มีไว้เพื่อให้ผู้เขียนโค๊ดจำได้ง่าย
• ทีนี้เจ้าของบล็อกกลับมาเปิดดูไฟล์ Main.java ดูบ้าง ซึ่งไฟล์นี้เจ้าของบล็อกได้กำหนดเป็น Activity ตัวแรก ตั้งแต่ตอนสร้างโปรเจคนี้ขึ้นมาแล้ว หรือก็คือหน้าแรกสุดนั่นเอง
หมายเหตุ - ตอนสร้างโปรเจคใหม่จะมีให้กำหนดชื่อ Activity ตัวแรก ถ้าไม่ได้แก้ไขชื่อก็จะเป็น MainActivity.java นั่นแหละ พอดีเจ้าของบล็อกไปแก้ให้เป็นชื่อ Main แทน
• จะเห็นว่าโค๊ดใน Activity ตัวแรกจะถูกเตรียมมาในระดับหนึ่งแล้ว เจ้าของบล็อกก็จะลบบางบรรทัดออกไปเพราะไม่ได้ใช้ เพื่อให้โค๊ดดูรวบรัดมากที่สุด จะได้ดูได้ง่ายขึ้น
• ทีนี้กลับมาที่ไฟล์ Java สำหรับหน้าแรก (ของเจ้าของบล็อกเป็น Main.java นะ) แล้วเพิ่มคำสั่งเพื่อควบคุม Button เข้าไปดังนี้
Button button = (Button)findViewById(R.id.buttonSecond);
ข้อความตรงคำว่า buttonSecond ก็คือขึ้นอยู่กับว่าผู้ที่หลงเข้ามาอ่านกำหนดชื่อ ID ให้กับ Button ว่าอะไร
• แล้วก็รวบรัดคำสั่งให้สั้นลงหน่อย ที่สำคัญอย่าลืมกดเซฟด้วย ไม่งั้นโปรแกรมจะแจ้งเออเรออยู่
คำสั่ง setOnClickListener เป็นการกำหนดว่าจะให้ทำอะไรเมื่อผู้ใช้กดปุ่ม โดยคำสั่งที่จะกำหนดว่าจะให้ทำอะไรบ้าง จะใส่ไว้ภายในฟังก์ชัน onClick
• สำหรับการกำหนดให้แอปพลิเคชันเปลี่ยนจากหน้านึงไปแสดงอีกหน้านึง บนแอนดรอยด์จะเรียกกันว่า Intent เพราะจะใช้คลาส Intent ในการกำหนด โดยจะมีการเรียกใช้งานคลาส Intent เพื่อไปยังอีกหน้าดังนี้
Intent i = new Intent(getApplicationContext(), Second.class);
ให้สังเกตุที่ Second คงเดากันไม่ยากนะว่าทำไมต้องกำหนดเป็น Second ก็เพราะว่าจะให้ไปยัง Activity ที่ชื่อว่า Second นั่นเอง
• ถึงจะประกาศ Intent เรียบร้อยแล้ว แต่ใช่ว่าจะทำงานได้ทันที เพราะคลาส Intent เอาไว้กำหนดค่าเท่านั้น แต่เวลาจะเปิด Activity อีกหน้าหนึ่งให้ใช้คำสั่ง ดังนี้
startActivity(Intent);
ใน Intent ที่เป็นตัวอักษรสีแดงก็คือคลาส Intent ที่จะกำหนด จากบรรทัดก่อนหน้าที่สร้างคลาส Intent ไว้แล้วโดยกำหนดชื่อไว้ว่า i ดังนั้นก็เอา i มากำหนดในพารามิเตอร์ของคำสั่งนี้ได้เลย
เมื่อกดปุ่ม Second เพื่อจะไปหน้าที่สองจะพบว่าแอพเด้ง
เวลาแอพเด้งเจ้าของบล็อกจะบอกทุกคนเสมอว่าไม่ว่าแอพจะเด้งตอนไหนหรือยังไง ให้ไปดูที่ Log Cat เท่านั้น ถ้ายังไม่เคยใช้มาก่อนให้ไปอ่านบทความนี้ดู [Android Code] LogCat พื้นฐานการพัฒนา Application
เวลาแอพเด้งเจ้าของบล็อกจะบอกทุกคนเสมอว่าไม่ว่าแอพจะเด้งตอนไหนหรือยังไง ให้ไปดูที่ Log Cat เท่านั้น ถ้ายังไม่เคยใช้มาก่อนให้ไปอ่านบทความนี้ดู [Android Code] LogCat พื้นฐานการพัฒนา Application
ทีนี้เมื่อแอพเด้ง ก็ให้ไปเช็คที่ Log Cat เลยจะเห็นเออเรอประมาณนี้
Log จะบอกให้เห็นว่า have you declared this activity in your AndroidManifest.xml? หมายความว่าคุณได้ประกาศ Activity ตัวนี้ไว้ใน AndroidManifest.xml แล้วหรือยัง
นอกจากการสร้าง Layout และ Java สำหรับ Activity หนึ่งตัวนั้น จะต้องไปประกาศเพิ่มไว้ในไฟล์ AndroidManifest.xml ด้วย เพื่อให้แอปพลิเคชันรู้ว่าไฟล์ใดเป็น Activity บ้าง
• ให้เปิดไฟล์ AndroidManifest.xml ของโปรเจคขึ้นมา
• เปิดไปที่แท็บ Application
• เลื่อนลงมาข้างล่างสุด จะเห็นช่อง Application Nodes อยู่ ในนี้จะเอาไว้เพิ่ม Activity ที่สร้างขึ้นมา และกำหนดคุณสมบัติต่างๆได้ ในตัวอย่างนี้ก็เอาแค่เพิ่ม Activity ที่สร้างใหม่เข้ามาละกัน ให้กดปุ่ม Add...
• จะมีหน้าต่างแสดงขึ้นมาให้เลือก Activity แล้วกด OK
• จะเห็นว่ามีโหนด Activity เพิ่มเข้ามา ทีนี้ก็ต้องกำหนดให้กับมันว่าเป็น Activity ของอันไหน โดยที่ช่องขวามือในแถว Name กดที่ปุ่ม Browse...
Log จะบอกให้เห็นว่า have you declared this activity in your AndroidManifest.xml? หมายความว่าคุณได้ประกาศ Activity ตัวนี้ไว้ใน AndroidManifest.xml แล้วหรือยัง
นอกจากการสร้าง Layout และ Java สำหรับ Activity หนึ่งตัวนั้น จะต้องไปประกาศเพิ่มไว้ในไฟล์ AndroidManifest.xml ด้วย เพื่อให้แอปพลิเคชันรู้ว่าไฟล์ใดเป็น Activity บ้าง
• ให้เปิดไฟล์ AndroidManifest.xml ของโปรเจคขึ้นมา
• เปิดไปที่แท็บ Application
• เลื่อนลงมาข้างล่างสุด จะเห็นช่อง Application Nodes อยู่ ในนี้จะเอาไว้เพิ่ม Activity ที่สร้างขึ้นมา และกำหนดคุณสมบัติต่างๆได้ ในตัวอย่างนี้ก็เอาแค่เพิ่ม Activity ที่สร้างใหม่เข้ามาละกัน ให้กดปุ่ม Add...
• จะมีหน้าต่างแสดงขึ้นมาให้เลือก Activity แล้วกด OK
• จะเห็นว่ามีโหนด Activity เพิ่มเข้ามา ทีนี้ก็ต้องกำหนดให้กับมันว่าเป็น Activity ของอันไหน โดยที่ช่องขวามือในแถว Name กดที่ปุ่ม Browse...
• จะมีหน้าต่างแสดงขึ้นมาให้รอซักพักก็จะมีชื่อ Activity ที่สร้างไว้แสดงขึ้นมา ก็ให้เลือกอันที่ต้องการแล้วกด OK ในตัวอย่างนี้ก็คือ Second นั่นเอง
• จะเห็นว่ากำหนดเป็น Second เรียบร้อยแล้ว แต่ยังลืมไปอีกอย่างหนึ่งคือให้สังเกตุที่ช่องซ้ายมือจะเห็นว่าโหนด Activity ยังไม่เปลี่ยนชื่อตาม ทั้งนี้ก็เพราะว่ายังไม่ได้กดเซฟนั่นเอง กดเซฟซะ!!
• กรณีที่แก้ไขแบบโค๊ด XML ก็แค่เพิ่มแท็ก Activity เข้าใจตามนี้ แต่ถ้าไม่ถนัดโค๊ด XML ก็ใช้วิธีก่อนหน้านี้จะดีกว่า
• ลองรันบนเครื่องดูใหม่อีกรอบจะเห็นว่าทำงานได้ตามปกติแล้ว ถ้ายังมีอะไรเออเรออยู่ก็แปลว่าผิดไปซักขั้นตอนแล้วล่ะ ให้ทวนใหม่อีกครั้ง
การกลับไปหน้าก่อนหน้า
ขอเน้นเป็นหัวข้อหน่อยละกัน ถ้าผู้ที่หลงเข้ามาอ่านเข้าใจในการใช้ Intent แล้ว ทีนี้ถ้าเจ้าของบล็อกถามว่า ต้องการให้หน้าสองกลับมาหน้าแรกได้ล่ะ? ก็คงจะเดากันต่อได้ไม่ยาก แต่ถ้ายังนึกไม่ออกก็แปลว่ายังไม่เข้าใจพอ
• ก่อนอื่นก็เริ่มจากการเพิ่มปุ่มย้อนกลับในหน้าที่สองก่อน
• โดยกำหนดชื่อ ID ว่า buttonBack และแสดงข้อความว่า Back
• จากนั้นก็มาที่หน้าโค๊ดของหน้าที่สอง ซึ่งก็คือไฟล์ Second.java นั่นเอง
• จะเห็นว่ากำหนดเป็น Second เรียบร้อยแล้ว แต่ยังลืมไปอีกอย่างหนึ่งคือให้สังเกตุที่ช่องซ้ายมือจะเห็นว่าโหนด Activity ยังไม่เปลี่ยนชื่อตาม ทั้งนี้ก็เพราะว่ายังไม่ได้กดเซฟนั่นเอง กดเซฟซะ!!
• กรณีที่แก้ไขแบบโค๊ด XML ก็แค่เพิ่มแท็ก Activity เข้าใจตามนี้ แต่ถ้าไม่ถนัดโค๊ด XML ก็ใช้วิธีก่อนหน้านี้จะดีกว่า
• ลองรันบนเครื่องดูใหม่อีกรอบจะเห็นว่าทำงานได้ตามปกติแล้ว ถ้ายังมีอะไรเออเรออยู่ก็แปลว่าผิดไปซักขั้นตอนแล้วล่ะ ให้ทวนใหม่อีกครั้ง
การกลับไปหน้าก่อนหน้า
ขอเน้นเป็นหัวข้อหน่อยละกัน ถ้าผู้ที่หลงเข้ามาอ่านเข้าใจในการใช้ Intent แล้ว ทีนี้ถ้าเจ้าของบล็อกถามว่า ต้องการให้หน้าสองกลับมาหน้าแรกได้ล่ะ? ก็คงจะเดากันต่อได้ไม่ยาก แต่ถ้ายังนึกไม่ออกก็แปลว่ายังไม่เข้าใจพอ
• ก่อนอื่นก็เริ่มจากการเพิ่มปุ่มย้อนกลับในหน้าที่สองก่อน
• โดยกำหนดชื่อ ID ว่า buttonBack และแสดงข้อความว่า Back
• จากนั้นก็มาที่หน้าโค๊ดของหน้าที่สอง ซึ่งก็คือไฟล์ Second.java นั่นเอง
• ประกาศ Button ที่ได้สร้างขึ้นเมื่อกี้ใน Layout และกำหนดให้เรียกใช้ OnClickListener
มาถึงตรงนี้แล้ว เจ้าของบล็อกขอถามผู้ที่หลงเข้ามาอ่านก่อนว่าควรจะใส่คำสั่งอะไรใน onClick เพื่อให้หน้าที่สองย้อนกลับไปหน้าแรกได้?
.
โปรดนึกคำตอบไว้ในใจก่อนจะเลื่อนลงไป
มาถึงตรงนี้แล้ว เจ้าของบล็อกขอถามผู้ที่หลงเข้ามาอ่านก่อนว่าควรจะใส่คำสั่งอะไรใน onClick เพื่อให้หน้าที่สองย้อนกลับไปหน้าแรกได้?
.
โปรดนึกคำตอบไว้ในใจก่อนจะเลื่อนลงไป
.
.
.
.
.
.
.
.
.
.
ถ้าผู้ที่หลงเข้ามาอ่านตอบว่า ก็ใช้ Intent กำหนดให้กลับไปหน้าแรก เจ้าของบล็อกก็ดีใจด้วยนะครับ เพราะสามารถต่อยอดเองได้แล้ว แต่ถ้ายังตอบไม่ได้เจ้าของบล็อกก็เสียใจนะครับ เพราะหมายความว่าผู้ที่หลงเข้ามาอ่านไม่ได้เข้าใจที่ผ่านๆมาเลย แนะนำให้กลับไปอ่านใหม่แล้วพยายามทำความเข้าใจให้ได้นะครับ
.
.
.
.
.
.
.
.
.
ถ้าผู้ที่หลงเข้ามาอ่านตอบว่า ก็ใช้ Intent กำหนดให้กลับไปหน้าแรก เจ้าของบล็อกก็ดีใจด้วยนะครับ เพราะสามารถต่อยอดเองได้แล้ว แต่ถ้ายังตอบไม่ได้เจ้าของบล็อกก็เสียใจนะครับ เพราะหมายความว่าผู้ที่หลงเข้ามาอ่านไม่ได้เข้าใจที่ผ่านๆมาเลย แนะนำให้กลับไปอ่านใหม่แล้วพยายามทำความเข้าใจให้ได้นะครับ
สำหรับผู้ที่หลงเข้ามาอ่านตอบว่า Intent นั้น เจ้าของบล็อกบอกได้ว่า ถูกต้องครับ แต่ไม่ได้ถูกต้องที่สุด
ให้สังเกตที่คำสั่ง startActivity ดูนะ ชื่อคำสั่งมันก็บอกอยู่แล้วว่า Start Activity ซึ่งเป็นการสร้าง Activity ขึ้นมาใหม่ จึงไม่ใช่การปิดหน้าที่สองลงแล้วย้อนกลับไปหน้าแรกที่เคยเปิด แต่จะเป็นการเปิดหน้าใหม่ไปเรื่อยๆ ทำให้เปิดหลาย Activity ซ้อนๆกันไป
เพิ่มเติม - ก็คือ ถ้ากดปุ่ม Second เพื่อเปิดหน้าสอง และที่หน้าสองกดปุ่ม Back ไปเรื่อยๆ ก็จะเป็นการเปิดหน้าใหม่ขึ้นมาเรื่อยๆ ดูจากภาพจะเห็นว่าเปิดซ้อนกันถึง 6 หน้าด้วยกัน ถ้าลองกดปุ่ม Back (ปุ่มที่อยู่บนตัวเครื่อง ไม่ใช่ปุ่มที่สร้างขึ้นมาเอง) จะพบว่าต้องย้อนกลับไปถึง 6 หน้าเพื่อที่จะปิดแอพลงได้
การกดแล้วเปิดหน้าสอง โดยใช้ Intent และ startActivity นั้นเป็นวิธีที่ถูกต้อง แต่การทำให้ย้อนกลับด้วย Intent และ startActivity นั้นไม่ถูกต้องซักเท่าไร จริงๆแล้วแค่ใช้คำสั่งให้หน้าที่สองปิด Activity ตัวเองก็พอ พอมันปิดตัวเองแล้ว มันก็จะย้อนกลับไปหน้าก่อนหน้าที่ Intent มาให้โดยอัตโนมัติ
สำหรับคำสั่งปิด Activity นั้นๆ จะใช้คำสั่งว่า finish();
เท่านี้ก็เป็นอันเสร็จสมบูรณ์แล้ว
ถ้าต้องการนำไปประยุกต์ใช้หลายๆหน้า และแต่ละหน้าก็มีหน้าย่อยลงไปอีก ให้ผู้ที่หลงเข้ามาอ่านเขียนแผนผังก่อนว่าไปหน้าอื่นอะไรยังไง เพื่อให้สามารถเข้าใจการทำงานโดยรวมได้ ถ้าเขียนไม่ได้ก็จบ เพราะหมายความว่าไม่เข้าใจลำดับหน้าของแอพผู้ที่หลงเข้ามาอ่านเลย
ตัวอย่างแผนผังช่วยในการทำความเข้าใจในลำดับของแต่ละหน้า
เมื่อวาดแผนผังก็จะช่วยให้รู้ได้ว่าปุ่มไหนควรใช้ Intent ปุ่มไหนควรใช้คำสั่ง finish ซึ่งจะจัดการได้ง่ายมากขึ้น และพอเขียนจนชำนาญ ไม่ต้องเขียนแผนผังก็จะนึกภาพออกทันที
สำหรับบทความนี้เจ้าของบล็อกไม่แปะโค๊ดตัวอย่างให้นะ เพราะเป็นบทความที่โคตรพื้นฐานมากๆ เลยอยากให้ทำเองมากกว่า Intent - Simple [Google Drive]