พื้นฐานการพัฒนาแอพแบบโต้ตอบกับผู้ใช้งาน Android Studio

จากเนื้อหาตอนแรก ทีมีการแนะนำการสร้างแอพง่ายๆ แบบหน้าเดียวหรือ Single page นั้น สำหรัการพัฒนาในเนื้อหาต่อๆไป จะเป็น การเพิ่มการพัฒนาในส่วนที่เป็นการโต้ตอบกับผู้ใช้งาน เช่น การเพิ่มช่อง ใส่ข้อมูล และปุ่มคำสั่การทำงาน หรือ ประมวลผล เป็นต้น
ซึ่งในเนื้อหานี้ จะเกี่ยวข้องกับการศึกษาและทำความเข้าใจกับ หน้าต่างกิจกรรมหลักของแอพ ที่เรียกกันว่า Main Activity ซึ่งโปรแกรม Android Studio จะสร้าง Code ภาษา Java ให้กับเราในส่วนนี้
การพัฒนาในขั้นตอนนี้ จะมีความน่าสนใจ และความท้าทายมากกว่า การพัฒนาแบบเบสิก ที่ยังไม่มีการโต้ตอบกับผู้ใช้งานได้นั้นเอง
โดยหลักแล้ว ก็จะมีแอพที่ใช้งานทั่วไป จะประกอบกันเป็นหน้าหลัก หน้ารอง ซึ่งเชื่อมโยง และลงรายละเอียด ที่สัมพันธ์และเชื่อมโยงกัน คล้ายๆ กับการสร้างลิงค์ในการออกแบบเว็บไซต์
สิ่งที่ต้องทำคือ การออบแบบขั้นตอน ว่าต้องการอะไร จากหน้าแรก ไปหน้าสอง หน้าสาม และ หน้าต่อๆไป
สำหรับการออกแบบขั้นตอน แนะนำให้เขียนเป็นผังลำดับ ลงในหน้ากระดาษ จะช่วยให้เกิดความคิด และไม่ลืมขั้นตอนได้
สำหรับขั้นตอนนี้ จะเป็นการแนะนำ Code ภาษา Java ซึ่งจะมีการนำมาพัฒนาและใช้งานควบคู่ไปกับภาษา XML ในการพัฒนาแอพ
สำหรับคนที่ยังไม่มีพื้นฐานภาษา Java แรกๆ ก้อาจจะงงๆ และไม่คุ้นเคยมากนัก ก้ค่อยๆ ลองศึกษา และพยายามทำความเข้าใจ จากบนพื้นฐานและ รหัสที่ง่ายๆ ไปก่อน แน่นอนว่า เมื่อผ่านไปสักระยะ ก็จะเริ่มเข้าใจได้ดีขึ้น แน่ๆ
ขอแค่อย่าพึงท้อไปเสียก่อน




ตัวอย่าง Code

android:layout_width="wrap_content"
android:text="Order"
android:layout_marginTop="16dp"
android:onClick="submitOrder"
android:layout_height="wrap_content" />

จากตัวอย่างจะเห็นว่ามีรหัสโค้ด ปุ่มทำงาน ที่สามารถประมวลผลการทำงานได้ (อักษรสีแดง)
หลักการทำงาน เมื่อปุ่มหน้าจอ ถูก กด จะไปเรียกคำสั่งทำงาน ที่อยู่อีกไฟล์หนึ่ง เป็นรหัสภาษาแบบ java

/**
* This method is called when the order button is clicked.
*/
public void submitOrder(View view) {
display(1);

}

จะเห็นว่าภาษาจาว่า จะมีกฏการเขียน เริ่มต้นด้วย เครื่องหมาย Curly brackets or braces
เครื่องหมายวงเล็บปีกกา เปิด และปิด

โดยย่อ จะมีการสร้างเมธอด เมื่อปุ่มถุกกด ขึ้นมา จากนั้นก็จะมีการเขียนโค้ดเพื่อประกาศเมธอด หรือว่า Declare method เพื่อแสดงผลข้อมูลบนหน้าจอ

/**
* This method displays the given quantity value on the screen.
*/
private void display(int number) {
TextView quantityTextView = (TextView) findViewById(R.id.quantity_text_view);
quantityTextView.setText("" + number);

}

ผลการทำงาน ก็จะได้แสดงผล เป็น เลข 1
display(1);

ถ้าเราลองทดสอบเปลี่ยนเป็นตัวเลขอื่นๆ แล้วลองทดสอบบนหน้าจอมือถือ 
ลองใช้ Math expression เช่น 2*2 ถ้ากดปุ่มจะได้ =4 เป็นต้น
หรือจะลองใส่ เป็น 18*3 + 5 ก็สามารถลองใส่โจทย์เลข เพื่อคำนวนได้ เช่นกัน 
ดูเพิ่มเติม เกี่ยวกับตัวสั่งทำงานตัวเลขในภาษา Java 

https://docs.oracle.com/javase/tutorial/java/nutsandbolts/opsummary.html

Post a Comment