플러터(Flutter) 앱을 개발할 때 종종 아이콘과 텍스트를 함께 표시해야 하는 경우가 있습니다. 이를 위해 Row 또는 Column 위젯을 사용하여 아이콘과 텍스트를 함께 배치할 수 있습니다.

아이콘과 텍스트 배치하기

가장 간단한 예제로는 Icon 위젯과 Text 위젯을 Row 위젯 안에 배치하는 방법입니다.

Row(
  children: <Widget>[
    Icon(Icons.star),
    Text('별표'),
  ],
)

위의 예제에서 Row 위젯은 자식으로 Icon과 Text 위젯을 포함합니다. 이렇게 함으로써 아이콘과 텍스트가 가로로 배치됩니다.

아이콘과 텍스트 스타일링하기

Row 또는 Column 위젯 안에 포함된 각 위젯은 각각의 스타일을 적용할 수 있습니다. 예를 들어, 텍스트의 스타일을 바꾸거나 아이콘과 텍스트 사이의 간격을 조절할 수 있습니다.

Row(
  children: <Widget>[
    Icon(Icons.star, color: Colors.yellow),
    SizedBox(width: 5),
    Text('별표', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
  ],
)

위의 예제에서 Icon 위젯에는 color 속성을 사용하여 색상을 변경하고, Text 위젯에는 style 속성을 사용하여 글꼴 크기와 두께를 변경하였습니다.

결론

위의 예제를 참고하여 플러터 앱에서 아이콘과 텍스트를 함께 표시하는 방법에 대해 학습하실 수 있습니다. 아이콘과 텍스트를 함께 사용하여 사용자와 소통하는 UI를 구성할 수 있습니다.

더 자세한 내용은 플러터 공식 문서를 참고하시기 바랍니다.