본문 바로가기

일상+자잘한 일/개발일지-unsolved.hgu

[Flutter/unsolved.ac/02] 위젯 레이아웃

[22/12/03] 전에 이야기했던 것처럼 웹을 배포 기준으로 할 것이기 때문에 모바일 환경과 웹 환경을 다르게 해줄 필요가 있었다.

따로 비율에 따라 반응형(responsible)으로 구현하고 싶어 LayoutBuilder를 사용했다.

BoxConstraints constrained를 통해서 현재 비율을 가져오고 1:1이 되는 경우부터 PC화면으로 간주하고 widget을 돌려주도록 하였다.

return LayoutBuilder(
    builder: (BuildContext context, BoxConstraints constrained) {
  return Container(
    width: constrained.maxWidth,
    height: constrained.maxHeight,
    child: (constrained.maxWidth / constrained.maxHeight) >= 1
        ? _buildPC()
        : _buildMobile(),
  );
});

완성본:https://youtu.be/1iFPER_etxw

 

아쉬운점: 혼자서 하려고 하다보니 문제점이 좀 많았던 것 같다.

  1. Flutter에서(프론트) api호출을 하도록 구현하여 문제점이 많다.
  2. firebase를 사용하는데 생각보다 호출 횟수 이슈가 있다. (플러터는 아직 웹 쿠키데이터가 없어 호출이 잦다)

해결방안: 교수님과 졸업한 선배님 한분께 피드백을 받았는데 시간 내주시고 적극적으로 도와주셔서 감사하다 ㅎㅎ

  1. 백엔드에서 cronjob을 사용
  2. js를 통해 웹사이트로 구현해보기.