Skip to content

[졸업작품] 컴퓨터공학과 직박구리팀 돌려드림

License

Notifications You must be signed in to change notification settings

chihyeonwon/Capstone-Design

Repository files navigation


돌려드림 캡스톤 디자인 프로젝트

누군가에겐 그저 단순한 물건일지라도 누군가에겐 추억이 담긴 무엇보다도 소중한 물건입니다.

그 소중한 추억을 주인에게 돌려드릴 수 있도록 컴퓨터공학과 6인이 돌려드림 어플을 개발하게 되었습니다.

All Collaborators

목차


소개

기존 유실물 찾기 서비스의 불편함을 해소하고 개선하고자, 습득자는 유실물을 간편하게 등록하고 분실자는 간단한 인증을 통해 유실물을 찾아가고자 본 서비스를 고안하게 되었습니다.


기존 사례 분석

기존 서비스의 문제점

  1. 회원가입, 로그인 유효성 검사 기능의 부재
  2. 경찰서 마다 카테고리별 지칭명이 서로 달라 찾는데 어려움
  3. 잃어버린 물건을 찾으러 경찰서에 방문 필수
  4. 게시물마다 일부 정보의 부재(사진, 물품명, 보관장소 등)
  5. 경찰관들이 분실물을 수동으로 정보를 기입해야하는 문제

이번 프로젝트에서 개선할 점

  1. 회원가입, 로그인 기능 강화 및 보안성 강화
  2. 습득물건을 사용자가 자발적으로 신고 후 직접 찾을 수 있도록 기능 개선
  3. 분류된 결과를 자동으로 기입하여 편의성 개선




컴포넌트

  • Firebase Authentication
  • Firebase Realtime Database
  • Firebase FireStore
  • Firebase Storage
  • Firebase Cloud Messaging
  • Firebase Dynamic Links
  • Device
    • Android

주기능

프론트엔드(FrontEnd)

회원가입 및 로그인


개인 정보 제공 동의 후 회원가입이 가능하며,
모든 동의를 받으면 회원가입 페이지로 진입할 수 있습니다.




회원가입 진행시 유효성 검사를 실시간으로 진행하며, 모든 유효성 검사를 충족시 회원가입을 진행합니다. 회원가입 시 학교 이메일로 이메일 인증을 진행합니다.




회원가입시 가입한 이메일로 이메일 인증 메일이 전송됩니다.
해당 메일에서 인증을 진행하여야 본 서비스를 이용하실 수 있습니다.



메인페이지


메인페이지에서는 습득물과 분실물을 볼 수 있는 게시판을 제공합니다.



돌려드림 분실물 조회 페이지



돌려드림 서비스에 자동 분류되어 업로드된 분실물들의 목록을 볼 수 있습니다. 해당 게시물을 클릭하면 상세 정보를 볼 수 있으며, 작성자의 경우 수정 및 삭제가 가능합니다.




돌려드림 분실물 등록



백엔드(BackEnd)

회원가입 및 로그인



Collaborators

원치현
PM, Back End
박광호
QA, Back End
문재희
Front End
정환희
Front End
김유정
Back End
소진오
Back End

3월 28일 팀회의 피드백

image

검색 결과 - 사진으로 블록형식으로 여러 개 보일 수 있게
-> gridView의 형태로 사진으로 여러 개를 보여줄 수 있게끔 수정한다.

물건등록 페이지 - 사진을 찍어서 올리는 기능, 사진 가져오는 기능
-> 사진을 찍어서 올리는 기능, 가져오는 기능을 드랍 메뉴의 형태로 구현, 사진을 여러 개를 추가할 수 있는 기능을 구현,
AI기능을 이용하여 여러 개의 사진을 분석하여 물건이 어떤 물건인지 파악하는 데 입력값으로 이용될 수가 있다.

지도 api 기능은 과할 수도 있다
-> 물건 등록 페이지의 지도 api 기능을 빼고 단순히 위치만을 입력하게 한다.

보관장소 입력 시 굳이 채팅 기능이 필요 하지 않을 수 있다.
보관장소 입력 안 할 시 채팅 기능이 필요 할 수도 있다.

물품명을 카테고리 시 - 등록 갯수 상위 5개 (자주 잃어버리는 물품) 나머지는 그냥 기타 로 구현하는 방법

기능 정의서 작성

원주캠퍼스 지도의 건물 image

실제 지도에 있는 건물들의 명칭 데이터를 분실물 데이터베이스 Ref의 값(프로퍼티)들로 지정한다.
W1~W16, E1~E5

UI 설계 수정 - 분실자가 글을 쓰는 인터페이스 없음-알림기능을 위해서 필요

4월 3일 회의

<UI 수정사항>

