Java

การใช้งาน Drawing tiger in native gui ในภาษา Java แบบง่ายๆ พร้อมตัวอย่าง

การทำงานกับโปรแกรมกราฟิกเบื้องต้นในภาษา Java ผ่าน Native GUI (Graphical User Interface) เป็นสิ่งที่นักพัฒนาซอฟต์แวร์ควรมีความรู้เบื้องต้น เพราะมันช่วยให้เราเข้าใจถึงการจัดการกับวาดภาพ และการควบคุมรูปภาพในแอปพลิเคชันได้ดีขึ้น ในบทความนี้ ผมจะยกตัวอย่างการวาดภาพเสือ (Tiger) ที่เรียบง่ายบน Java GUI พร้อมกับการให้ข้อมูลเชิงลึกเกี่ยวกับการทำงานของโค้ด ท่ามกลางโลกโปรแกรมมิ่งที่ท้าทาย การศึกษาและพัฒนาฝีมือกับ EPT จะช่วยทำให้คุณมีพื้นฐานที่มั่นคง และพร้อมเผชิญกับอาชีพในฝันได้อย่างง่ายดาย

ตัวอย่างโค้ด 1: การวาดภาพเสือพื้นฐาน

ในตัวอย่างแรก เราจะเริ่มจากการวาดภาพเสือที่เรียบง่ายบนกระดานวาดภาพ (Canvas) บน Java Swing ซึ่งเป็นหนึ่งในไลบรารี GUI ที่นิยมใช้กัน:

 import javax.swing.*;
import java.awt.*;

public class SimpleTigerDrawing extends JPanel {
    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        g.setColor(Color.ORANGE);
        g.fillOval(50, 50, 100, 100); // วาดหัวของเสือ
        g.setColor(Color.BLACK);
        g.drawOval(50, 50, 100, 100); // ขอบของหัวเสือ
        g.fillOval(80, 80, 10, 20); // ตาขวา
        g.fillOval(110, 80, 10, 20); // ตาซ้าย
        g.drawArc(85, 100, 30, 20, 0, 180); // ปาก
    }

    public static void main(String[] args) {
        JFrame frame = new JFrame("Simple Tiger Drawing");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.getContentPane().add(new SimpleTigerDrawing());
        frame.setSize(200, 200);
        frame.setVisible(true);
    }
}

ในโค้ดด้านบน เราสร้าง `JFrame` ที่มี `JPanel` แล้วโอเวอไรด์ `paintComponent` เพื่อวาดรูปทรงต่างๆ ที่เป็นส่วนประกอบของภาพเสือ ใช้ `fillOval` เพื่อวาดรูปวงกลมที่เป็นหัวเสือ และ `drawArc` เพื่อวาดปากของเสือ

ตัวอย่างโค้ด 2: เพิ่มความเจาะจงของสีและลายเสือ

เมื่อเรามีพื้นฐานการวาดรูปแล้ว ก็สามารถเริ่มเพิ่มความเจาะจงของรายละเอียดต่างๆ เช่น สีและลายของเสือได้:

 // ... [ส่วนแรกของโค้ดให้เหมือนตัวอย่างแรก]

    @Override
    protected void paintComponent(Graphics g) {
        // ... [ต้นของเมธอดให้เหมือนตัวอย่างแรก]

        // เพิ่มลายเสือ
        g.setColor(Color.BLACK);
        g.drawOval(70, 70, 15, 15); // ลายเสือด้านขวา
        g.drawOval(115, 70, 15, 15); // ลายเสือด้านซ้าย
    }

ตัวอย่างโค้ด 3: การจัดการกับ Event เพื่อทำ Interaction

ในตัวอย่างที่สาม เราจะทำให้เสือของเรามีปฏิสัมพันธ์กับผู้ใช้งานเมื่อคลิกที่พื้นที่ของภาพเสือ:

 import java.awt.event.*;

// ... [นำโค้ดจากตัวอย่างแรก และส่วนแรกของตัวอย่างที่สองมาใช้]

public class InteractiveTigerDrawing extends SimpleTigerDrawing {
    public InteractiveTigerDrawing() {
        this.addMouseListener(new MouseAdapter() {
            public void mouseClicked(MouseEvent e) {
                System.out.println("Roar! You clicked on the tiger!");
            }
        });
    }

    public static void main(String[] args) {
        JFrame frame = new JFrame("Interactive Tiger Drawing");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.getContentPane().add(new InteractiveTigerDrawing());
        frame.setSize(200, 200);
        frame.setVisible(true);
    }
}

กับตัวอย่างโค้ดข้างต้น, `MouseListener` ถูกเพิ่มใน `JPanel` เพื่อให้สามารถตอบสนองเมื่อมีการคลิกที่จุดใดจุดหนึ่งในภาพเสือ ทำให้เกิดการสื่อสารกับผู้ใช้งาน

Usecase ในโลกจริง

