[공지][Front] front 요소들 크기 관련

[sunJ0120]

기존에 대부분 width, height를 지정값으로 지정하셨으리라 생각합니다 (저도 버튼 크기 같은걸 거의 지정값으로 했더라구요...) 근데 이렇게 할 경우, 폰 크기에 따라 ui가 망가질 위험이 있습니다.

그래서 아래와 같이 현재 폰크기를 받아서 값을 지정해야 합니다. 저의 경우는 따로 클래스를 생성해서 get으로 이 값들을 받아올 수 있게 설정할 예정입니다.

MediaQueryData mediaQuery = MediaQuery.of(context); 
double screenWidth = mediaQuery.size.width;
double screenHeight = mediaQuery.size.height;

그래서 이처럼 현재 화면값을 받아온 다음, 이 안에서 동적으로 요소를 생성해야 합니다.

style: ElevatedButton.styleFrom(
      fixedSize: Size(screenWidth*0.9, screenHeight*0.08),
      padding: EdgeInsets.symmetric(horizontal: 20, vertical: 5),
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(20),
      ),
      backgroundColor: Color(0xFF4B4A48),
),

예시로, 저의 경우 버튼 사이즈를 screenWidth0.9, screenHeight0.08 이런식으로 조정했는데 크기가 딱 알맞았습니다. 워낙 폰 기기 화면 크기가 천차만별이라...이렇게 화면 크기에 맞게 동적으로 사이즈를 구성하는게 좋을 것 같습니다.

저도 모든 화면의 요소를 다 이렇게 바꾼건 아니고, 실험적으로 오늘 개발한 bottom시트 부분만 바꿔본거여서 송금 화면 ui 요소들 전부 이런식으로 바꾸고 결과들 이슈로 달아두려고 합니다.

---

기존에 요소 생성할때는 고정값으로 했었는데, 예를들면

style: ElevatedButton.styleFrom(
    fixedSize: Size(346, 73),
    padding: EdgeInsets.symmetric(horizontal: 20, vertical: 5),
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(20),
    ),
    backgroundColor: Color(0xFF4B4A48),
  ),

Size(346, 73) <- 이런식으로 고정값으로 했었습니다