● 처음 먼저 등록한 사진은 대표사진으로 추가됨 (안내 문구 추가)
→ 사진 여러장 등록 가능 
● 지도 보류 (학교 홈페이지 참고) api를 쓸 것인가? 지도를 빼고 드롭다운으로 수정
● 지도 도움말 버튼을 클릭 시 웹뷰 
● 상세 위치보단 추가 입력 사항으로 변경 ?
● 지도 상세위치 → 장소클릭+상세위치(과사, 화장실, 201호 등등) 
= W6 과학기술대학 남자 화장실 
● 사용자명 수정
● 검색 결과 분실물과 습득물 , 둘다 나오게 체크박스 추가
● 검색결과에서 습득물명과 분실물명 가시성 높이도록 수정
● 관리번호 쓸것인가
● 분실일자 시간 설정하는 것 삭제
● 습득물명에서 카테고리 한 번 더 쓰는걸로 하는게 좋을 것같다
● 습득물명 분류를 좀 더 포괄적으로 
ex) 금전 = 지갑+카드+현금+기타, 전자기기 = 핸드폰+컴퓨터+기타
● 키워드 알림 ex) 이어폰을 키워드 알림 설정하면 이어폰에 대한 새로운 글이 올라올 때마다 알림 전송
● 채팅알림과 키워드 알림 → 활성화/비활성화 설정 여부
ex) 버튼이나 아이콘을 눌러 간단히 알림 활성화/비활성화 설정할 수도 있다
● 마이페이지 설정 기능 추가
● 메인 메뉴를 게시판으로 고정해놓고 사이드나 하단바에 메뉴를 고를 수 있게 UI를 구현

4월 5일 회의

분실물과 습득물의 차이?
분실물 - 분실장소
습득물 - 습득장소, 보관장소(다른사람이 어디에보관했는지)

건물위치를 색깔로 나타냄

더보기를 누르면 사진을 추가적으로 확인할 수 있다.

분실신고를 누르면 습득자-습득물 게시판, 분실자-분실물 게시판

QnA - 제목 내용 상태
답변이 완료되면 상태로 변함

기능명세서에 보면 빠져있는 것들

캠퍼스 안내도 - 필수사항은아니다

1:1채팅을 구현한다. 어떻게 사람과 사람과의 연결을 할 것냐- 매칭
삭제를 한경우에 사용자 검색
채팅 수신 거부 (사용자 차단)

-이미지 몇개까지 할건지 제한

분실물을 마냥 가지고만 있을 순 없기 때문에 최대 한달,6개월 정도 보관기간을 정해놓고서
물품을 실제로 보관해놓고있는 장소에서도 처리를 해야하기때문에 몇개월정도 들고 있을 건지를
삭제

분실물도 찾은 경우에는 찾은 분실물이 완료가 되었다는 것을 사용자들이 체크를 하게 해서 텍스트들이 비활성화된다거나
하는 기능을 구현하면 좋겠다.

물건의 색깔 - 정확도를 올리기위해서 특징 -(불필요한 알람들이 올 수 도 있어서) 키워드 매칭을 더 해서
사용자가 입력한 것에 맞는 것들에 대한 정보

편의성에 대한 피드백 

다음에 해야 할 것 - 기능 1가지 정도 완료, 역할 분담

2주에 1번 정도 미팅 (4.18일정도)
팀장 주도하에 개발 진행 - 일주일간 했던 것들을 정리해서 보냄

24.04.07

image

게시물 작성해서 어뎁터의 키리스트를 get_board_list의 매개변수로 넘겨준다음 해당하는 스토리지 경로의 이미지를 추가했다.

image image

습득 위치 옆의 물음표 이미지를 클릭하면 건물 조직도 홈페이지로 이동한다.

24.04.08

image

습득 날짜 선택 UI를 EditText에서 DatePickerDialog로 수정하였습니다.

image image image

습득 위치와 보관 위치 선택 UI를 EditText에서 DropDown으로 수정하였습니다.
습득 위치와 보관 위치 드롭다운 선택한 String과 상세 습득위치, 상세 보관위치를 EditText로 입력받아
두 개의 String을 합쳐서 최종적으로 습득 위치, 상세위치를 산출한 뒤 데이터베이스에 저장하였습니다.

ps 드롭다운 메뉴의 Text 색을 변경할 수는 있으나 전체적으로 변경가능하다.
일부분 즉 W1~W15는 빨간색 E1~E5는 노란색 개별로는 변경불가능하다.
W1~W15, E1~E5 전체를 빨간색이나 노란색으로 변경하는 것은 가능

image image

하단 네비게이션 바의 UI를 설계 UI대로 수정하였습니다.

하단 네비게이션 바의 현재 창을 나타내는 바의 색상을 노란색(MainColor)에서 검정색으로 수정하였습니다.

PS 4번째 텍스트 Q/N -> Q/A로 수정할 예정

24.04.09

검색 기능 구현

image image image

