Java 圖形化介面設計（GUI）實戰練習（程式碼）
阿新 • • 發佈：2018-12-25
關於Java圖形化介面設計，基礎知識網上可搜，下面簡單介紹一下重點概念，然後就由淺入深程式碼例項。
程式是為了方便使用者使用的，Java引入圖形化介面程式設計。
1.JFrame 是容器類
2.AWT 是抽象視窗元件工具包，是 Java 最早的用於編寫圖形節目應用程式的開發包。
3.Swing 是為了解決 AWT 存在的問題而新開發的包，它以 AWT 為基礎的。
程式碼例項1：
package com.zhouzhou;
//練習網格佈局
import java.awt.*;
import javax.swing.*;
public class Demo9 extends JFrame {
// 定義元件
int size = 9;
JButton jbs[] = new JButton[size];
public static void main(String[] args) {
// 建立例項
Demo9 de = new Demo9();
}
// 建構函式
public Demo9() {
// 建立元件
for (int i = 0; i < size; i++) {
jbs[i] = new JButton(String.valueOf(i));
}
// 設定網格佈局,這裡只有前兩個引數（行/列）3和3 的話，網格沒有空隙
this.setLayout(new GridLayout(3, 3, 10, 10));
// 新增元件
for (int i = 0; i < size; i++) {
this.add(jbs[i]);
}
// 設定窗體屬性
this.setTitle("網格佈局案例");
this.setSize(300, 400);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setLocation(200, 200);
// 顯示
this.setVisible(true);
}
}
程式碼例項2：
package com.zhouzhou;
import java.awt.*;
import javax.swing.*;
public class Demo10 extends JFrame {
// 定義元件
JPanel jp1, jp2;
JButton jb1, jb2, jb3, jb4, jb5, jb6;
public static void main(String[] args) {
// TODO Auto-generated method stub
Demo10 de = new Demo10();
}
// 建構函式
public Demo10() {
// 建立元件
jp1 = new JPanel();
jp2 = new JPanel();
jb1 = new JButton("西瓜");
jb2 = new JButton("蘋果");
jb3 = new JButton("荔枝");
jb4 = new JButton("葡萄");
jb5 = new JButton("桔子");
jb6 = new JButton("香蕉");
// 設定佈局管理器，
//JPanel佈局預設是BorderLoyout// 新增JPanel
//JPanel屬於容器類元件，可以加入別的元件
jp1.add(jb1);
jp1.add(jb2);
jp2.add(jb3);
jp2.add(jb4);
jp2.add(jb5);
// 把jpanel 加入JFrame
this.add(jp1, BorderLayout.NORTH);
this.add(jb6, BorderLayout.CENTER);
this.add(jp2, BorderLayout.SOUTH);
this.setSize(300, 400);
this.setLocation(200, 200);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項3：
package com.zhouzhou;
import java.awt.*;
import javax.swing.*;
public class Demo11 extends JFrame {
// 定義元件
JPanel jp1, jp2, jp3;
JLabel jlb1, jlb2;
JButton jb1, jb2;
JTextField jtf1;
JPasswordField jpf1;
public static void main(String[] args) {
// TODO Auto-generated method stub
Demo11 d1 = new Demo11();
}
// 建構函式
public Demo11() {
jp1 = new JPanel();
jp2 = new JPanel();
jp3 = new JPanel();
jlb1 = new JLabel("使用者名稱");
jlb2 = new JLabel("密 碼");
jb1 = new JButton("登入");
jb2 = new JButton("取消");
jtf1 = new JTextField(10);
jpf1 = new JPasswordField(10);// 設定佈局管理(上面忘記：extends JFrame，這裡出錯了)
this.setLayout(new GridLayout(3, 1));
// 加入各個元件
jp1.add(jlb1);
jp1.add(jtf1);
jp2.add(jlb2);
jp2.add(jpf1);
jp3.add(jb1);
jp3.add(jb2);
// 加入到JFrame
this.add(jp1);
this.add(jp2);
this.add(jp3);
this.setSize(250, 150);
this.setTitle("登入");
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項4：
package com.zhouzhou;
import java.awt.*;
import javax.swing.*;
public class Demo12 extends JFrame {
// 定義元件
JPanel jp1, jp2, jp3;
JLabel jlb1, jlb2;
JCheckBox jcb1, jcb2, jcb3;
JRadioButton jrb1, jrb2;
JButton jb1, jb2;
// 單選設定
ButtonGroup bg, bg2;
public static void main(String[] args) {
// TODO Auto-generated method stub
Demo12 d2 = new Demo12();
}
// 建構函式
public Demo12() {
jp1 = new JPanel();
jp2 = new JPanel();
jp3 = new JPanel();
jlb1 = new JLabel("你喜歡的運動");
jlb2 = new JLabel("你的性別");
jcb1 = new JCheckBox("足球");
jcb2 = new JCheckBox("籃球");
jcb3 = new JCheckBox("網球");
// 下面可以設定單選
// ButtonGroup bg2=new ButtonGroup();
// bg2.add(jcb1);
// bg2.add(jcb2);
// bg2.add(jcb2);
jrb1 = new JRadioButton("男");
jrb2 = new JRadioButton("女");
// 一定要把jrb1，jrb2放入到一個ButtonGroup裡面
ButtonGroup bg = new ButtonGroup();
bg.add(jrb1);
bg.add(jrb2);
jb1 = new JButton("註冊使用者");
jb2 = new JButton("取消使用者");
this.setLayout(new GridLayout(3, 1));
jp1.add(jlb1);
jp1.add(jcb1);
jp1.add(jcb2);
jp1.add(jcb3);
jp2.add(jlb2);
jp2.add(jrb1);
jp2.add(jrb2);
jp3.add(jb1);
jp3.add(jb2);
// 加入到JFrame
this.add(jp1);
this.add(jp2);
this.add(jp3);
this.setSize(300, 200);
this.setTitle("使用者註冊介面");
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項5：
package com.zhouzhou;
import java.awt.*;
import javax.swing.*;
public class Demo13 extends JFrame {
// 定義元件
JPanel jp1, jp2;
JLabel jlb1, jlb2;
JComboBox jcb1;
JList jl1;
JScrollPane jsp;
public static void main(String[] args) {
// TODO Auto-generated method stub
Demo13 d3 = new Demo13();
}
public Demo13() {
jp1 = new JPanel();
jp2 = new JPanel();
jlb1 = new JLabel("您的籍貫是");
jlb2 = new JLabel("您喜歡旅遊的地區");
String[] jg = { "北京", "上海", "天津", "重慶", "江蘇" };
jcb1 = new JComboBox(jg);
String[] jg2 = { "故宮", "長城", "九寨溝", "天安門", "火星" };
jl1 = new JList(jg2);
// 設定你希望顯示多少個選項
jl1.setVisibleRowCount(1);
jsp = new JScrollPane(jl1);
// 佈局管理
this.setLayout(new GridLayout(3, 1));
// 新增元件
jp1.add(jlb1);
jp1.add(jcb1);
jp2.add(jlb2);
jp2.add(jsp);
this.add(jp1);
this.add(jp2);
this.setSize(300, 400);
this.setTitle("下拉框練習");
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項6：
package com.zhouzhou;
import java.awt.*;
import javax.swing.*;
public class Demo14 extends JFrame {
// 定義元件
JSplitPane jsp;
JList jList;
JLabel jl1;
public static void main(String[] args) {
// TODO Auto-generated method stub
Demo14 d4 = new Demo14();
}
public Demo14() {
// 建立元件
String[] words = { "boy", "gril", "bird", "box" };
jList = new JList(words);
// JLabel可以放置圖片
jl1 = new JLabel(new ImageIcon("images/1.jpeg"));
// 拆分窗格
jsp = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT, jList, jl1);
// 可以手動伸縮變化
jsp.setOneTouchExpandable(true);
// 設定佈局管理器，它本身就是borderLayout佈局，就不用再設定了
// 新增元件
this.add(jsp);
this.setSize(400, 300);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項7：
package com.zhouzhou;
import java.awt.*;
import javax.swing.*;
public class Demo15 extends JFrame {
// 定義元件
JTextArea jta = null;// 多行文字框
JScrollPane jsp = null;
JPanel jp1 = null;// 面板
JComboBox jcb = null;// 下拉框元件
JTextField jtf = null;// 文字框
JButton jb = null;
public static void main(String[] args) {
// TODO Auto-generated method stub
Demo15 d5 = new Demo15();
}
// 建構函式
public Demo15() {
// 多行文字框會根據情況自己調節大小
jta = new JTextArea();
jsp = new JScrollPane(jta);
jp1 = new JPanel();
String j2[] = { "北京", "商行", "農行", "師大", "附中", "哈爾濱" };
jcb = new JComboBox(j2);
// 文字框最好設定初值
jtf = new JTextField(10);
jb = new JButton("傳送");
// 佈局管理
// this.setLayout(new GridLayout(1, 1));
// 新增
jp1.add(jcb);
jp1.add(jtf);
jp1.add(jb);
// 多行文字框是放在這裡(JFrame)的!!!
// 因為上面又新增可以滾動的功能,這裡傳入jsp，而不是jta
this.add(jsp);
// 下面這裡就需要定位處理
this.add(jp1, BorderLayout.SOUTH);
// 設定窗體屬性,z這裡很厲害!!
this.setIconImage((new ImageIcon("images\\3.jpg")).getImage());
this.setSize(300, 200);
this.setTitle("QQ登入");
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項8：
package com.zhouzhou;
//QQ登入介面製作
import java.awt.*;
import javax.swing.*;
public class Demo16 extends JFrame {
// 北部區域
JLabel jl1;
// 南部區域
JButton jb1, jb2, jb3;
JPanel jp1;
// 中部區域
JTabbedPane jtp;// 選項卡窗格
JPanel jp2, jp3, jp4;
JLabel jl2, jl3, jl4, jl5;
// 號碼輸入文字框
JTextField jtf;
// 密碼
JPasswordField jpf;
// 清除號碼
JButton jb4;
// 隱身登入、記住密碼
JCheckBox jcb1, jcb2;
public static void main(String[] args) {
// TODO Auto-generated method stub
new Demo16();
}
public Demo16() {
// 建立元件
jl2 = new JLabel("QQ號碼", JLabel.CENTER);
jl3 = new JLabel("QQ密碼", JLabel.CENTER);
jl4 = new JLabel("忘記密碼", JLabel.CENTER);
jl4.setFont(new Font("宋體", Font.PLAIN, 16));// 設定字型樣式
jl4.setForeground(Color.BLUE);// 設定字型顏色
jl5 = new JLabel("<html><a href='www.qq.com'>申請密碼保護</a></html>");
// 滑鼠觸發變化
jl5.setCursor(Cursor.getPredefinedCursor(Cursor.HAND_CURSOR));
jtf = new JTextField();
jpf = new JPasswordField();
jb4 = new JButton(new ImageIcon("images\\login.png"));
jcb1 = new JCheckBox("隱身登入");
jcb2 = new JCheckBox("記住密碼");
// 北部區域
jl1 = new JLabel(new ImageIcon("images\\headpicture.jpg"));
// 南部區域
jp1 = new JPanel();
jb1 = new JButton(new ImageIcon("images\\login.png"));
jb2 = new JButton(new ImageIcon("images\\delete.png"));
jb3 = new JButton(new ImageIcon("images\\register.png"));
// 中部區域
jtp = new JTabbedPane();
jp2 = new JPanel();
jp3 = new JPanel();
jp3.setBackground(Color.RED);// 給面板設定背景
jp4 = new JPanel();
jp4.setBackground(new Color(0, 0, 255));
// 將面板新增到選項卡窗格上
jtp.add("QQ號碼", jp2);// 引數：選項卡名稱，面板
jtp.add("手機號碼", jp3);
jtp.add("電子郵箱", jp4);
// 設定佈局
jp2.setLayout(new GridLayout(3, 3));
// 新增元件
jp1.add(jb1);
jp1.add(jb2);
jp1.add(jb3);
jp2.add(jl2);
jp2.add(jtf);
jp2.add(jb4);
jp2.add(jl3);
jp2.add(jpf);
jp2.add(jl4);
jp2.add(jcb1);
jp2.add(jcb2);
jp2.add(jl5);
this.add(jp1, BorderLayout.SOUTH);
this.add(jl1, BorderLayout.NORTH);
this.add(jtp, BorderLayout.CENTER);
// 展示元件
ImageIcon icon = new ImageIcon("images\\qq.png");
this.setIconImage(icon.getImage());// 給窗體設定圖示方法
this.setSize(400, 380);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
程式碼例項9：
按 Ctrl+C 複製程式碼
按 Ctrl+C 複製程式碼
