文本聊天室(TCP-中)

每天一张图，精神一下午...

---

• 好吧，开始我们今天的代码实现，我们接着上一回，上回实现了服务器的代码(在完成工作后，铁定要改..)

　　　　这次实现客户端的ui(界面)层,至于逻辑处理留给明天吧

因为我还没学html,所以委屈大家了,不好意思,界面有些丑陋.

---

 

1. 我们界面层采用javafx来进行绘制,首先有个登录服务器的界面然后切换到聊天界面
2. 运行结果如下.

---

源代码如下:

  1 package jffx.blogs.net;
  2 
  3 import javafx.application.application;
  4 import javafx.geometry.insets;
  5 import javafx.geometry.pos;
  6 import javafx.scene.scene;
  7 import javafx.scene.control.*;
  8 import javafx.scene.control.button;
  9 import javafx.scene.control.label;
 10 import javafx.scene.control.scrollpane;
 11 import javafx.scene.control.textarea;
 12 import javafx.scene.control.textfield;
 13 import javafx.scene.layout.flowpane;
 14 import javafx.scene.layout.gridpane;
 15 import javafx.scene.layout.hbox;
 16 import javafx.scene.layout.pane;
 17 import javafx.scene.text.text;
 18 import javafx.stage.stage;
 19 
 20 import java.net.socket;
 21 
 22 
 23 //采用监听按钮事件来切换舞台使得登录界面切换
 24 /**
 25  * 代码文件:    talkroomserver.java
 26  * 功能描述:    客户端代码
 27  */
 28 public class talkroomclient extends application {
 29     private textarea ta = new textarea();           //聊天记录框
 30     private textfield tf = new textfield();          //信息发送框
 31     private combobox<string> userlist = new combobox<>();      //在线用户下拉列表
 32 
 33     //用户名称
 34     string name ;
 35     //与服务器端连接的socket
 36     socket socket ;
 37 
 38     @override
 39     public void start(stage primarystage) {
 40         /**
 41          * 画登录界面，采用gridpane
 42          */
 43         gridpane mainpane = new gridpane() ;
 44 
 45         //设置面板及布局
 46         mainpane.setalignment(pos.center) ;   //向中间靠齐
 47         mainpane.sethgap(10) ;      //节点的水平间距
 48         mainpane.setvgap(10) ;      //节点的垂直间距
 49         mainpane.setpadding(new insets(5, 5, 5, 5)) ;
 50 
 51         //文本框
 52         text text = new text("welcome") ;
 53         mainpane.setid("welcome-text");
 54         mainpane.add(text, 0, 0, 2, 1) ;
 55 
 56         //标签加上输入的文本域
 57         label servicename = new label("sericename: ") ;
 58         textfield tfforservice = new textfield() ;
 59         mainpane.add(servicename, 0, 1) ;
 60         mainpane.add(tfforservice, 1, 1);
 61 
 62         //昵称加上输入的文本域
 63         label inputname = new label("name: ") ;
 64         textfield tfforname = new textfield() ;
 65         mainpane.add(inputname, 0, 2) ;
 66         mainpane.add(tfforname, 1, 2) ;
 67 
 68         //按钮这行单独处理，用一个hbox包装一下
 69         button btforlogin = new button("login") ;
 70         hbox box = new hbox(10) ;
 71         box.getchildren().add(btforlogin) ;
 72         box.setalignment(pos.bottom_right) ;        //靠向最右边
 73         //然后再加入主面板
 74         mainpane.add(box, 1, 4) ;
 75 
 76 
 77         //显示一下--将面板放入舞台,至于为什么清查阅相关资料,-----h
 78         scene scene = new scene(mainpane, 300, 200) ;
 79         primarystage.setscene(scene) ;
 80         primarystage.settitle("login") ;
 81         primarystage.show() ;
 82 
 83         /**
 84          * 监听按钮事件，以更换舞台
 85          */
 86         //这里用lambda表达式，因为就算你写完整的继承事件接口即
 87         // eventhandle<actionevent>处理,也只是处理一个handle方法
 88         //所以还不如写lamda,因为handle()只有一个参数，所以event只是一个标识符
 89         // 代表只有一个参数.
 90         btforlogin.setonaction(event -> {
 91             /**
 92              * 继续画需要切换的聊天界面图
 93              */
 94             pane pane = new flowpane() ;
 95             pane.setpadding(new insets(20, 20, 20, 20));
 96             //设置文本域的属性
 97             ta.seteditable(false);      //不可编辑
 98             ta.setwraptext(true);       //自动换行
 99             pane.getchildren().add(new scrollpane(ta)) ;
100 
101             hbox hbox = new hbox(20) ;
102             //加入在线用户及输入文本框
103             //getitems()方法返回一个选项列表
104             userlist.getitems().addall("all", "asd") ;     //默认给所有人
105             userlist.setstyle("-fx-color: white") ;
106             userlist.setvalue("all") ;
107             tf.setalignment(pos.bottom_left) ;
108             tf.setprefcolumncount(30);
109             hbox.getchildren().addall(userlist, tf) ;
110 
111             pane.getchildren().add(hbox) ;
112             scene charscene = new scene(pane, 400, 300) ;
113             primarystage.settitle("chatting") ;
114             primarystage.setscene(charscene) ;
115             primarystage.show() ;
116 
117 
118 
119 //=====================================后面暂时没写============
120             //登陆之后,给成员name初始化
121             this.name = tfforname.gettext() ;
122             string hostname = tfforservice.gettext() ;
123             system.out.println(name);
124             system.out.println("先生抱歉,　我还没有写逻辑代码..") ;
125             /**
126             //连接服务器
127             try {
128                 this.socket = new socket(hostname, 5210) ;
129 
130             } catch (exception ex) {
131                 ex.printstacktrace() ;
132             }
133              **/
134 
135         }) ;
136     }
137 }

//------------------------------希望各位路过大侠，能够给些意见,评论也行,我每天都会看的....--------------------------------

---

 

---