검색버튼을 눌렀을 때 검색하는 창(searchActivity)에서 검색옵션을 주고 그 옵션 값을 intent.putExtra에 담아서
검색된 창(searchActivity)로 넘긴다.(intent.getStringExtra)

검색된 창에서 넘겨받은 옵션 값과 게시글을 불러오는 함수 getFBBoardData의 매개변수로 넘겨준다음
옵션 값과 데이터 모델의 값과 같은 게시물만 출력하도록 한다.

최종적으로 옵션값에 입력한 습득물명과 같은 게시물만 출력하도록 했다.

ps 다음 구현 예정 -> 일자, 위치 검색 필터 옵션을 추가한다.

image image

검색된 창에서 전체 글보기(MainActivity)로 되돌아가는 버튼을 추가했다. 누르면 메인화면(GetFragment)로 이동한다.

24.04.10

검색 기능 구현2 (시작일~종료일 기준 검색)

image image image

4월 8일,9일,10일,11일 게시물이 있을 때 4월 8일부터 4월 9일까지 게시물을 검색하면 8일, 9일게시물이 나온다.

검색 기능 구현3 (습득 위치를 기준 검색)

image image

습득 위치 같은 경우에는 W1 (건물이름) 스페이스(공백) 상세건물이름 스페이스(공백) 몇호관 이런식으로 되어있어서
입력값을 첫번째 공백 앞까지 추출해서 (건물이름)으로 비교하게 한다. substring(0, originalstring.indexOf(" "))

습득 위치를 W1로 했을 때 W1 뒤에 어떤 상세습득 위치가 오더라도 W1에서 습득한 습득물이 모두 나타나게 된다.

24.04.11

습득물 등록 시 카메라, 갤러리에서 선택하는 다이얼로그 추가

파이어베이스 스토리지 공식 문서
image


24.04.12

마이페이지 내가 쓴 글(습득물, 분실물)을 모아서 보여주는 기능 추가

image image

내가 쓴 글 = 주황색 배경, 남이 쓴 글 = 하얀색 배경일 때 마이페이지의 게시글 버튼을 누르면 내가 작성한 습득물, 분실물에 대한
글만 모아서 볼 수 있다.

마이페이지 키워드 버튼 옆 키워드 도움말 다이얼로그 기능 추가

image

키워드 설정 관련 도움말을 알려주는 다이얼로그 기능을 추가했습니다.

마이페이지 로그아웃, 회원탈퇴 버튼 클릭 시 다이얼로그 기능 추가

image image

바로 로그아웃, 회원탈퇴가 이루어지지 않게 다이얼로그를 추가하였습니다.

24.04.13

메인화면

image

기본적으로 화면에서 뒤로 가기 버튼을 누르면 onBackPressed() 메서드가 호출되어
현재 화면을 종료하고 이전 화면으로 돌아가게 된다.

화면(습득물게시판, 분실물게시판, 분실신고, Q/A, 마이페이지)에서 뒤로가기 버튼 시 앱이 바로 종료되는 것을 막기위해서
종료 다이얼로그 메세지와 함께 앱 종료 여부를 묻도록 수정하였다.(확인 시 앱이 꺼짐)

키워드 설정 및 알림 기능 구현(백그라운드 정상 작동)

image image image

키워드 설정 페이지에서 습득물명으로 키워드를 입력한 후 해당 키워드로 게시글이 올라오면 백그라운드에서 알림이 발생한다.
앱 및 화면이 꺼져있을 때도 작동하는 것으로 확인.

ps 알림을 눌렀을 때 해당 게시글로 이동하는 기능과 알림 메시지에 키워드명이 들어갈 수 있도록 수정한다.

24.04.14

카메라로 업로드 하는 기능 추가

image image image

갤러리에서의 requestCode 100 말고 카메라에서의 요청 requestCode를 200으로 수정한 뒤 Uri를 불러오기 전
비트맵으로 데이터를 변환한 후에 넘겨주도록 수정하여 카메라 찍은 사진이 갤러리에 저장되지 않고도 바로 파이어베이스
스토리지로 업로드되고 업로드된 이미지를 이미지뷰에 보여지도록 처리하였다.

1. 카메라 권한 확인 2. 카메라로 촬영 3. 카메라로 찰영된 이미지를 파이어베이스 스토리지에 업로드 4. 업로드 된 이미지를
이미지뷰에 띄운다.

습득물 게시물 관리번호 텍스트 추가

image image

습득물 게시글마다 고유한 관리번호를 부여하였다.(UI 설계대로)
관리번호는 고유한 String 형태의 key 값을 이용하였다.

사진 업로드를 6개 할 수 있도록 하고 그 중 첫번째 큰 이미지에 등록한 이미지는 미리보기 이미지로 한다.(대표이미지)
슬라이드 기능 (caurosel 기능이 있나 찾아보고 적용)을 적용해보고 사진을 클릭하면 학대 축소가 가능한 페이지로 이동하는 기능 구현

