로그) 글자 출력 구현 그리고 환장파티

이전 글에서 대사 출력 방식을 정하고 바로 코딩한 후에 실행을 하니 작동을 안 했습니다. 뭐 늘 그랬으니 기대도 안 했어요. 하지만 다음부턴 조금씩 만들고 꼭 바로바로 테스트를 해야겠군요..

문제점을 조금씩 찾아 고치긴 했지만, 버그가 한두개가 아니어서 또 집중력이 뚝 떨어지고 있는 나 자신을 발견했습니다. 고작 대사 출력 기능 하나 완성하기 위한 로그지만, 그래도 분명 도움이 되겠죠.

---

& : Event 해결 문자와 어울려서 변경
₩ : Event
- : Log
@ : Problem
$ : Solved 이 블로그의 MathJax LaTeX 문법 때문에 두 개씩 사용할 수 없음.
& : Soved
※ : Need search

---

2.25

@ 처음 작동 시 모든 대사가 표시됨
@@ 특수 문자가 변환되지 않음
& 처음 작동 시 기다리지 않고 표시 순서를 옮기니 바로 표시됨,
@ 하지만 처음 작동 시 바로 표시되지 않는 것이 목표
- 처음 작동 시 검사한 글자 순서가 표시 순서보다 1 앞섬을 확인
- 모든 이벤트 시트에서 관리할 필요가 없거나, 확실히 하나만 존재해야 하지 않은 변수는 인스턴스 변수로 변경, 관련 코드 모두 수정
// 디버그 모드에서 확인하기 수월해짐.
- 검사중인 문자 순서를 저장할 인스턴스 변수 생성
- 해당하는 태그가 없을 때 글자 여부를 true로
- 반복문에 사용하는 인스턴스 변수를 모두 지역 변수로 변경, 관련 코드 모두 수정
- 태그 변환 함수에 현재 문자 매개변수 추가
&& 특수 문자가 변환됨
@@ 그러나 태그가 닫히지 않음
- 효과 여부를 저장하는 지역 변수를 인스턴스 변수로 변경, 관련 코드 모두 수정
&& 태그가 잘 닫힘
// 지역 변수는 프레임마다 초기화되나보다.
@@ 특수 문자가 출력됨
// 이것도 지역 변수 초기화 문제임을 확인. 근데 한 프레임, 심지어 반복문 안에서도 초기화된다..? 그룹 지역 변수인데?
// 내 생각엔, 그룹 지역 변수는 그룹의 이벤트가 실행될 때마다 초기화되나보다.
// By default, local variables reset to their initial value whenever entering their scope (usually every tick)
- 전역 변수로 옮겨보니 특수 문자가 잘 생략됨
@@@ 무지개 특수 효과가 적용 안 됨
- 투명 태그와 색 태그가 충돌하는 문제임을 확인
&& 글자 여부를 판단하는 그룹 지역 변수를 정적 변수로 수정
& 투명 태그 다음에 글자를 출력함
@ 일부 특수문자에서 출력 속도가 느려지지 않음
& 현재 순서의 글자를 저장하는 코드 위치 변경
- 대사 출력 속도 지역 변수를 추가해서 코드 간소화

