(TIL) 2020-09-15 기록

오늘 한 일

• 오늘은 태그 기능 구현에 집중했다.
• #이 입력되면 textState가 Plane에서 Tag로 바뀐다. 그럼 Tag인 동안에는 텍스트가 바뀔 때마다 Algolia를 통해 검색을 하고 반환된 결과를 저장한다. 만약 제일 최근에 입력된 글자가 공백문자이거나 개행문자면 Tag state를 Plane State로 전환해버린다.
• 이제 반환된 결과를 저장하는 데서 그치면 아무런 의미가 없고 #이 입력된 적절한 위치 바로 아래에 드롭다운 리스트가 뜨면서 추천하는 태그들을 보여줘야 한다. 이 문제를 해결하기 위해 이 문서를 참고했다.
• 기본적으로 nodeFocus를 이용해 #이 입력되었던 곳의 Offset을 저장해두었다가 OverlayEntry 객체를 생성하고 그 내부에 위젯의 위치, 크기 등을 정해준 뒤 가장 가까운 Overlay를 찾아 삽입해주는 것이다.
• 스크롤을 해버리면 떠있는 위젯만 덩그러니 남아있고 나머지만 올라가버리는데 이걸 방지하기 위해서 LayerLink 객체를 생성해준 다음 따라 붙을 위젯을 CompositedTransformTarget 위젯으로 감싸주고 이 위젯을 따라다닐 위젯을 CompositedTransformFollower 위젯으로 감싸준 뒤 둘 다에 link 파라미터에 생성해뒀던 LayerLink를 넣어주면 스크롤을 해도 잘 붙어서 따라다닌다.
• 기본적인 태그 기능이 완성됐으니 이제 녹음 파일과 글을 업로드하는 기능을 완성해야겠다.

내일 할 일

• 공개 보이스 업로드 기능을 만들어 볼 것이다. 만약 완성하게 되면 태그 기능을 완벽하게 구현한 뒤 태그를 포함한 보이스들을 필터링해서 화면에 보여주는 기능도 만들어야 한다.