1. 程式人生 > 其它 >Java圖形化設計

Java圖形化設計

Java圖形化設計

能夠實現圖形介面的類庫:

java.awt

javax.swing

使用方法

同其他包使用方法一樣

improt Java.awt.* ;

import javax.swing.* ;

關於兩種類庫的區別

java.awt 和 javax.swing,前者稱為抽象視窗工具庫 AWT(Abstract Windows Toolkit),後者是 Java 基礎類庫 JFC(Java Foundation Classes)的一個組成部分,它提供了一套功能更強、數量更多、更美觀的圖形使用者介面元件。Swing 元件名稱和 AWT 元件名稱基本相同,但以 J 開頭,例如 AWT 按鈕類的名稱是 Button,在 Swing 中的名稱則是 JButton。

在 java 中,AWT 包中的類是用 來處理圖形的最基本的方式,它是 Sun 公司早期所推出和使用的圖形元件包,其中的元件包含基本 GUI 元件類、容器類、佈局管理類,事件處理類和基本圖形類這五種。AWT 包中的元件被認為是重量級元件, AWT 在實際執行中是呼叫所在平臺的圖形系統,它們依賴於本地系統來支援繪圖與顯示,其執行速度慢效果差,系統相關性較強。在 1998 年 Sun Microsystem 推出 JDK1.2 版本時,新的 javax.Swing 包被增加 到 java 的基礎類庫中。

Swing 包可以認為是 AWT 包的升級。它不僅擁有幾倍於 AWT 包的使用者介面元件, 而且同樣的元件,Swing 包中的元件往往可設定屬性更多,功能更強大豐富。例如 Swing 包中按鈕(Button) 的功能較 AWT 包中的按鈕功能更加強大,包括給按鈕新增影象、使用快捷鍵以及設定按鈕的對齊方式, 還可以給按鈕加入圖片做背景。

Swing 採用 MVC(模型-檢視-控制)的設計正規化,使程式設計師可以根據不同的作業系統來選擇不同的外觀。 Swing 元件完全是用 Java 程式碼實現的,可以跨平臺,使用 Swing 元件的程式在 Mac、Windows 或 Unix 平 臺上的觀感都一樣。Swing 元件通常被稱為輕量級元件。程式設計過程中最好不要混用 Swing 元件和 AWT 元件,雖然有時候也可以同時用,但有可能在視覺效果和響應上造成不穩定隱患。

容器和佈局:

介面是需要有載體的。而“容器”是所有元件或容器的載體,是圖形使用者介面設計的基礎。圖形用 戶介面上所有的元素都要裝載在容器中。容器其實就是 Java 圖形介面開發包中的系統類,它們只是一類 比較特殊的圖形元件。它們在數量上基本上就只有幾個。

設計介面時,先要定義“容器”物件作為載體, 然後定義按鈕、輸入框之類的普通圖形介面元件物件,把這些元件物件新增(呼叫容器物件的 add 方法) 到容器上,才能構成介面。而這些元件放到容器上去之後,按什麼樣的格局、什麼樣的順序擺放,屬於 容器的“佈局”問題。

“佈局”是對容器而言的,是對放置到容器內的元件的一種位置的約束。給任何一 種容器物件設定佈局的方法都是呼叫該容器物件的 setLayout 方法,該方法需要帶相應的佈局類物件作 為引數。然後普通元件就會被按照這種佈局引數放到容器上顯示了。佈局常用的有五六種。

容器:

容器一般分為三類:頂層容器,中間層容器,其他基本元件

以Swing包舉例:

頂層容器:JFrame、JApplet、JDialog。

中間層容器:JPanel、JScrollPane、JSplitPane、JToolBar。

其它基本元件:JButton、JList、JTextField 等。

關於JFrame、JApplet、JDialog

JFrame 是窗體,例如一般的windows視窗

JApplet 是可以嵌在瀏覽器中顯示

