flutter에서 Row와 Column 내 텍스트 왼쪽 정렬 및 여백

Row

Flutter의 Row 위젯은 자식 위젯을 수평으로 정렬하는 위젯입니다.

자식 위젯을 왼쪽에 붙이기 위해서는 MainAxisAlignment 속성을 사용하여 자식 위젯들을 왼쪽으로 정렬할 수 있습니다.

아래는 Row 위젯 내부에 Text 위젯을 왼쪽에 붙이는 예시 코드입니다.

 

Row(
  mainAxisAlignment: MainAxisAlignment.start,
  children: [
    Text('왼쪽에 붙일 텍스트'),
    // 추가적인 자식 위젯들
  ],
)

 

위 코드에서 MainAxisAlignment.start는 자식 위젯들을 Row 위젯의 시작 부분에 정렬하도록 설정하는 것입니다.

이렇게 설정하면 Text 위젯이 Row 위젯의 좌측에 붙어 출력됩니다.

필요에 따라 추가적인 자식 위젯을 children 배열에 추가하여 Row 위젯 내부에 배치할 수 있습니다.

 

Column

Flutter의 Column 위젯은 자식 위젯을 수직으로 정렬하는 위젯입니다.

자식 위젯을 왼쪽에 붙이기 위해서는 CrossAxisAlignment 속성을 사용하여 자식 위젯들을 왼쪽으로 정렬할 수 있습니다.

아래는 Column 위젯 내부에 Text 위젯을 왼쪽에 붙이는 예시 코드입니다.

 

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [
    Text('왼쪽에 붙일 텍스트'),
    // 추가적인 자식 위젯들
  ],
)

 

위 코드에서 CrossAxisAlignment.start는 자식 위젯들을 Column 위젯의 시작 부분에 정렬하도록 설정하는 것입니다.

이렇게 설정하면 Text 위젯이 Column 위젯의 상단에 붙어 출력됩니다.

필요에 따라 추가적인 자식 위젯을 children 배열에 추가하여 Column 위젯 내부에 배치할 수 있습니다.

 

Text 여백

Flutter의 Text 위젯은 Padding 위젯을 사용하여 텍스트에 여백을 추가할 수 있습니다.

여백의 크기는 EdgeInsets 클래스의 인스턴스를 사용하여 지정할 수 있습니다.

아래는 Text 위젯에 왼쪽 여백을 추가하는 예시 코드입니다.

 

Padding(
  padding: EdgeInsets.only(left: 16.0),
  child: Text('왼쪽에 여백이 추가된 텍스트'),
)

 

위 코드에서 EdgeInsets.only는 해당 방향의 여백만 설정할 수 있는 메서드입니다.

left 매개변수를 사용하여 왼쪽에만 여백을 추가하도록 설정하였습니다.

이렇게 설정하면 Text 위젯의 왼쪽에 16.0 포인트의 여백이 추가됩니다.

필요에 따라 right, top, bottom 등의 방향에도 여백을 추가할 수 있습니다.