QnA에 댓글이 달리면 해당 게시글 상태 변경 기능 구현

image image image image

QnA에 댓글이 달리면 해당 게시글의 상태를 대기에서 완료로 변경한다.

24.04.18

// 코루틴을 시작하여 백그라운드에서 실행
                GlobalScope.launch {
                    if(post?.category.equals(findViewById<TextView>(R.id.keywordArea).text.toString())) {
                        sendNotification()
                    }
                }
코루틴을 시작하여 백그라운드에서 키워드 알림이 실행되도록 수정하였다.

24.04.19

알림 여러개 쌓기 image

현재 알림을 여러개 보내도, 가장 최신의 알림 1개로 업데이트만 되고, 쌓이지 않음. < 알림 여러개 쌓이게 하기. _ 아마 id값을 다른 값으로 주면 같은 알림이라고 인식 안 할 것 같다.

24.04.18 회의

UI 가 전체적으로 부족하다는 평가
키워드 알림에 백엔드 기능 추가, 사진 여러 장 업로드 할 수 있게 수정할 예정 - 원치현
키워드팀 - 키워드알림 UI 설계 및 전체 UI 변경 (Flutter의 UI 디자인툴 사용)

분실자가 직접 분실물을 찾아서 들고 간 경우 게시글을 삭제 또는 게시글에 표시할 수 있는 권한(상태)를 준다.

24.04.20 회원가입 정보를 데이터베이스에 저장

image

1:1 채팅 기능 개발을 위해서는 회원가입할 때 유저 정보를 데이터베이스에 저장해야 한다. user 데이터 객체를 생성하고
email와 uid 정보를 저장한다.

습득자와의 채팅창으로 이동

image image

습득자가 게시한 글에 들어가서 채팅버튼을 누르면 습득자와 채팅할 수 있는 채팅방으로 이동하게 된다.

습득자에게 메시지 전송

image

Chat Model

image

User Model

image

 1. senderRoom = receiverUid + senderUid

   보낸 이의 방의 값을 받는 이 uId와 보낸 이 uId로 

   합쳐서 만들었습니다.

 2. receiverRoom = senderUid + receiverUid

   받는 이의 방의 값을 보낸 이 uId와 받는 이 uId로

   합쳐서 만들었습니다.

 3. mDbRef.child("chats").child(senderRoom!!).child("messages").push()
                .setValue(messageObject)

   chat -> senderRoom -> message -> 메시지 저장

ps 데이터베이스 경로명을 uid 말고 email로 하려고 했으나 파이어베이스 정책 상 데이터베이스의 경로명에는 @ 등 특수문자가
포함될 수 없다고 한다. 이를 substring이나 indexOf를 사용하여 @ 앞을 떼어서 경로명으로 사용할 수는 있겠으나 굳이?라는
생각이 들어서 그냥 유저 정보에 있는 uid를 경로명으로 사용하기로 했다.

메시지 가져오기

image image

메시지를 입력하고 전송하면 습득자에게 메시지를 보낼 수 있다.

채팅 기능 제안

채팅하기를 누르고 1:1채팅기능은 구현이 되었지만 채팅방을 구현하기에는 데이터모델을 새롭게 짜야하는 문제
전체 사용자리스트를 서랍뷰에 넣고 습득자의 이메일을 습득자 게시글에서 알 수 있으니까 그거를 전체 사용자리스트에서 검색한 후
해당하는 사용자를 누르면 채팅을 시작할 수 있게끔은 구현 가능

24.04.23

현재 알림 기능을 포그라운드와 백그라운드에서 작동하도록 개발하였다.
포그라운드에서 특정 액티비티에 진입 시 코드 상에서 백그라운드로 코드를 돌리게 끔 짰다.
알림이 중첩되지만 전에 있던 데이터에 대한 알림도 발생하는 것을 수정하려고 한다.(intent. ONE SHOT)

또한 현재 에뮬레이터에서는 백그라운드에서 알림이 잘 작동하지만 실제 기기에서는 백그라운드 메모리 관리 시스템에 따라
필수적이거나 필요하다고 생각되는 앱의 메모리 사용을 제외하고 적은 량의 메모리를 할당하고 있어 강제로 앱을 종료시키는 문제가
발생하는 데 이를 강제적으로 백그라운드 상태에 계속 있게 하거나 메모리 최적화하는 코드를 적용하여 해결해야 할 것 같다. 
서버에서 데이터를 가져오거나 할 때 걸리는 시간 차로 인하여 기본 이미지가 1~2초간 보여지는 현상이 있다.
데이터 수정 역시도 바로 수정되지 않고 새로고침하거나 시간 차를 두어야 하는데 이를 해결하기 위한 작업을 이번주에는 할 것 같다.