JDialog 彈框窗體元件,多用於資訊提示,沒有最大化最小化按鈕,並且可以設定沒有關閉按鈕

package test_4;
import javax.swing.JFrame;
public class ABCDE{
	public static void main(String[] args) {
//		JFrame jf = new JFrame();
//		jf.setTitle("一拳打爆Java");
		JFrame jf = new JFrame("一拳打爆Java");		//這一行等同於上面兩行
		jf.setSize(400,400);	//設定大小
		jf.setVisible(true);	//沒有此行執行程式無法看見
	}
}

佈局:

  • FlowLayout 佈局:順序佈局,有時又稱流式佈局。使用該佈局時,容器上的元素會按容器顯示 時的大小,按照從左到右、從上倒下的一行一行擺放下去。

  • BorderLayout 佈局:邊界佈局。它可以把容器分為東西南北中 5 個方位,可以指定某個元件在 哪個方位(但注意並非一定要有 5 個元件擺上去,不足 5 個也可指定位置擺放)。

  • GridLayout 佈局:網格佈局。可以指定容器上的元素按幾行幾列的位置順序擺放。

  • CardLayout 佈局:卡片佈局。使用該佈局的容器可放置多個元件,但同一時刻只能顯示其中一 個,就像一疊疊整齊的紙牌中每次只能最上面一張一樣。可以指定哪個元件被顯示。

  • null 佈局:空佈局。空佈局並非沒有佈局,而是容器被設定為這種佈局以後,放到它上面的每 個元件就可以通過 setBounds(int a,int b,int width,int height)來設定其具體的位置。

  • 另外還有 BoxLayout(盒式佈局)、GridBagLayout(網格包佈局)等不常用佈局。

在具體的程式設計時,上述每一種佈局都對應是一個類,用它們定義出來的物件作為容器物件的 setLayout 方法的引數,就可以把容器設定成該引數所對應的佈局了。

乾貨:

(在學習這個之前需要一點簡單的 Java 基礎)

想用Java進行圖形化設計,首先引入類庫,下面我引入了四個我完成實驗時用到的庫

import java.awt.Color;					//可以用於更改顏色
import java.awt.Font;					//可以用於更改字型
import java.awt.event.*;			   //用於按鈕的事件,即給按鈕新增一些功能
import javax.swing.*;					//最主要的,進行圖形化設計的庫

首先應該建立一個窗體,就我們平時所看見的windows視窗,在自己的類裡面或者主函式裡面寫

然後我們可以開始調整視窗的大小

//名稱“計算器”會顯示在視窗的左上角
JFrame jf = new JFrame("計算器");

//設定視窗大小,我設定的是長300寬400
jf.setSize(300,400);

//此行程式碼不可刪,有此行程式碼後在點選視窗右上角的×時才會真正關閉程式
jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

//此行程式碼不可刪,如果沒有此行程式碼執行程式是不會看見你的視窗
jf.setVisible(true);	

//此行程式碼自由選擇,為false時執行程式碼生成的視窗是無法通過拖拽擴大或者縮小視窗,沒有此行程式碼時會預設為true
jf.setResizable(false); 	


在你的類中寫完上面的程式碼後可以執行一下試試應該是可以看見你建立的視窗了

按照我個人的習慣我會在建立的視窗後新增一個 Panel(畫布) 在畫布上進行設計佈局,你也可以不建立panel,後面步驟仍然可以正常使用(前提有一定 Java 基礎更改相應程式碼)

panel 會顯示在上面建立的 jf 的上方,所以我的顏色更改選擇是更改 panel 的顏色,而不是更改 jf 的

//建立panel
JPanel panel = new JPanel();

//更改 panel 背景顏色(記得我們引入了 java.awt.Color 庫嗎,有了這個才可以進行顏色的更改)
//這個Color(R,G,B)可以按自己喜好的顏色更改,前提是瞭解這個東西,我這裡設定的一個淺藍色
panel.setBackground(new Color(175,238,238));

