JavaSE_Vibatalk專案開發

JavaSE_Vibatalk專案開發_part1

- 5月 02, 2016

首先我們已有 Server(服務器)端軟件需先開啟的，
然後才能在Client(客戶)端指定服務器(Server)的IP這個基本觀念了。

我們又可以稱之為「C/S」

我們會用到下列技術

(1)File I/O
(2)GUI(AWT、Swing)
(3)Socket
(4)多線程
(5)JDBC(數據庫操作)---->這裡先暫時不用我們用簡單的文件輸出入來替代

*主要功能
(1)用戶登陸 (介面 --->用到 GUI)
(2)用戶登陸驗證(用戶名、密碼輸入有沒有問題---->用到File )
(3)網路聊天(用到 Socket)

任務1
我們要來完成登陸介面

首先
介面的分析

我們以【噗很大】這個例子來做說明

我們要先以server端為主

我要設計一個叫做「Vibatalk」的聊天室軟件

Java API 中有兩個套件，分別是 AWT 與 Swing ，兩者都可以製作圖形介面的程式。

AWT 為 Abstract Window Toolkit 的縮寫詞，
這是 Java 1.1 版之前官方程式庫 (libiary) 提供的套件 (package)
--->調用系統的 (會用系統的圖標、....)看起來較為呆版、死板

後來 1.2 版以後又採納 Swing 當第二個官方 GUI 的程式庫。
---->自定義的(Ex: QQ 經過美化的介面)

AWT 在 java.awt 套件中

import java.awt.*;

Swing 在 javax.swing 套件裡

import javax.swing.*;

我們在此利用 Swing 來完成我們的軟件

JFrame類別是最常被使用到的Swing元件
幫助開發者建立視窗框架

我們先讓容器可以顯示出來

第一步要先談出一個窗口
你可能要先定義這個視窗介面的寬度和高度

在此 this 是個容器(代表當前對象 / 代表使用中的類別)

寫完我們要測試我們就在 main 進入點的 block 添加一個測試方法

public void setVisible(boolean b)
設定是否顯示視窗框架 ----> 繼承自 java.awt.Complement

事件裡捨麼都沒寫
沒寫調用他也就捨麼都不做

第一階段code
顯示空窗口

package com.viba.ui;
import javax.swing.JFrame;
public class Client_Login_UI extends JFrame{
    private Client_Login_UI()
    {
        init();
        addComponent();
        addListener();
        showFrame();
    }    
    //Step1.首先有各種組件要做初始化    
    private void init()
    {
        
    }
    //Step2.把各種組件在該方法中進行組裝
    private void addComponent()
    {
        
    }
    //Step3.加事件功能
    private void addListener()
    {
        
    }
    //Step4.顯示窗口組件
    private void showFrame()
    {
        //第一步彈出一個空窗口配置寬、高
        this.setSize( 400 , 350);
        this.setVisible(true);
    }
    public static void main(String[] args)
    {
        new Client_Login_UI();
    }
}

注意!!!! 當你關閉了視窗之後會發現

程式仍在執行 (紅色填滿方塊)

JFrame 沒加事件也有關閉的功能但為假的關閉

因此我們需要添加關閉視窗的事件(Close Event)

就可修正關閉窗口的小瑕疵

如何調整視窗置中顯示

將螢幕的寬度、高度除以2 再分別減去視窗寬度及高度除以2

效果示意

第二階段code
將窗口置中並修正關閉瑕疵

package com.viba.ui;
import javax.swing.JFrame;
public class Client_Login_UI extends JFrame{
    private Client_Login_UI()
    {
        init();
        addComponent();
        addListener();
        showFrame();
    }    
    //Step1.首先有各種組件要做初始化    
    private void init()
    {
        
    }
    //Step2.把各種組件在該方法中進行組裝
    private void addComponent()
    {
        
    }
    //Step3.加事件功能
    private void addListener()
    {
        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    }
    //Step4.顯示窗口組件
    private void showFrame()
    {
        //讓窗口在螢幕正中間彈出
        int screenWidth = (int) this.getToolkit().getScreenSize().getWidth();
        int screenHeight = (int) this.getToolkit().getScreenSize().getHeight();
        int x = (screenWidth/2 - 500/2);
        int y = (screenHeight/2 -400/2);
        this.setLocation(x,y);
        //this.setLocation(250,200);
        
        //第一步彈出一個空窗口配置寬、高
        this.setSize( 500 , 400);
        //(setSize(width ,height );
        this.setVisible(true);
    }
    public static void main(String[] args)
    {
        new Client_Login_UI();
    }
}

接著你又會開始問了
問說我們要怎麼加入圖片呢??