개인 과제 - 기차 예매 서비스

1. 깃허브링크

• 기차 예매 서비스

2. 구현 기능

명세

✅ 각 UI 디자인 명세

필수 기능

✅ 1. HomePage 구현
✅ 2. StationListPage 구현
✅ 3. SeatPage 구현

도전 기능

✅ 1. UX(사용자 경험)를 고려한 기능
🤔 2. 다크 테마 적용
❎ 3. 나만의 기능 구현 x

3. 트러블슈팅

1. 역 이름이 길면 화면이 깨지는 등 에러가 발생함.

• 문제: 역 이름이 길어 화면을 벗어나게 되면 특정 줄이 생겨 화면에 에러가 발생함.

  • 화면 공간의 부족으로 발생한 것으로 유추함.

  • overflow 속성의 기본값을 TextOverflow.visable로 설정하여 텍스트가 잘리지 않도 록함.

  • 하지만, 이를 사용해도 지정된 박스 값에서 한 줄로 역 이름이 보이지 않음.

  • 따라서 4글자의 역은 한 줄로 표시가 안되어서, 한 줄에 표시할 수 있는 글을 제한하여 ...으로 처리

2. 세로선과 화살표가 고정되지 않은 문제

• 문제: 출발역과 도착역을 구분하는 세로선과 화살표 아이콘이 다른 위젯의 텍스트에 따라 이동하거나 제대로 정렬되지 않는 문제가 발생.

  • 초기에는 같은 글자의 역으로 코드를 짜고 테스트를 진행하여 문제가 없는 줄 알았지만, 다른 글자와의 역 이름을 선택하면서 문제를 발견함.

  • Row나 Column 위젯을 사용할 때 mainAxixAligment와 같은 속성이 제대로 설정되어있지 않으면, 그 안에 포함된 위젯들이 예상대로 배치되지 않았음.

  • Expanded 위젯을 사용하여 화살표와 세로선을 고정하고, 역 이름이 각자 좌우에 고정적으로 배치될 수 있게함.

3. 예매 후 이전 페이지로 돌아가지 않는 문제

• 문제: 좌석 예약을 완료한 후나 취소하였을 때 자동적으로, 이전 페이지로 돌아가지 않음.

  • 예약을 하려다가 취소한 경우에는 Navigator.pop(context)를 사용하여 이전 화면으로 돌아가도록 처리함.
  • 예약 후에는 Navigator.pop()을 두 번 호출하여 현재 화면과 이전 화면을 모두 종료하도록 하여 homepage로 이동하게 함.

4. 다크모드가 제대로 되지않음.

• 문제: 도전기능에서 명시되어있는 다크모드처럼 되지않음. 특정 페이지의 특정 위젯은 다크모드로 변하지가 않음.
  • 특정 부분만 다크모드가 구현됨.
  • 다른 기능을 완성하고 보완하는데 시간을 많이 투자하여 현재 작성하고 있는 시점에는 제대로 완성을 하지 못함.

5. 예약 후 저장기능이 없음.

• 문제: 사용자가 좌석을 예매한 후 다시 좌석 선택을 눌렀을 때 예약한 좌석이 빈자리인지 아닌지 확인이 불가능함. 내가 무슨 좌석을 선택했는지 알 수 있는 방법이 없음.
  • UX를 생각한다면 구현하는게 맞겠다만, 다른 기능을 우선시하느라 구현하지 못함.