Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,027

HOME > Java Programming > Java GUI สอน Java GUI เขียนโปรแกรม GUI ด้วย Java(Swing/AWT/JFC) > Eclipse : สร้าง Java GUI ด้วย WindowBuilder Designer ช่วยสร้าง GUI ได้ง่ายสุด ๆ



Clound SSD Virtual Server

Eclipse : สร้าง Java GUI ด้วย WindowBuilder Designer ช่วยสร้าง GUI ได้ง่ายสุด ๆ

Eclipse : เขียน Java GUI ด้วย WindowBuilder Designer ช่วยสร้าง GUI ได้ง่ายสุด ๆ ตามทีได้เกรินไว้ในบทความก่อนหน้านี้ว่าภาษา Java โปรแกรมมิ้ง สามารถพัฒนาโปรแกรมได้หลากหลายมาก ขึ้นอยู่กับว่าวัถุประสงค์เราจะใช้ทำอะไร และถ้าพูดถึง GUI (Graphic User Interface) เราคงจะนึกถึงโปรแกรมสมัยก่อน ๆ อย่างเช่น VB6 ที่ใช้สร้าง Form บน Windows หรือในปัจจุบันก็ VB.Net แบบ Windows Application ที่รันบน Windows และหลาย ๆ คนคงจะคุ้นมันดี แล้ว Java ทำแบบนั้นได้หรือไม่ ??? คำตอบก็คือ ได้สบาย ๆ เพราะใน Java จะมี Library หรือ Class ที่ใช้สำหรับการสร้าง Interface นี้อยู่แล้ว หลัก ๆ ก็ได้แต่ Swing (javax.swing) และ AWT (java.awt) และอื่น ๆ และภายใน Class ก็จะมี GUI แยกย่อยไปอีกมากหลากหลาย ซึ่งจะยังไม่พูดถึงรายละเอียดลงลึกว่ามันใช้งานอย่างไรบ้าง แต่ให้รู้ว่าเจ้า Class ทั้ง 2 ตัวนี้ เป็น Class ไว้สำหรับการสร้าง User Interface แบบ Windows Form แต่มันไม่ได้รันได้ในเฉพาะบน Windows เท่านั้น เพราะสามารถใช้ได้ทั้งบน Windows , Mac OS และก็พวก Linux ที่เป็น Desktop ทั้งหลาย

Java GUI WindowBuilder

Java GUI (ตัวอย่าง GUI Form ที่รันบน Windows Desktop)


แล้วการเขียน GUI ด้วย Java จะต้องทำอย่างไร ???
ปกติแล้วเราสามารถเรียกใช้งาน Class ของ java.awt และ javax.swing ได้ทันที และเราสามารถเขียนผ่าน Syntax ของ Java ผ่าน Eclipse หรือ Netbeans แล้วรันเพื่อแสดงผล GUI ที่ต้องการ เช่น

import javax.swing.*;

public class MyClass extends JFrame {

	public static void main(String[] args) {
		myClass frameTabel = new myClass();
	}

	JLabel welcome = new JLabel("Welcome to ThaiCreate.Com");
	JPanel panel = new JPanel();

	MyClass() {
		super("ThaiCreate.Com Tutorial Java");
		setSize(300, 200);
		setLocation(500, 280);
		panel.setLayout(null);

		welcome.setBounds(70, 50, 150, 60);

		panel.add(welcome);

		getContentPane().add(panel);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		setVisible(true);
	}

}


Screenshot

Java GUI WindowBuilder

ตัวอย่างผลลัพธ์ที่ได้จาก Code ที่เขียนด้านบน

จาก Code จะเห็นว่ากว่าที่เราจะต้องเขียน Code ต่าง ๆ มากมายกว่าที่จะได้ Form ขั้นมา 1 Form ซึ่งเป็นขั้นตอนที่ยากกว่าจะได้ Form ที่เราต้องการ แต่การเขียนจริง ๆ เราไม่จำเป็นจะต้องเขียน Code ด้วยตัวเอง เพราะจะมีเครื่องมือ Plugin ที่ช่วยออกแบบ Form ต่าง ๆ (ให้นึกถึงพวก Visual Studio ที่มี Toolbox ต่าง ๆ เช่น Textbox , Label และอื่น ๆ ) รวมทั้งยังสามารถสร้าง Event ต่างได้อย่างง่ายดาย

ทำอย่างไรถึงจะสามารถสร้าง GUI ด้วย Toolbox ??
ปกติแล้วถ้าเราเขียนด้วย Netbeans จะมีเครื่องมือสำหรับการสร้าง GUI มาเป็นค่า Default อยู่แล้ว แต่ในกรณีที่ใช้ Eclipse จะต้องใช้ WindowBuilder ซึ่งเป็น Plugin สำหรับโปรแกรม Eclipse และจะต้องทำการติดตั้งตัว WindowBuilder ลงบน Eclipse ให้เรียบร้อยซะก่อน ก่อนที่จะสามารถใช้งานได้

การสร้าง Java GUI ด้วย Netbeans สร้าง Application แบบ Graphic แบบง่าย ๆ


ตัวอย่างเครื่องมือของ WindowBuilder Plugin บน Eclipse

Java GUI WindowBuilder

ตัวอย่าง Form และ GUI ในการออกแบบ Form

Java GUI WindowBuilder