การวาดภาพเสือใน GUI อาจไม่ได้มีความจำเป็นโดยตรงกับแอปพลิเคชันทุกประเภท แต่หลักการในการจัดการกับกราฟิกและอินเทอร์เฟสเป็นสิ่งที่สำคัญโดยเฉพาะเมื่อมาถึงด้านการเรียนการสอนหรือการสร้างเกมซึ่งต้องการ Interaction จากผู้เล่น นอกจากนี้ หลักการพื้นฐานของการจัดการกับ GUI ยังสามารถนำไปใช้กับการสร้างแอปพลิเคชันพื้นฐาน การออกแบบโปรแกรมจำลองสถานการณ์ หรือแม้กระทั่งโปรแกรมการศึกษาที่ต้องการแสดงผลด้วยไม่เพียงแค่ข้อความแบบสแตติก แต่มีส่วนประกอบที่เคลื่อนไหวได้

และหากคุณสนใจในการเรียนรู้การพัฒนาโปรแกรมเพิ่มเติมด้วยภาษา Java หรือต้องการเจาะจงไปยังการพัฒนา GUI ที่สมบูรณ์ยิ่งขึ้น EPT มีหลักสูตรที่มุ่งเน้นทักษะที่จำเป็น พร้อมรับรองว่าคุณจะได้พบกับการเรียนรู้ที่เต็มไปด้วยความสนุกสนาน และรู้สึกถึงความก้าวหน้าในทุกๆขั้นตอนของการเป็นนักพัฒนาซอฟต์แวร์ คว้าโอกาสนี้แล้วพัฒนาความสามารถของคุณไปกับเราที่ EPT วันนี้!

หมายเหตุ: ข้อมูลในบทความนี้อาจจะผิด โปรดตรวจสอบความถูกต้องของบทความอีกครั้งหนึ่ง บทความนี้ไม่สามารถนำไปใช้อ้างอิงใด ๆ ได้ ทาง EPT ไม่ขอยืนยันความถูกต้อง และไม่ขอรับผิดชอบต่อความเสียหายใดที่เกิดจากบทความชุดนี้ทั้งทางทรัพย์สิน ร่างกาย หรือจิตใจของผู้อ่านและผู้เกี่ยวข้อง

Tag ที่น่าสนใจ: java การเขียนโปรแกรม การวาดภาพ native_gui การทำงานกับกราฟิก การจัดการกับ_gui การสร้างแอปพลิเคชัน การจัดการกับ_event การปรับแต่งสี การสร้างลายเสือ การตอบสนองเมื่อคลิก การทำ_interaction การพัฒนาซอฟต์แวร์ การเรียนการสอน การเรียนรู้_java

บทความนี้อาจจะมีที่ผิด กรุณาตรวจสอบก่อนใช้

หากมีข้อผิดพลาด/ต้องการพูดคุยเพิ่มเติมเกี่ยวกับบทความนี้ กรุณาแจ้งที่ http://m.me/Expert.Programming.Tutor

ไม่อยากอ่าน Tutorial อยากมาเรียนเลยทำอย่างไร?

สมัครเรียน ONLINE ได้ทันทีที่ https://elearn.expert-programming-tutor.com

หรือติดต่อ

085-350-7540 (DTAC)
084-88-00-255 (AIS)
026-111-618
หรือทาง EMAIL: NTPRINTF@GMAIL.COM

แผนที่ ที่ตั้งของอาคารของเรา

EXPERT-PROGRAMMING-TUTOR
รับสอนเขียนโปรแกรมคอมพิวเตอร์

Java

การใช้งาน Drawing tiger in native gui ในภาษา Java แบบง่ายๆ พร้อมตัวอย่าง

ตัวอย่างโค้ด 1: การวาดภาพเสือพื้นฐาน

ตัวอย่างโค้ด 2: เพิ่มความเจาะจงของสีและลายเสือ

ตัวอย่างโค้ด 3: การจัดการกับ Event เพื่อทำ Interaction

Usecase ในโลกจริง

บทความนี้อาจจะมีที่ผิด กรุณาตรวจสอบก่อนใช้

ไม่อยากอ่าน Tutorial อยากมาเรียนเลยทำอย่างไร?

สมัครเรียน ONLINE ได้ทันทีที่ https://elearn.expert-programming-tutor.com

หรือติดต่อ

แผนผังการเรียนเขียนโปรแกรม

Link อื่นๆ

ติดต่อเราได้ที่

EXPERT-PROGRAMMING-TUTOR รับสอนเขียนโปรแกรมคอมพิวเตอร์

Java

การใช้งาน Drawing tiger in native gui ในภาษา Java แบบง่ายๆ พร้อมตัวอย่าง

ตัวอย่างโค้ด 1: การวาดภาพเสือพื้นฐาน

ตัวอย่างโค้ด 2: เพิ่มความเจาะจงของสีและลายเสือ

ตัวอย่างโค้ด 3: การจัดการกับ Event เพื่อทำ Interaction

Usecase ในโลกจริง

บทความนี้อาจจะมีที่ผิด กรุณาตรวจสอบก่อนใช้

ไม่อยากอ่าน Tutorial อยากมาเรียนเลยทำอย่างไร?

สมัครเรียน ONLINE ได้ทันทีที่ https://elearn.expert-programming-tutor.com

หรือติดต่อ

แผนผังการเรียนเขียนโปรแกรม

Link อื่นๆ

ติดต่อเราได้ที่

EXPERT-PROGRAMMING-TUTOR
รับสอนเขียนโปรแกรมคอมพิวเตอร์