24.04.28

습득물 코드를 재사용해서 분실물 게시판을 완성할 예정
Firebase Cloud Messaging 클라우드 서비스를 학습해서 적용해 볼 예정 ->메모리관리에 대한 불편함을 클라우드로 이관

24.04.29

이미지 업로드 버튼 수정

image

이미지 추가 버튼을 생성하고 버튼을 누르면 갤러리or카메라로 선택할 수 있는 다이얼로그가 나오도록 변경하였다.

업로드 이미지 RecyclerView

image image

갤러리에서 이미지를 여러 장 선택할 수 있도록 수정하였다.
선택되어진 이미지들은 Grid 뷰의 형태로 업로드된다.

ps 현재 파이어베이스 스토어에는 업로드 되지 않는다. 코드를 수정할 예정이다.

사진 여러 장 업로드 개발의 방향성

image image image

선택한 사진의 수를 clipData의 getItemCount를 사용해서 count에 저장한 다음
갤러리에서 사진 2장을 선택하고 count  Value에 대한 로그를 찍었을 때 선택한 사진의 수만큼 count가 되는 것을 알 수 있다.

count를 lateinit var 키워드를 사용하여 전역변수로 뺀다음 count를 사용해서 upload함수에 매개변수로 넣는다면
파일명 + count 의 형태로 할 수 있을 것 같다.

여러 장 업로드 로직 구현

안드로이드 파이어베이스 스토리지 공식 문서
image image

파이어베이스 스토어에 업로드 된 이미지 2장

image image

이미지 업로드 하는 함수를 선택한 이미지 수만큼 반복해서 실행하도록 로직을 수정했다.

count는 0부터 시작한다. 첫 번째 선택한 이미지 -> 0번으로 해서
key0, key1 이렇게 이름을 붙여서 업로드하도록 코드를 짰다.

선택한 이미지가 파이어베이스 스토어에 정상적으로 업로드 되는 것을 확인했고
GetBoardActivity 즉 습득물 게시판에서는 대표 이미지인 0번 이미지 한장만 업로드 되고
GetBoardInsideActivity 즉 습득물 게시글 하나를 선택해서 자세히 보기를 했을 때는 업로드한 이미지를 모두 볼 수 있도록
수정할 예정이다.

ps 공식 개발문서에 이미지 비트맵처리와 관련한 내용이 너무 부족한 것 같다 .

24.04.30

습득물 게시판 대표이미지

image image

제일 첫 번째로 선택한 이미지가 대표이미지로 나오도록 수정했다.

이미지 로딩 딜레이 문제

이미지 로딩 딜레이를 줄여보기Permalink
현실적으로 이미지 같은 경우에는 서버로 부터 다운받은 시간 자체를 줄이기는 어렵다.
가장 이상적인 방법으로는 썸네일용 저용량 이미지 파일을 서버에서 제공하는 것도 있지만 서버에서 제공하지 않는다면 결국 client, 즉 APP에서 문제를 해결해야 한다.
따라서 이미지를 다운받는 속도를 줄일수 없다면 그 다음 방법으로는 보여질 이미지를 미리 다운 받아서 app에 저장하는 것이다.
즉 cache를 이용하는 것이다. cache 자체는 직접 구현할수도 있지만 더 좋은 것은 라이브러리를 사용하는 것이다.

Glide 같은 경우 자체에 cache 동작을 제공한다.

습득물 자세히보기 페이지 사진 여러 개

image image

사진이 한장일 때

image image

Glide로 이미지를 불러올 때 ImageView로 한 개씩 가져오는 것이 가능했다.
처음에 게시글 작성 페이지에서 Uri 타입이 담긴 imageList를 intent로 넘겨서 uri 리스트로 처리하려고 했는데 문제가 발생해서
imageView를 여러 개 생성하고 0 부터 count(count는 최대 이미지 개수가 된다.)까지 반복문을 돌려서
이미지를 경로명0, 경로명1 이렇게 받아오되 경로명에 해당하는 이미지가 없을 때 이미지뷰를 invisible 처리해서 이미지가 없는데
공간을 차지하고 있는 문제를 해결했다. 또 이미지뷰를 linearlayout으로 Grid 형태로 4x4의 형태로 나오게끔 처리했다.
사진 개수에 따라서 유동적으로 사진이 차지하고 있는 공간의 크기가 변한다.(수가 적으면 커지고 수가 많아지면 Grid형태)

24.05.01

분실물 작성 페이지 구현

image

분실물 작성 페이지를 구현하였습니다. 습득물 작성 페이지의 코드에서 보관위치와 상세보관위치 란을 삭제하고 재사용하였습니다.

분실물 게시판 페이지 구현

image

분실물 게시판 페이지를 구현하였습니다. 습득물 게시판 페이지의 코드에서 보관위치 란을 삭제하고 재사용하였습니다.

