Expanded / Flexible

Expanded / Flexible

두 위젯 모두 Column이나 Row에서만 쓰여야함
(flex의 child가 쓰이는 위젯)

Expanded (FlexFit.tight)

공식 홈페이지 따르면, 변경할 수 있는 것 중에서, 크기를 조절하기 위해 쓰인다는 내용이 있다.

여러 개가 쓰일 때는 flex를 높여서 쓰인다는 내용도 있다.

expanded는 프로젝트나 각종 부분에서 많이 쓰이지만 flex error를 항상 생각하고 써야했던 것 같다.

그리고 강제적으로 차지할 공간을 다 차지하려고 할 때 사용한다.

공식 홈페이지 예시는 아래와 같다.

      body: Center(
        child: Row(
          children: <Widget>[
            Expanded(
              flex: 2,
              child: Container(
                color: Colors.amber,
                height: 100,
              ),
            ),
            Container(
              color: Colors.blue,
              height: 100,
              width: 50,
            ),
            Expanded(
              child: Container(
                color: Colors.amber,
                height: 100,
              ),
            ),
          ],
        ),
      ),
      
   //flex가 2인 친구가 더 큰 비율을 가짐

Flexible

고정된 위젯은 쉽지만.. column이나 row의 상대적인 크기를 원할 때 쓰인다고 flutter는 소개한다.

flexible이 여러개 쓰이면.. flex를 사용해서 조절한다.

3가지가 flexible로 감싸있고 2,3,1이라면 2/6 , 3/6, 1/6으로 쓰인다고 생각하면 될 것이며, 고정된 친구들이 있다면 그 친구들이 먼저 길이가 잡힌다고 생각하자

추후에는 사이드로 만들면서 rewind가 아닌 실제 코드로 하나씩 쓸 예정...