ที่มาของบทความ: ผู้ที่ชื่นชอบคอมพิวเตอร์ ผู้แต่ง: Zhang Jian
คุณยังจำมินิคูเปอร์ที่สัญจรผ่านการจราจรฮอลลีวูดเหมือนเอลฟ์ใน "The Last Day" ได้ไหม? Mark Wahlberg และ Sally Theron ขับรถไปขนส่งทองคำมูลค่าหลายสิบล้านภายใต้จมูกของศัตรู อย่างไรก็ตาม หากร่างของมินิคูเปอร์ที่ไม่สามารถวิ่งได้เร็วมาวางตรงหน้าคุณตอนนี้ คุณจะคิดอย่างไร? ยังเป็นเอลฟ์พเนจรอยู่หรือเปล่า? วันนี้เรามาประกอบชิ้นส่วนของ Minicooper คันนี้ทีละชิ้นแล้วปล่อยให้มันทำงาน
คำนำ
จากปัญหานี้ เราจะมอบซอร์สโค้ดเกมฉบับสมบูรณ์ให้กับคุณ (คลิกเพื่อดาวน์โหลด) Java Cafe สนับสนุนให้ทุกคนให้ความสนใจกับทฤษฎีและการปฏิบัติเท่าเทียมกัน เราจะแนะนำเทคโนโลยีที่สำคัญและแนวคิดการใช้งานให้กับคุณในซีรีส์นี้ เพื่อนๆ สามารถอ่านซอร์สโค้ดร่วมกับบทความได้ เช่นเดียวกับการอ่านหนังสือพิมพ์และการดื่มกาแฟไปพร้อมๆ กัน เวลานี้กลิ่นหอมของ Didi ยังไม่หมดไป
เค้าโครงเกม
"Lianliankan" เป็นเกมหมากรุกสองมิติ หากคุณต้องการออกแบบเกมหมากรุก GridLayout ควรเป็นตัวเลือกที่ดีที่สุด ตอนนี้เรามาดู Constructor ของ GridLayout กัน:
・GridLayout(): ตามค่าเริ่มต้น พื้นที่เค้าโครงจะแบ่งออกเป็นขนาด 1*1
・GridLayout(int rows, int cols): ระบุจำนวนกริดแนวนอนและแนวตั้งในพื้นที่เค้าโครง
・GridLayout(int rows, int cols, int hgap, int vgap): เช่นเดียวกับด้านบน และยังระบุ hgap ระยะห่างแนวนอนและ vgap ระยะห่างแนวตั้งระหว่างแต่ละตาราง
อย่าปล่อยให้ตัวสร้างทั้งสามตัวนี้ทำให้คุณกลัว ที่จริงแล้ว ตราบใดที่คุณชอบ คุณสามารถใช้ตัวสร้างตัวใดตัวหนึ่งได้อย่างมั่นใจ แม้ว่าคุณจะใช้อันที่ "ผิด" โดยไม่ได้ตั้งใจ แต่ก็ยังมีวิธีปรับเปลี่ยนได้ในอนาคต สิ่งเดียวที่ควรทราบคือเมื่อเพิ่มการควบคุมให้กับ GridLayout ลำดับเริ่มต้นจะเรียงจากซ้ายบนไปขวาล่าง
ตอนนี้เรามากำหนดจำนวนกริดสำหรับเกมกันดีกว่า กี่กริดจึงเหมาะสม? น้อยเกินไปจะทำให้เกมมีความยากน้อยลง หากมากเกินไปจะส่งผลต่อการมองเห็น ดังนั้นเราจึงควรแสดงออกผ่านค่าคงที่คู่หนึ่งแม้ว่าเราจะต้องการแก้ไขมันในอนาคตก็จะเป็นเรื่องง่าย
ใน Java คำจำกัดความของค่าคงที่จะต้องเขียนในรูปแบบของ public Final static หากเรากำหนดว่าบอร์ดเกมมี 8 ตารางในแนวนอนและ 8 ตารางในแนวตั้ง เราควรกำหนดดังนี้:
int คงที่สาธารณะสุดท้าย ROW = 8;
สาธารณะสุดท้าย int int COLUMN = 8;
จากนั้นเราใช้ Constructor ตัวที่สองของ GridLayout เพื่อสร้างเค้าโครง:
GridLayout gridLayout = GridLayout ใหม่ (ROW, COLUMN);
สุดท้ายนี้ เรายังจำเป็นต้องเปลี่ยนเลย์เอาต์ของพื้นที่เกม (contentPanel) เป็นเลย์เอาต์ด้านบน:
contentPanel.setLayout(กริดเลย์เอาต์);
หากคุณคอมไพล์และรันโปรแกรมในเวลานี้ คุณอาจสงสัยว่า: เหตุใดอินเทอร์เฟซจึงไม่มีการเปลี่ยนแปลง มีอะไรผิดปกติหรือไม่? แม้ว่าเราจะระบุเค้าโครงแล้ว แต่ไม่มีการเพิ่มการควบคุม ดังนั้นแน่นอนว่าจะไม่สามารถมองเห็นการเปลี่ยนแปลงได้ ตอนนี้เรามาเพิ่มปุ่มให้กับเลย์เอาต์:
สำหรับ (int i = 0; i < ROW * COLUMN; i++) {
ปุ่ม JButton = JButton ใหม่ ("Kyodai");
contentPanel.add(ปุ่ม);
-
ลองรันโปรแกรมอีกครั้ง มันเหมือนกับของผมหรือเปล่า (ดูรูปที่ 1)
การใช้ JButton อย่างชาญฉลาดเพื่อสร้างความยุ่งยาก
JButton เป็นตัวควบคุมแบบปุ่ม นอกจากนี้ยังเป็นตัวควบคุมทั่วไปใน Swing อย่างไรก็ตาม เรายังต้องใช้ความพยายามเพียงเล็กน้อยในการทำความเข้าใจและใช้งาน เนื่องจากเมื่อคุณสามารถใช้ JButton ได้อย่างเชี่ยวชาญ คุณจะพบกับการควบคุมแบบ Swing อื่นๆ คล้ายกันมาก
หากคุณรันโปรแกรมที่คุณเพิ่งเขียน คุณจะพบว่าปุ่มต่างๆ ในพื้นที่เกมเต็มอยู่เสมอ ซึ่งไม่สะดวกอย่างยิ่งในการใช้งานเกมจริง ๆ ดังนั้นเราจึงต้องหาทางเพิ่มพื้นที่ว่างให้กับกริดบางส่วน เค้าโครง GridLayout นั้นดีทั้งหมด แต่คุณไม่สามารถข้ามตารางบางเส้นได้เมื่อเพิ่มการควบคุม ฉันควรทำอย่างไร?
อันที่จริงแล้ว นี่ไม่ใช่เรื่องยาก เนื่องจาก GridLayout ไม่อนุญาตให้ข้าม ถ้าเรารวมการควบคุมที่เพิ่มในตารางบางอย่างเข้ากับพื้นหลังของเค้าโครง GridLayout เราจะได้เอฟเฟกต์ภาพที่สม่ำเสมอ นอกจากนี้ หากมีบุคคลอื่นคลิกบนตารางนี้โดยไม่ได้ตั้งใจ ปุ่มจะยังคงปรากฏอยู่ เราต้องหาทางป้องกันไม่ให้มีการคลิกปุ่ม ซึ่งต้องใช้เมธอด setEnabled() ของ JButton สุดท้ายนี้ สำหรับปุ่มที่คลิกได้ เมื่อคลิกแล้ว เราต้องแยกแยะว่าปุ่มใดถูกคลิก
เมื่อเราใช้งานฟังก์ชัน "เกี่ยวกับ" ครั้งล่าสุด เราใช้เมธอด e.getSource() เพื่อระบุแหล่งที่มาของเหตุการณ์การคลิกเมาส์ อย่างไรก็ตาม วิธีนี้จะมีผลกับการควบคุมที่มีชื่อเท่านั้น ที่นี่ การใช้อาร์เรย์เพื่อแสดงปุ่มถือเป็นวิธีที่ดีที่สุดอย่างไม่ต้องสงสัย อันดับแรก ให้เราแก้ไขโค้ดด้านบน:
JButton[] dots = ใหม่ JButton[ROW * COLUMN];
สำหรับ (int i = 0; i < ROW * COLUMN; i++) {
จุด [i] = JButton ใหม่ ("Kyodai");
จุด[i].setActionCommand("" + i);
contentPanel.add(จุด[i]);
จุด [i] .addActionListener (สิ่งนี้);
-
อย่าลืมเขียน dots[i] = new JButton("Kyodai") ในส่วนเนื้อหาของลูป แม้ว่าหมายเลขกลุ่มจุดจะถูกกำหนดและใช้ก่อนหน้านี้ แต่สิ่งนี้จะบอกโปรแกรมว่าเราจำเป็นต้องใช้ JButton บางส่วนเท่านั้น แต่สิ่งเหล่านี้ JButtons ยังไม่ได้เตรียมใช้งาน ในเวลาเดียวกัน เราไม่เพียงแต่ใช้ setActionCommand() เพื่อระบุชื่อเหตุการณ์สำหรับปุ่มต่างๆ แต่ยังใช้เมธอด addActionListener() เพื่อเพิ่มการประมวลผลการตอบสนองเหตุการณ์ให้กับแต่ละปุ่มอีกด้วย
เกี่ยวกับโค้ดตอบกลับเหตุการณ์ เราสามารถเพิ่มไว้หลังโค้ดเหตุการณ์ actionPerformed() ดั้งเดิม:
ถ้า (e.getSource() อินสแตนซ์ของ JButton) {
ปุ่ม JButton = (JButton) e.getSource();
int offset = Integer.parseInt(button.getActionCommand());
แถว int, คอลัมน์;
แถว = Math.round (ออฟเซ็ต / คอลัมน์);
col = ออฟเซ็ต - แถว * COLUMN;
JOptionPane.showMessageDialog(นี่, "ROW="+row+", COL="
+ Col, "ปุ่ม", JOptionPane.INFORMATION_MESSAGE);
-
ในโค้ดด้านบน e.getSource() instance ของ JButton ใช้เพื่อตรวจสอบว่าเหตุการณ์ที่สร้างขึ้นถูกสร้างขึ้นโดยตัวควบคุมประเภท JButton หรือไม่ จากนั้นจึงทำการแปลงคลาสแบบบังคับบนตัวควบคุมที่สร้างแหล่งที่มาของเหตุการณ์ จากนั้นใช้ Integer.parseInt( ปุ่ม วิธีการ .getActionCommand()) จะแปลงชื่อเหตุการณ์ที่ได้รับให้เป็นจำนวนเต็ม และโค้ดต่อไปนี้จะคืนค่าจำนวนเต็มนี้เป็นข้อมูลแถวและคอลัมน์
เอาล่ะ ตอนนี้รันโปรแกรมแล้วคลิกปุ่มแต่ละปุ่มเพื่อดูว่ากล่องโต้ตอบแบบทางด้านขวาจะปรากฏขึ้นหรือไม่
โปรดทราบว่าตัวห้อยของเราเริ่มต้นจาก 0 ซอร์สโค้ดโปรแกรมของปัญหานี้ (คลิกเพื่อดาวน์โหลด)
การใช้ภาพในการสวิง
ปัจจุบันเราได้แก้ไขปัญหาการดำเนินงานของผู้ใช้แล้ว เพื่อให้อินเทอร์เฟซสวยงาม เราจำเป็นต้องใช้รูปภาพแทนข้อความ เพื่อนที่มีเวลาและความอดทนสามารถสร้างภาพส่วนตัวได้ด้วยตัวเอง แต่ต้องระวังขนาดของแต่ละภาพให้สม่ำเสมอ ไม่เช่นนั้นจะน่าเกลียดเกินไป หากคุณต้องการบันทึกปัญหา คุณสามารถใช้รูปภาพที่ให้มาในแพ็คเกจดาวน์โหลดได้โดยตรง
ใน Swing คุณสามารถใช้เมธอด setIcon (รูปภาพ) เพื่อตั้งค่ารูปภาพสำหรับ JButton อิมเมจพารามิเตอร์คือออบเจ็กต์รูปภาพที่เราต้องการตั้งค่า มีหลายวิธีในการรับออบเจ็กต์นี้:
・ใช้คลาส Toolkit เพื่อรับ:
รูปภาพ = Toolkit.getDefaultToolkit().getImage(url);
・ใช้เมธอด getImage() ของคลาส ImageIcon เพื่อรับ:
image = new ImageIcon(getClass().getResource(ชื่อไฟล์)).getImage();
เราเลือกวิธีแรกที่นี่ เพื่อที่จะอำนวยความสะดวกในการรับวัตถุ Image อีกครั้งในอนาคต เราสามารถเขียนสิ่งนี้เป็นฟังก์ชัน:
รูปภาพ getImage (ชื่อไฟล์สตริง) {
URLClassLoader urlLoader = (URLClassLoader) this.getClass().getClassLoader();
URL URL = null;
รูปภาพ รูปภาพ = null;
url = urlLoader.findResource (ชื่อไฟล์);
รูปภาพ = Toolkit.getDefaultToolkit().getImage(url);
กลับภาพ;
-
ด้วยฟังก์ชั่นนี้ การใช้รูปภาพในอนาคตจะสะดวกกว่ามากใช่ไหม?
เมื่อรูปภาพพร้อมใช้งานแล้ว เราก็สามารถแสดงข้อมูลแผนที่ใน Map.Java ในแพ็คเกจซอร์สโค้ดในรูปแบบของรูปภาพได้ เนื่องจากโค้ดนี้เป็นเรื่องเกี่ยวกับโค้ดอัลกอริทึมของเกม ฉันจะไม่แสดงรายการโค้ดอีกต่อไป เราจะมาอธิบายสั้นๆ ว่ามันทำอย่างไรที่นี่! ใน Map.Java เราใช้แผนที่อาร์เรย์สองมิติ[] เพื่อบันทึกข้อมูลรูปภาพ ในเวลาเดียวกัน เรายังใช้รูปภาพอาร์เรย์หนึ่งมิติ[] เพื่อบันทึกแต่ละองค์ประกอบในแผนที่ ค่านี้ไม่เพียงแต่ระบุค่าที่สอดคล้องกับปุ่มในอินเทอร์เฟซของเกม แต่ยังระบุจำนวนรูปภาพในอาร์เรย์รูปภาพ [] ที่ใช้โดยปุ่มนี้ อินเทอร์เฟซที่รันอยู่จะสวยงามมากขึ้น
สรุป
วันนี้เราแนะนำการควบคุม JButton ใน Swing สำหรับการควบคุม Swing ส่วนใหญ่ คุณสามารถคัดลอกการใช้งาน JButton ได้ อย่าดูถูกดูแคลน JButton นี้ เมื่อคุณเชี่ยวชาญมันได้ดี ทักษะการสวิงของคุณก็จะพัฒนาไปสู่ระดับที่สูงขึ้น นอกจากนี้เรายังได้เรียนรู้สองวิธีในการโหลดไฟล์รูปภาพใน Java ในที่สุด เราก็รวมสองส่วนข้างต้นเข้าด้วยกันเพื่อสร้างอินเทอร์เฟซเกมที่สวยงาม แม้ว่าฉันจะเขียนโค้ดไม่ครบถ้วนที่นี่ แต่ฉันเชื่อว่าทุกคนจะสามารถบรรลุเป้าหมายได้โดยการอ้างอิงถึงโปรแกรมต้นฉบับของฉันและผ่านความพยายามของคุณเอง หากคุณพบปัญหาที่ไม่สามารถแก้ไขได้ สามารถติดต่อฉันได้ที่ [email protected]
ฉันไม่รู้ว่าคุณพอใจกับเนื้อหาในวันนี้หรือไม่? ความตื่นเต้นยังมาไม่ถึง ทุกคนควรอุดหนุนร้านกาแฟของเราต่อไป!