분실물 상세보기 페이지 구현

image

분실물 상세보기 페이지를 구현하였습니다. 습득물 게시판 페이지의 코드에서 보관위치 란을 삭제하고 재사용하였습니다.

분실물 수정 페이지 구현

image

분실물 수정 페이지를 구현하였습니다. 수정과 삭제기능을 포함합니다.
습득물 수정 페이지의 코드에서 보관위치 수정란을 삭제하고 재사용하였습니다.

24.05.02

분실물 검색 페이지 구현

image

분실물 검색 페이지를 구현하였습니다. 습득물 검색 페이지의 코드를 재사용하였습니다.

분실물 검색된 페이지 구현

image

분실물 검색된 페이지를 구현하였습니다. 습득물 검색 페이지의 코드를 재사용하였습니다.

24.05.03

한 달뒤 자동으로 삭제되는 기능 구현

한 달뒤에 자동으로 삭제되는 기눙을 구현한다.

ps 코드와 기능을 다시 보면서 문제를 정의하고 생각해봐야겠다.

24.05.05

Glide Preload 로딩 이슈 해결

이미지 로딩 개선안 Glide 관련 메서드

Glide 이미지 최적화 전 .Gif

123-ezgif com-video-to-gif-converter

Glide 이미지 최적화 후 .Gif

ezgif com-video-to-gif-converter

Glide의 override(이미지 리사이징)과 캐싱 메서드(skipMemoryCache, diskCacheStragtegy)를 사용하여 이미지를 서버에서 가져올 때 발생하는
로딩 지연의 문제를 해결(최적화)하였습니다.
추가로 로딩 중 이미지를 추가하였습니다. 에러 시에도 로딩 중 이미지가 나타납니다.

24.05.06

리스트 뷰 UI 개선

image

기존 컨텐츠 크기에 따라 변하던 리스트 뷰의 높이 크기가 고정되도록 수정하였습니다.
리스트 뷰의 높이를 통일 -> (Text(습득명,습득장소)자식요소가 일정 크기를 넘어가면 짤리게 둔다.)

24.05.06

게시글 url 공유 기능

사용자 편의성-> 하지만 공유 기능을 사용하려면 앱을 들어가야하지 않나? <- 기업의 입장에서는 앱 사용자를 유치하기 위해서는
공유기능을 넣는것이 좋아보임

업로드 할 사진의 개수를 제한하는 기능

image

업로드 한 사진이 5장 초과 시 알림이 발생하며 업로드가 불가능해집니다.

24.05.07

공유하기 기능 구현

파이어베이스 동적 링크 image image image image

개발하고자 하는 기능의 정식 명칭은 "딥링크 DeepLink"이다.
원하는 도메인이 많이 등록되어있어서 일단 보류


QnA 관리자만 댓글 달 수 있도록 수정

관리자 아이디가 아닌 경우

image

관리자 아이디인 경우(heungeob1003@gwnu.myplug.kr)

image

heungeob1003@gwnu.myplug.kr <-를 관리자로 하고 관리자일 경우에만 댓글을 작성할 수 있도록 수정한다.
관리자 아이디가 아닌 경우 댓글창이 보이지 않아 댓글을 입력할 수 없다.

24.05.09 팀회의

기능 구현 테스트

알림 기능 파이어베이스 클라우드 메시징
UI 초기설계단계임

지속적으로 진행상황
계획서 보고서

최종 제출 자료가 무엇이 될것인가

파이어베이스 클라우드 메시징 개념 FCM 알림시스템 개발

전체 사용자가 아닌 특정 사용자에게 메시지를 보내고 싶을 때는 기기마다 토큰아이디를 받아와야 한다.

image

토큰 발급 메서드인 registerPushToken() 메서드를 생성하고 로그인 시 바로 토큰이 발급되고 해당 토큰을 DB에 저장한다.

24.05.12 Solution.

FirebaseInstanceID is deprecated.FirebaseInstanceID -> FirebaseMessaging.getInstance()

유저의 토큰을 기준으로 특정 사용자/전체 사용자에게 보낼 수 있는게 fcm
이제 저걸 어떻게 구분할지는 fcm요청을 작성하는 주체에서 해야한다. 대부분이 서버 -> OKhttp 라이브러리
예를들어 사용자가 특정 기준을 제공하면 (제목 키워드 등록 등)
서버에서 신규 글이 등록되었을 때 fcm 요청을 할 대상을 걸러내는 로직 구현
api키 보안을 위해서 서버에서 푸시push를 전송해줘야한다.
하지만 서버의 전문 지식이 필요,
기존 안드로이드 디바이스가 서버 역할도 해주는 라이브러리(okhttp3, gson, multidex)를 추가한다.