//我不想使用已有的佈局進行更改,想自己自定義一個佈局,設定每個按鈕或者文字的位置,所以必須要此行程式碼讓 panel 的佈局預設是空的
panel.setLayout(null);

效果圖:

之後可以根據自己的想法在 panel 上新增對應的文字,按鈕,或者輸入框等

JLabel ---------文字

JTextFIeld---------空白的輸入框

JButton---------按鈕

JPasswordField---------一個隱藏輸入內容的輸入框,就像平時我們登入某些App輸入密碼不會顯示數字而是 ***


開造!!!

我在類的最前面建立了一個靜態的字型,方便更改我所有文字中出現的字型

前提是我們引入了字型的庫 java.awt.Font

// 問藏書房是我電腦本地擁有的字型(我之前下載的比較喜歡的字型),可以檢視你電腦本地的字型有哪些自行更改
// Font.PlAIN是字型型別中正常的型別,還有粗體斜體等
// 18是字型的大小
Font f1 = new Font("問藏書房",Font.PLAIN,18);

這是我字型的樣式可以看看

建立了一個文字顯示在 panel 上

//建立了一個文字顯示我需要的文字 "第一個數"
JLabel lb1 = new JLabel("第一個數");

/*將文字新增到我的 panel ,執行就可以發現文字會顯示在 panel 上方 
!建立了文字按鈕等元件先新增! 
!建立了文字按鈕等元件先新增! 
!建立了文字按鈕等元件先新增!
重要的事情說三遍!!!否則會導致你視窗內的東西沒有正常顯示
新增之後再來按需求更改
*/
panel.add(lb1);

//設定文字的在你的視窗中的位置,視窗前面建立的是 300 * 400 
//setBounds(x, y, width, height) x 和 y 指定左上角的新位置,由 width 和 height 指定新的大小
lb1.setBounds(10,20,60,25);

//更改文字的字型,f1 是上面已經建立好了的文字
lb1.setFont(f1);

建立了一個空白的輸入框顯示在 panel 上

//建立框,一會在後面的括號設定20(20列)可以自行深入瞭解,這個也可以不輸入設定為空
JTextField number1 = new JTextField(20);

//新增到 panel
panel.add(number1);

//設定位置以及大小
number1.setBounds(100,20,100,25);

效果圖:


起飛!!!

可以自行根據上面的步驟建立三個文字框和輸入框,分別是第一個數,第二個數,結果,下面我說一下如何使用按鈕並且設計到監聽以及事件功能,輸入框的變數名按照從上往下依次為 number1 , number2 , number3

建立一個加法的按鈕

//建立按鈕
JButton b1 = new JButton("加");

//新增
panel.add(b1);

//設定大小位置
b1.setBounds(10,140,50,30);

//更改字型
b1.setFont(f1);

//新增監聽
b1.addActionListener(new ActionListener() {
    //新增事件行為
	public void actionPerformed(ActionEvent e) {
        //獲取輸入框 number1 中的文件轉化為字串
		String s1 = number1.getText();
        
         //獲取輸入框 number2 中的文件轉化為字串
		String s2 = number2.getText();
        
        //將兩個字串轉換成double型別,便於計算
		Double num1 = Double.valueOf(s1);
		Double num2 = Double.valueOf(s2);
        
        //將 num1 的值和 num2 的值加起來並且轉換成字串型別賦值給s3
		String s3 = String.valueOf(num1+num2);
        
        //將字串s3中的字元傳給number3顯示最終結果
		number3.setText(s3);
	}
});

這樣,一個計算器簡單的加法就做好了,輸入1和3,按下“加”按鈕獲得結果

接下來可以根據個人需求更改

下面是完整計算器原始碼 僅供參考

https://github.com/Shadow-Fy/Recycle-Box/blob/main/Java/Computer.java


本部落格是個人根據所學知識所寫,如有錯誤希望可以在評論指出,便於及時更改