₩ 대사 출력 속도 관리 함수를 출력이 끝나면 자동으로 종료되게 하고 싶은데,, 출력이 끝났는지 확인할 방법은? (어떻게 작동하는지와 관련 X)
// 출력이 끝난 뒤에도 반복중이면 다음 대사 출력 시 문제 발생할 수 있음.
// 1. 전체 글자 수를 저장해서 현재 글자 수와 비교한다. (비효율)(다음 대사에서도 일치한다고 판단할 수 있으므로 부적절)
// 2. 마지막 글자를 저장해서 현재 마지막 글자와 비교한다. (비효율)(멍청이)
// 3. 처음 함수 실행 시 표시 순서가 -1일 때만 작동하게 한다. (허술함)(마치 이거)
// 4. 글자의 반복문 순서와 표시 순서가 일치할 때만 작동하게 한다. (다음 대사에서도 즉시 일치한다고 판단하므로 부적절)
// 5. 매개변수를 추가하고, 표시 순서와 매개변수가 같을 때만 작동하게 한다. (이전 함수 중단)(가장 효율)
// 6. 처음 대사를 출력할 때마다 전체 글자 수를 저장하기 위해 태그 여부를 판단하는 함수를 새로 정의 (가장 단순)
※ 7. 문자열의 끝을 의미하는 특수문자가 있다면 속도를 늦추는 문자와 함께 검사함. (그런 특수문자가 있나? 있다면 무엇? 또 다른 방법도 있나?)
※ 함수를 매 프레임마다 실행하고, Every seconds 이벤트로 시간을 제어할 수 있을까? (당장은 몰라도 됨)
- 0, 1을 거짓, 참으로 대신하는 전역 상수 선언, 관련 코드 교체
- 속도를 늦추는 문자를 판단하는 이벤트를 새로 정의한 반환 가능한 함수로 옮김
// OR 연산자를 사용하려면 하위 이벤트에 있어야 함.
- 태그 여부를 판단하는 함수에 반환값 추가, 관련 코드 수정, 글자 여부를 저장하는 지역 변수 삭제 [0]
// 함수가 잘 작동한다. 그 의미는 반환 액션이 없다면 0이 반환된다는 의미.
- 위의 7가지 방법 중 5번을 적용
// 별 문제는 아니지만, 글자 표시 순서가 글자 개수를 넘어섬.
@ 가끔 두 글자 정도 출력 후 멈추는 현상

₩ color 태그는 겹치면 마지막 태그가 적용된다. 마지막으로 표시한 글자 뒤엔 태그를 추가하지 않게 만들자
// 1. 기존 반복문을 그대로 쓰려면 [0]을 되돌린 후 태그 변환 함수에서 조건문을 매번 확인해야 함. (비효율)
// 2. 위의 7가지 방법 중 6번을 적용하면, 글자로만 이루어진 문자열를 미리 저장해두었다가 마지막 표시 글자 뒤에 사용하거나 길이를 구해서 출력이 끝났는지도 확인할 수 있음.

---

2.26

