學習了Swing的容器，布局方式和元件的知識之後，我們就可以運用學習過的這些知識來做一個計算器介面了，具體怎麼實現呢？接下來我們就來一起見證計算器介面從無到有，元件從少到多的過程。
1
首先需要建立一個表單，用來存放計算器的按鈕和文字框元件：
2
建立一個JPanel中間容器panel1，新增到表單的上方（north），用來存放計算器的文字框，文字框內容居右對齊
3
建立一個JPanel中間容器panel2，新增到表單的下方（south），用來存放計算器的加減乘除和數位按鈕
4
做完之後發現字型和元件的大小不匹配，看起來不好看，我們來設定一下字型。
6
（程式原始碼）附件：複製到eclipse中可以直接執行import java.awt.BorderLayout;import java.awt.Dimension;import java.awt.Font;import java.awt.GridLayout;import java.awt.Toolkit;import javax.swing.BorderFactory;import javax.swing.JButton;import javax.swing.JFrame;import javax.swing.JPanel;import javax.swing.JTextField;import javax.swing.SwingConstants;import javax.swing.border.EmptyBorder;/**?* 這個例子來佈局一個計算器。?* 計算器介面可以分成兩部分，即顯示區和鍵盤區。?* 顯示區可以使用文字框元件。?* 鍵盤區則是由很多按鈕組成，可以使用網格布局管理器。?*/public class Demo17_Calculator extends JFrame{private JPanel contentPane;? ? //內容面板? ? private JTextField textField;? ? //文字框? ? public static void main(String[] args){? ? Demo17_Calculator frame=new Demo17_Calculator();? ? ? ? frame.setVisible(true);? ? }? ??? ? public Demo17_Calculator() {? ? setTitle("計算器");? ? //設定表單的標題? ? ? ? setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);? ? //設定表單退出時操作? ? ? ? SwingUtils.setCenter(this);//設定表單大小600*800並居中? ? ? ? contentPane=new JPanel();? ? //建立內容面板? ? ? ? contentPane.setLayout(new BorderLayout(0,0));? ? //設定內容面板為邊界佈局? ? ? ? setContentPane(contentPane);? ? //應用內容面板? ? ? ? JPanel panel1=new JPanel();? ? //新建面板用於儲存文字框? ? ? ? contentPane.add(panel1,BorderLayout.NORTH);? ? //將面板放置在邊界佈局的北部? ? ? ? textField=new JTextField();? ? //新建文字框? ? ? ? textField.setHorizontalAlignment(SwingConstants.RIGHT);? ? //文字框中的文字使用右對齊? ? ? ? panel1.add(textField);? ? //將文字框增加到面板中? ? ? ? textField.setColumns(50);? ? //設定文字框的列數是18? ? ? ? textField.setPreferredSize(new Dimension(50, 80));? ? ? ? JPanel panel2=new JPanel();? ? //新建面板用於儲存按鈕? ? ? ? contentPane.add(panel2, BorderLayout.CENTER);? ? //將面板放置在邊界佈局的中央? ? ? ? panel2.setLayout(new GridLayout(4,4,80,20));? ? //面板使用網格4X4布局? ? ? ? panel2.setBorder(BorderFactory.createEmptyBorder(50, 80, 50, 80));? ? ? ? JButton button01=new JButton("7");? ? //新建按鈕? ? ? ? panel2.add(button01);? ? //應用按鈕? ? ? ? JButton button02=new JButton("8");? ? //新建按鈕? ? ? ? panel2.add(button02);? ? //應用按鈕? ? ? ? JButton button03=new JButton("9");? ? //新建按鈕? ? ? ? panel2.add(button03);? ? //應用按鈕? ? ? ? JButton button04=new JButton("+");? ? //新建按鈕? ? ? ? panel2.add(button04);? ? //應用按鈕? ? ? ? JButton button05=new JButton("4");? ? //新建按鈕? ? ? ? panel2.add(button05);? ? //應用按鈕? ? ? ? JButton button06=new JButton("5");? ? //新建按鈕? ? ? ? panel2.add(button06);? ? //應用按鈕? ? ? ? JButton button07=new JButton("6");? ? //新建按鈕? ? ? ? panel2.add(button07);? ? //應用按鈕? ? ? ? JButton button08=new JButton("-");? ? //新建按鈕? ? ? ? panel2.add(button08);? ? //應用按鈕? ? ? ? JButton button09=new JButton("3");? ? //新建按鈕? ? ? ? panel2.add(button09);? ? //應用按鈕? ? ? ? JButton button10=new JButton("2");? ? //新建按鈕? ? ? ? panel2.add(button10);? ? //應用按鈕? ? ? ? JButton button11=new JButton("1");? ? //新建按鈕? ? ? ? panel2.add(button11);? ? //應用按鈕? ? ? ? JButton button12=new JButton("*");? ? //新建按鈕? ? ? ? panel2.add(button12);? ? //應用按鈕? ? ? ? JButton button13=new JButton("0");? ? //新建按鈕? ? ? ? panel2.add(button13);? ? //應用按鈕? ? ? ? JButton button14=new JButton(".");? ? //新建按鈕? ? ? ? panel2.add(button14);? ? //應用按鈕? ? ? ? JButton button15=new JButton("=");? ? //新建按鈕? ? ? ? panel2.add(button15);? ? //應用按鈕? ? ? ? JButton button16=new JButton("/");? ? //新建按鈕? ? ? ? panel2.add(button16);? ? //應用按鈕? ? ? ? button01.setFont(new Font("宋體", 1, 50));? ? ? ? button02.setFont(new Font("宋體", 1, 50));? ? ? ? button03.setFont(new Font("宋體", 1, 50));? ? ? ? button04.setFont(new Font("宋體", 1, 50));? ? ? ? button05.setFont(new Font("宋體", 1, 50));? ? ? ? button06.setFont(new Font("宋體", 1, 50));? ? ? ? button07.setFont(new Font("宋體", 1, 50));? ? ? ? button08.setFont(new Font("宋體", 1, 50));? ? ? ? button09.setFont(new Font("宋體", 1, 50));? ? ? ? button10.setFont(new Font("宋體", 1, 50));? ? ? ? button11.setFont(new Font("宋體", 1, 50));? ? ? ? button12.setFont(new Font("宋體", 1, 50));? ? ? ? button13.setFont(new Font("宋體", 1, 50));? ? ? ? button14.setFont(new Font("宋體", 1, 50));? ? ? ? button15.setFont(new Font("宋體", 1, 50));? ? ? ? button16.setFont(new Font("宋體", 1, 50));? ? }}區可以使用文字框元件。?* 鍵盤區則是由很多按鈕組成，可以使用網格布局管理器。?*/public class Demo17_Calculator extends JFrame{private JPanel contentPane;? ? //內容面板? ? private JTextField textField;? ? //文字框? ? public static void main(String[] args){? ? Demo17_Calculator frame=new Demo17_Calculator();? ? ? ? frame.setVisible(true);? ? }? ??? ? public Demo17_Calculator() {? ? setTitle("計算器");? ? //設定表單的標題? ? ? ? setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);? ? //設定表單退出時操作? ? ? ? SwingUtils.setCenter(this);//設定表單大小600*800並居中? ? ? ? contentPane=new JPanel();? ? //建立內容面板? ? ? ? contentPane.setLayout(new BorderLayout(0,0));? ? //設定內容面板為邊界佈局? ? ? ? setContentPane(contentPane);? ? //應用內容面板? ? ? ? JPanel panel1=new JPanel();? ? //新建面板用於儲存文字框? ? ? ? contentPane.add(panel1,BorderLayout.NORTH);? ? //將面板放置在邊界佈局的北部? ? ? ? textField=new JTextField();? ? //新建文字框? ? ? ? textField.setHorizontalAlignment(SwingConstants.RIGHT);? ? //文字框中的文字使用右對齊? ? ? ? panel1.add(textField);? ? //將文字框增加到面板中? ? ? ? textField.setColumns(50);? ? //設定文字框的列數是18? ? ? ? textField.setPreferredSize(new Dimension(50, 80));? ? ? ? JPanel panel2=new JPanel();? ? //新建面板用於儲存按鈕? ? ? ? contentPane.add(panel2, BorderLayout.CENTER);? ? //將面板放置在邊界佈局的中央? ? ? ? panel2.setLayout(new GridLayout(4,4,80,20));? ? //面板使用網格4X4布局? ? ? ? panel2.setBorder(BorderFactory.createEmptyBorder(50, 80, 50, 80));? ? ? ? JButton button01=new JButton("7");? ? //新建按鈕? ? ? ? panel2.add(button01);? ? //應用按鈕? ? ? ? JButton button02=new JButton("8");? ? //新建按鈕? ? ? ? panel2.add(button02);? ? //應用按鈕? ? ? ? JButton button03=new JButton("9");? ? //新建按鈕? ? ? ? panel2.add(button03);? ? //應用按鈕? ? ? ? JButton button04=new JButton("+");? ? //新建按鈕? ? ? ? panel2.add(button04);? ? //應用按鈕? ? ? ? JButton button05=new JButton("4");? ? //新建按鈕? ? ? ? panel2.add(button05);? ? //應用按鈕? ? ? ? JButton button06=new JButton("5");? ? //新建按鈕? ? ? ? panel2.add(button06);? ? //應用按鈕? ? ? ? JButton button07=new JButton("6");? ? //新建按鈕? ? ? ? panel2.add(button07);? ? //應用按鈕? ? ? ? JButton button08=new JButton("-");? ? //新建按鈕? ? ? ? panel2.add(button08);? ? //應用按鈕? ? ? ? JButton button09=new JButton("3");? ? //新建按鈕? ? ? ? panel2.add(button09);? ? //應用按鈕? ? ? ? JButton button10=new JButton("2");? ? //新建按鈕? ? ? ? panel2.add(button10);? ? //應用按鈕? ? ? ? JButton button11=new JButton("1");? ? //新建按鈕? ? ? ? panel2.add(button11);? ? //應用按鈕? ? ? ? JButton button12=new JButton("*");? ? //新建按鈕? ? ? ? panel2.add(button12);? ? //應用按鈕? ? ? ? JButton button13=new JButton("0");? ? //新建按鈕? ? ? ? panel2.add(button13);? ? //應用按鈕? ? ? ? JButton button14=new JButton(".");? ? //新建按鈕? ? ? ? panel2.add(button14);? ? //應用按鈕? ? ? ? JButton button15=new JButton("=");? ? //新建按鈕? ? ? ? panel2.add(button15);? ? //應用按鈕? ? ? ? JButton button16=new JButton("/");? ? //新建按鈕? ? ? ? panel2.add(button16);? ? //應用按鈕? ? ? ? button01.setFont(new Font("宋體", 1, 50));? ? ? ? button02.setFont(new Font("宋體", 1, 50));? ? ? ? button03.setFont(new Font("宋體", 1, 50));? ? ? ? button04.setFont(new Font("宋體", 1, 50));? ? ? ? button05.setFont(new Font("宋體", 1, 50));? ? ? ? button06.setFont(new Font("宋體", 1, 50));? ? ? ? button07.setFont(new Font("宋體", 1, 50));? ? ? ? button08.setFont(new Font("宋體", 1, 50));? ? ? ? button09.setFont(new Font("宋體", 1, 50));? ? ? ? button10.setFont(new Font("宋體", 1, 50));? ? ? ? button11.setFont(new Font("宋體", 1, 50));? ? ? ? button12.setFont(new Font("宋體", 1, 50));? ? ? ? button13.setFont(new Font("宋體", 1, 50));? ? ? ? button14.setFont(new Font("宋體", 1, 50));? ? ? ? button15.setFont(new Font("宋體", 1, 50));? ? ? ? button16.setFont(new Font("宋體", 1, 50));? ? }}