com.squareup.okhttp3 
com.google.code.gson 2.10.1
androidx.mulitidex 2.0.1<-8개까지만 요청(multidex 오류 발생하기 때문에)
라이브러리 추가하고 defaultConfig안에 multiDexEnabled true 추가

24.05.13

FCMHttp -> Http V1 마이그레이션

image image 기존 HTTP 방식 사용 챗 노티

기존 Http 에서 HTTP V1으로 마이그레이션

image

기존 http 의 서버 키를 사용하는 방식으로 이번 프로젝트에서 알림 개발을 수행한 후 이후에 http v1 마이그레이션을 학습

FireStore native

구글 코솔에서만 접속 가능한 문제 해결 image image

FCM 알림 발생 성공

image

Responbody.create() is deprecated ->  val body = jsonObject.toString().toRequestBody("application/json; charset=utf-8".toMediaType()

메인액티비티에서 onStop으로 백그라운드로 이동했을 때 알림이 발생하는 지 실험, 알림이 발생하는 것을 확인

채팅 기능에 백그라운드 알림 기능 확인

image

백그라운드일 때 채팅을 보내면 알림이 발생하는 것을 확인하였다.

ps 포그라운드일때는 작동안하는 문제를 해결할 예정

24.05.17

FCM 포그라운드 알림 기능 개발 완료

MyFirebaseMessagingService.kt

MyFirebaseMessagingService의 onMessageReceived 메서드를 오버라이딩 한후 포그라운드 메시지를 보내도록 채널을 생성한 후
알림에 대한 설정을 진행하였다.

채팅 알림 포그라운드 확인

image

키워드 알림 포그라운드 확인

image

알림 body 수정

image

마지막 보낸 메시지가 알림의 메시지로 오도록 수정하였습니다.

24.05.18

포그라운드&백그라운드 알림 아이콘 수정

아이콘 수정하려는데 R 안드로이드 내장 이미지로 계속 인식되어서 drawable 에 있는 notification_icon을 찾지 못하는 문제가 있었는데
import android.R을 삭제하니까 로컬 drawable 파일에 있는 notification_icon으로 수정할 수 있었다.

24.05.19

토큰 업데이트

토큰이 기기에 종속되는 문제 

토큰 관리

24.05.21

토큰 트러블 슈팅

로그아웃 할 때 해당 uid 값을 가지는 문서로 작성된 파이어스토어의 토큰 데이터를 삭제하도록 수정하였습니다.

토큰이 기기에 종속되는 문제, 즉 1@gwnu.ac.kr로 로그인했을 때 토큰이 발급, MutuableMap 형식으로 데이터베이스에 저장되고
로그아웃 후 다른 계정인 2@gwnu.ac.kr로 로그인된 상황에서1@gwnu.ac.kr로 채팅을 보내면 알림이 발생하는 문제,
즉 1@gwnu.ac.kr 토큰이 데이터베이스에 저장되어 있기 때문에 발생되는 문제를
-> 로그아웃을 했을 때 해당 uid 값을 가지는 document의 토큰 데이터를 삭제하도록 하여 토큰이 기기에 종속되는 문제를 해결하였습니다. 

UI 디자인수정

What was IT 디자인 레퍼런스

프리텐다드 무료 폰트
피그마 Figma
M3 머터리얼 디자인
폰트 적용법 레퍼런스 디자이너스 Designus UPA - 세상의 모든 UX 패턴

분실물 & 습득물 게시판 UI 개선

Before

image

After

image

폰트크기와 사진의크기가 너무 크다는 의견 -> 1/2 씩 줄이면 적당할 것으로 예상

image

훨씬 나아짐

24.05.22

채팅 UI 수정

image

24.05.30 스크럼 회의

다음 주까지 UI 디자인 통합

1. 검색 페이지에서 기본 시작일, 종료일 = 오늘날짜, 시작일>종료일, 종료일<시작일 minDate,maxDate
날짜 범위 제한

2. QnA 페이지에서 제목을 주가 되게, 이메일은 4자리만 보여지고 뒤는 *로 숨김 표시

3. 채팅에서 채팅창 입력할 때 입력 밖을 터치하면 키보드 내려가는 기능
키보드가 올라올 때 상단바는 고정하는 기능

4. 고쳐지지 않은 폰트 레이아웃 수정


24.05.31

시작일을 5월 15일로 했을 때

image

종료일은 5월 15일 이전은 선택하지 못함

image

datePicker.minDate 에 시작일로 선택한 값으로 설정한다. (시작일 값을 전역 변수로 생성해서 따로 저장)

종료일을 5월 15일로 했을 때

image

시작일은 5월 15일 이후는 선택하지 못함

image

datePicker.maxDate에 종료일로 선택한 값으로 설정한다. (종료일 값을 전역 변수로 생성해서 따로 저장)

QnA 페이지에서 제목을 주가 되게, 이메일은 4자리만 보여지고 뒤는 *로 숨김 표시

image

QnA에서 제목과 이메일의 위치를 서로 변경하고, 이메일의 4자리만 보여지게 하고 나머지는 *로 숨김 처리하였습니다.

3. 채팅문제

스택 오버플로우 Android Toolbar moves up when keyboard appears
컴포즈 키보드 조작
2024-05-31 13;34;31


채팅할 때 키보드가 올라왔을 때 최상단의 앱 바가 사라지는 문제(The problem is Android Toolbar moves up when keyboard appears) 를 해결하였습니다.

삽질 3시간...................

rejustPan 으로 키보드가 올라왔을 때 전체 액티비티가 올라가고 상단바를 고정시켜야겠다고 생각했습니다.
하지만 rejustResize 옵션을 주고 키보드가 올라왔을 때 레이아웃의 변경을 감지하는 리스너를 오버라이딩으로 호출한다음
키보드의 높이 만큼 채팅 리사이클러뷰의 높이를 조절하게끔 하니까 잘 작동하는 것을 알 수 있었습니다.

24.06.01

키보드 입력 버튼 수정

2024-06-01 02;05;13

입력 창에 메시지가 입력되어 있을 때 버튼이 보여지도록 수정했습니다.

두마리의 토끼 -> 아무것도 입력 안되어 있을 때는 메시지 전송을 하지 못함
애니메이션? 효과

Optimize imports 코드 최적화

image image

프로젝트 왼쪽마우스 -optimize imports 기능을 사용하여 사용하지 않는 라이브러리를 import 하는 코드를 삭제해주었습니다.

사용하지 않는 라이브러리를 코드에서 import한다면 그만큼 자원을 낭비하는 것(dummy code)이므로 이를 정리해주었습니다.

단축키로는 ctrl + alt + o 니까 개발할 때 자주 사용해봐야겠습니다.

24.06.04

게시글의 자세히보기 페이지(inside)에서 이미지들을 옆으로 슬라이드해서 볼 수 있도록 하는 기능인 ViewPager2를 적용할 예정입니다.

문제해결 - 이미지가 없을 때 액티비티의 공간을 차지하는 문제를 visibility gone 속성을 카드뷰와 이미지뷰에 줘서 해결하려고 했으나 오류발생, 페이저뷰 어댑터 안에 이미지뷰를 child 요소로 넘겨주면 구현가능할 것으로 예상

viewPager2 위젯

24.06.05

2024-06-05 03;09;22

viewPager를 적용하고 indicator 까지 연결하였습니다.

오류 비동기로 서버에서 이미지를 받아오도록 처리하였는 데 동일한 이미지를 불러오는 것으로 보아 delay를 주던지 suspend로 일시정지하던지
해야 할 것 같습니다.

2024-06-05 03;14;01

...

페이지뷰2 이미지 오류 수정

2024-06-05 03;38;45 image

이미지 경로를 key+i로 받던것을 key+position으로 수정하였습니다. (for문에서 position값을 이용하도록 수정)

정상적으로 페이지뷰가 작동하는 것을 확인하였습니다.
글 작성 시 작성해야 될 문항이 많아 스크롤되어 작성 버튼이 맨 아래에 있는 경우 불편함

앱 상단바에 글작성 버튼을 둔다면 사용자들이 글 작성버튼의 위치를 작성 페이지 초기에 인식할 수 있고

스크롤 밑으로 내리지않고도 상단바에 고정되어 있는 버튼을 누름으로써 편리함

24.06.06

글 작성 페이지의 작성 버튼 위치 수정

2024-06-06 01;33;47

스크롤을 밑으로 끝까지 내리지 않고도 상단바에 위치한 글 작성 버튼을 누를 수 있어 편리하다.

24.06.08

UI 디자인 반영

버튼과 텍스트들을 사용자들이 알아보기 쉽도록 색을 수정하였습니다.

24.06.09

자동 로그인 기능 추가 - 앱 사용자는 앱을 사용하기 위해서 번거로운 인증의 과정을 거치지않고 로그인할 수 있다.

FCM 알림 끄기 기능 추가

채팅 알림 기능 on/off 테스트

2024-06-09 17;25;54

키워드 알림 기능 on/off 테스트

2024-06-09 17;27;51

앱 내에서 데이터를 저장하고 삭제할 수 있는 SharedPreference 데이터베이스를 사용하여 앱의 알림 기능을 끄고 키는 기능을 추가하였습니다.

24.06.10

QnA 댓글 알림 기능

2024-06-10 04;40;36

QnA 게시판에 관리자의 댓글이 달리면 알림이 발생한다.

24.06.13 프로젝트 최종 스크럼 회의

최종 피드백 : 신고 페이지에서 사진느낌이 안나도록 수정
이메일 형식에서 @ 부터 뒤 절삭

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •  

Languages