การสร้าง Event ได้แบบง่าย ๆ โดยไม่ต้องมาเขียน Code เอง








Java GUI WindowBuilder

เครื่องมือ Containers , Layouts , Structs & Springs

Java GUI WindowBuilder

เครื่องมือ Components , Swing Action และ Menu

Java GUI WindowBuilder

เครื่องมือ AWT Components , JGoodies

Java GUI WindowBuilder

มี Properties และอื่น ๆ เหมือนกับการเขียนโปรแกรมบนพวก Visual Studio


การติดตั้ง WindowBuilder Plugin บน Eclipse สำหรับตัวนี้จะเป็นการติดตั้งบน Eclipse เท่านั้น ถ้าใช้โปรแกรม Netbeans สามารถเรียกใช้งานได้ทันที ตาม Link ที่ได้แปะไว้ก่อนหน้านี้แล้ว และสำหรับโปรแกรม Eclipse แนะนำให้ใช้รุ่น Indigo , Helios และ Galileo อ่านเพิ่มเติม Version ได้ที่นี่

WindowBuilder Plugin for Eclipse


Java GUI WindowsBuilder

สำหรับผมเลือกใช้ Indigo

Java GUI WindowsBuilder

คลิกที่เมนู Help -> Install New Software

Java GUI WindowsBuilder

เลือก Add..

Java GUI WindowsBuilder

ช่อง Name ให้หรอก WindowsBuilder ส่วน URL ให้กรอกตาม Link ของรุ่นของ Eclipse (จาก Link ที่ได้แนะนำไว้)

เช่น

Eclipse 3.7 (Indigo)
http://dl.google.com/eclipse/inst/d2wbpro/latest/3.7

Eclipse 3.6 (Helios)
http://dl.google.com/eclipse/inst/d2wbpro/latest/3.6

Eclipse 3.5 (Galileo)
http://dl.google.com/eclipse/inst/d2wbpro/latest/3.5

ในปัจจุบันอาจจะมีการเปลี่ยนลิ้งค์แล้ว แนะนำให้คลิกเพื่อดู Version ล่าสุด

Java GUI WindowsBuilder

เลือก All

Java GUI WindowsBuilder

เลือก Next

Java GUI WindowsBuilder

เลือก I accept... และ Next ตามลำดับ

Java GUI WindowsBuilder

กำลังติดตั้ง

Java GUI WindowsBuilder

ขั้นตอนนี้ให้เลือก OK เพื่อยืรยันการทำต่อ

Java GUI WindowsBuilder

จากนั้นโปรแกรมจะให้ Restart ตัว Eclipse ซะ 1 ครั้ง

เพียงเท่านี้เราก็จะสามารถออกแบบ GUI บนโปรแกรม Eclipse ได้อย่างง่ายดาย ซึ่งได้เขียนตัวอย่างการสร้าง Java Project และการสร้าง GUI ไว้ในบทความถัดไป









การสร้าง Java GUI Application ด้วยโปรแกรม Eclipse IDE แบบง่าย ๆ


   
Share


ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท


ลองใช้ค้นหาข้อมูล


   


Bookmark.   
       
  By : ThaiCreate.Com Team (บทความเป็นลิขสิทธิ์ของเว็บไทยครีเอทห้ามนำเผยแพร่ ณ เว็บไซต์อื่น ๆ)
  Score Rating :  
  Create/Update Date : 2013-08-06 16:44:04 / 2017-03-27 17:20:45
  Download : No files
 Sponsored Links / Related

 
รู้จักกับ Java GUI วิธีการสร้าง GUI ทำความรู้จัก Swing GUI และ AWT GUI (JFC)
Rating :

 
Netbeans : สร้าง Java GUI ด้วย Netbeans สร้าง Application แบบ Graphic แบบง่าย ๆ
Rating :


ThaiCreate.Com Forum


Comunity Forum Free Web Script
Jobs Freelance Free Uploads
Free Web Hosting Free Tools

สอน PHP ผ่าน Youtube ฟรี
สอน Android การเขียนโปรแกรม Android
สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8
สอน iOS การเขียนโปรแกรม iPhone, iPad
สอน Java การเขียนโปรแกรม ภาษา Java
สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI
สอน JSP การเขียนโปรแกรม ภาษา Java
สอน jQuery การเขียนโปรแกรม ภาษา jQuery
สอน .Net การเขียนโปรแกรม ภาษา .Net
Free Tutorial
สอน Google Maps Api
สอน Windows Service
สอน Entity Framework
สอน Android
สอน Java เขียน Java
Java GUI Swing
สอน JSP (Web App)
iOS (iPhone,iPad)
Windows Phone
Windows Azure
Windows Store
Laravel Framework
Yii PHP Framework
สอน jQuery
สอน jQuery กับ Ajax
สอน PHP OOP (Vdo)
Ajax Tutorials
SQL Tutorials
สอน SQL (Part 2)
JavaScript Tutorial
Javascript Tips
VBScript Tutorial
VBScript Validation
Microsoft Access
MySQL Tutorials
-- Stored Procedure
MariaDB Database
SQL Server Tutorial
SQL Server 2005
SQL Server 2008
SQL Server 2012
-- Stored Procedure
Oracle Database
-- Stored Procedure
SVN (Subversion)
แนวทางการทำ SEO
ปรับแต่งเว็บให้โหลดเร็ว


Hit Link
   







Load balance : Server 05
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่