// 1번 방법은 조건문을 반복문에 추가할 수는 없음. 어차피 태그 여부 판단하는 함수가 태그 변환 함수도 호출하니까.
// 그렇다면 2번 방법처럼 태그 여부만 판단하는 함수만 새로 정의하면 반복문에 조건문을 추가할 수 있음. (조건문 반복 확인 vs 문자열 저장과 반복문 두 개)
- 감속 문자 판단 함수에 매개변수 추가, 조건문 수정
- 사용하는 특수 문자를 모두 저장한 상수 문자열 추가
- 위의 문자열으로 글자 여부를 반환하는 함수 추가
- 반복문에서 읽는 문자 순서를 저장하는 지역 변수 제거 (루프인덱스 이용)
// 생각해보니 2번 방법도 다음 대사로 넘어가면 문자열이 바뀌기 때문에 속도 관리 함수가 중단되지 않을 수 있음. 속도 관리 함수를 매 프레임마다 실행하거나 1번 방법을 이용해야 함. 아니면 속도 관리 함수의 매개변수도 텍스트의 인스턴스 변수로 옮기면?
// 게다가 이런 식으로 출력 관련 변수를 인스턴스 변수로 모두 바꾸면 기존 코드로 두 개 이상의 텍스트를 동시에 출력도 가능. 하지만 Foreach 인스턴스가 더 효율적인 방법일 수 있음.
// 와 나 지금 또 뭐 하는거야.
// 또 불확실한 기획으로 내 수준보다 높은 논리를 강구하며 허우적대고 있잖아! 이러면 안 돼!!!!!
// 뭐가 더 비효율적인지 작성하고 비교하고 있는 시간이 비효율적이란 걸 왜 또 망각하고 있는데?
// 특단의 조치. 지금부터 효율 따지지 않고 무조건 직관적인 코드만을 지향한다.
// 어제나 오늘이나 언제나 그랬듯 비교 대상끼리 성능에 별 차이도 없다. 변수 네다섯개 더 만든다고 뭐가 많이 달라져? 또 잊었네.
// 그리고 또 하나 어제 다짐해놓고 잊은 것. 'Need Search'를 적극적으로, 망설임 없이 사용하자.
※ '가장' 효율적으로 조건문과 지역 변수, 인스턴스 변수를 생성해서 마지막으로 표시한 글자 뒤에 태그를 추가하지 않을 방법은?
- 언젠간 쓸지도 모르니 그냥 미리 글자만 인스턴스 문자열을 생성해서 저장하는 함수 생성
// 적어도, 매 프레임마다 반복하는 것보단 한 번만 미리 처리하는 게 더 효율적일 가능성이 훨씬 높잖아? 이 생각도 못 했네. 이것도 항상 염두해두자.
// 매 프레임 반복 < 한 번만 미리.
※ Construct 3에서 문자열로 Foreach 할 수 있나?
- 현재 검사중인 문자를 저장하는 지역 상수를 그룹 최상단으로 옮김
- 현재 표시중인 글자를 원글과 표시 순서로 확인, 현재 글자를 저장하는 인스턴스 변수 삭제
- 매 프레임마다 효과 적용하는 불 변수 초기화
// 이전까진 초기화 안 해도 잘 표시됐는데, 어떻게 된거지??? ←이전까진 마지막 표시 글자 다음에도 태그를 검사했으니까.
@@@ 표시 글자 뒤로 태그를 생성하지 않는데도 불구하고 글자 색이 그대로임
// 스프라이트 폰트만 BBcode의 color=hsl 태그를 사용할 수 있다는 것을 알아냄
// 하지만 저 메뉴얼에서 설명하는 모든 태그가 스프라이트 폰트에서만 사용할 수 있는 건 아님. hide 또는 opacity 등이 텍스트에도 사용 가능.
- color 태그 인수에 sin()과 rgb()로 추가했더니 실패
- 0과 100 사이로 조절하기 위해 50 범위의 sin값에 50을 더함
- 샾이 안 붙어있는 것을 발견, 붙임
- rgb()는 2자리씩 16진수를 반환하지 않아 이상한 결과 발생
- rgb 관련 다른 시스템 표현식 함수도 마찬가지
- 관련 함수의 반환값을 16진수로 변환하면 HEX 코드임을 확인
// 1. 이 반환값을 16진수로 변환하고, 남는 자리수를 0으로 채운다.
// 2. R, G, B값을 각각 16진수로 변환하고, 한자리수라면 0을 붙인다.
// 2번 방식으로 결정
- 진수 변환 함수 정의

---

2.27

- 10진수를 16진수로 변환하는 함수 정의
- 변환하고, 남은 길이를 0으로 채우는 메소드를 사용하기 위해 자바스크립트 블록을 추가
- 인터넷에서 찾은 관련 코드 복붙
- 무지개 효과 인수를 반환하는 함수 정의
- 진수 변환 함수가 아무것도 리턴하지 않음을 확인

---

2.28

- 변수 접근 경로를 변경했음에도 문제가 해결되지 않음
- 반환 메소드를 사용하여 해결
※ 스크립트 블록을 사용하면 항상 비동기로 실행하나?
- 갑자기 toString 함수에서 TypeError 발생
- 스크립트 지역변수에 할당할 때 위의 오류 발생 확인
- 분명 원래 안 그랬는데, 할당하지 않고 바로 반환해도 오류 확인
- 아 매개변수에 오타가 있었네 수정
- 소수점을 버리기 위해 round() 사용
&&& 색이 바뀌기 시작했으나 명도만 바뀜
- 색의 3원소의 값이 거의 차이가 없음을 확인
- sin()의 매개변수가 60분법임을 확인, G와 B에 각각 120, 240을 더함.
// sin()을 제곱하면 명도가 높아짐. (채도는?)
// 와, 이렇게 스프라이트 폰트가 아닌 텍스트에 무지개 효과를 넣은 사람은 얼마 없을 거야!

---

우여곡절 끝에 완성했다. 버그 하나 고치는데 이게 뭐라고 4일이 걸렸다.

하지만 또 한 번 값진 깨달음을 얻었으니, 앞으로의 개발 일정이 이 기능을 만드는 시간의 두 배는 줄었을 거라고 생각한다. ㅎㅎㅎ&