미니 채팅프로그램 소켓통신 프로젝트(클라이언트)

hyuko·2023년 2월 26일

국비지원 미니채팅 산대특 소켓통신 클라이언트 프로젝트

토이프로젝트(소켓통신)

목록 보기

4/5

windowBuilder를 사용하기 위한 초반 단계

우리는 STS4라는 IDE 를 통해 작업을 할 예정입니다.
WindowBuilder 라는 GUI프로그램을 쓰기위함입니다!

그렇기 위해서는 아래와 같이 추가해주어야 할 것이있습니다.

help 에 들어가 가장 하단의 Eclipse Marketplace를 들어가줍니다.

그 후에 window 로 검색하여 windowBuilder Current 를 찾아 인스톨 해주면 끝납니다!!

JFrame 과 JPanel

이렇게 윈도우 빌더를 다운을 받고난 후에
프로젝트에서 패키지 하나를 view로 만들고 그 안에
파일을 하나 추가 해주는데용!

Other를 클릭 해주고 난후 windowbuilder를 제대로
다운로드 했다면 나오는 화면이 있습니다.

여기서 JFrame을 선택해서 일반 클래스를 생성하는 것처럼 클래스 양식을 맞춰 생성 해줍니다!

여기서 JFrame 이란 하나의 틀을 만들어주는 형식입니다.

우리가 처음부터 틀과 안에 들어갈 구성요소를 다 따로 만들지는 않을 예정이고 하나의 틀안에 패널들을 추가하고 요소들을 추가해서 만들 예정입니다.

그리고 JPanel 을 용도에 맞게 추가할 예정입니다.
여기서 JPanel 은 눈에보이는 화면이라고 생각하시면 편할 것 같습니다.

Component 구조

하나의 프레임안에 메인이되는 패널을 생성하고
그 패널안에 세가지의 패널을 만드는 구조가 됩니다.

가장 상위의 패널인 mainPanel의 경우에는
카드 레이아웃을 쓰게 되는데 이 카드 레이아웃은
어떠한 기준을 주고 그 기준에 해당됬을 때
패널들을 카드처럼 꺼내서 보여줄 수 있는 레이아웃 입니다.

그리고 그 하위의 join, chattingList, chattingRoom 등은 absolute를 주면서 버튼이나
인풋창 리스트등이 자유롭게 추가 될 수 있는 구조를 만들어 주게 됩니다.

화면 계획

우리의 화면 계획은 카카오톡의 화면과 비슷하게
만들었습니다.

로그인 버튼의 경우에는 카카오톡 API 의 버튼을 사용하게 되었고 플러스 버튼이나 나가기 버튼등은
무료 이미지를 사용하여 만들었습니다.

클라이언트 로직

클라이언트에서 주어야할 정보는 닉네임 / 방의 제목


joinNickname.addKeyListener(new KeyAdapter() {

			@Override
			public void keyPressed(KeyEvent e) {
				if (e.getKeyCode() == KeyEvent.VK_ENTER) {
					
					if (joinNickname.getText().isBlank()) {
						JOptionPane.showMessageDialog(null, "please input nickname", "입장불가", JOptionPane.ERROR_MESSAGE);
					} else {
						String ip = "127.0.0.1";
						int port = 8889;

						try {
							socket = new Socket(ip, port);
							ClientRecive clientRecive = new ClientRecive(socket);
							clientRecive.start();

							nickname = joinNickname.getText() + " [" +  socket.getLocalPort() + "]";
							
							LoginReqDto loginReqDto = new LoginReqDto(nickname.replaceAll(" ",""));
							
							String joinJson = gson.toJson(loginReqDto);
							sendRequest("join", joinJson);

							if (socket != null) {
					
								CardLayout mainLayout = (CardLayout) mainPanel.getLayout();
								mainLayout.show(mainPanel, "chattingList");
										
							}
						} catch (ConnectException ex) {
							JOptionPane.showMessageDialog(null, "접속오류", "접속오류", JOptionPane.ERROR_MESSAGE);
						} catch (IOException ex) {
							ex.printStackTrace();
						}
					}
				}
			}
		});

소켓이 생성되어 추가될 환경은 우리가 닉네임을
입력한 후 Enter키를 입력하거나 버튼을 눌렀을 경우
해당 서버의 ip주소와 port번호를 소켓에 주어서
서버와 연결되는 구조입니다.

이때 입력창에 입력되는 닉네임이 request 객체로 변환하여 Json 형태로 다시 바꾸어주고 통신을 하는 구조입니다.

이때 소켓이 연결되지 않았거나 입력하는 창에 아무것도 입력하지 않고 조인하려는 경우 등은 들어갈 수 없게 처리해주었고 닉네임들을 모두 입력이되는 당시에 바로 공백을 제거하여 넘겨주게 됩니다.

모든 통신의 형태는 클라이언트에서 정보를 넘겨주고
그 정보를 받은 서버는 저장을 하거나 로직 처리를 한후
리시브에 다시 넘겨주게 됩니다.