[flutter] Row 위젯에서의 아이콘 사용하기

Row 위젯은 가로 방향으로 위젯들을 배열하는데 사용되는 Flutter의 내장 위젯입니다. Row 안에 다른 위젯들을 자유롭게 포함시켜 사용할 수 있습니다. 이번 예시에서는 Row 위젯 안에서 아이콘을 사용하는 방법에 대해 알아보겠습니다.

아이콘 위젯 가져오기

먼저 아이콘을 사용하기 위해서는 Material 디자인에 기반한 아이콘 위젯을 가져와야 합니다. 아이콘 위젯을 사용하기 위해 import 'package:flutter/material.dart';를 추가하세요.

import 'package:flutter/material.dart';

아이콘 추가하기

이제 Row 위젯 안에서 아이콘을 추가해보도록 하겠습니다. 아래의 예시를 참고하세요.

Row(
  children: [
    Icon(Icons.home), // 홈 아이콘
    Icon(Icons.settings), // 설정 아이콘
    Icon(Icons.person), // 프로필 아이콘
  ],
)

위의 예시에서는 Row 위젯 안에 세 개의 아이콘을 추가했습니다. Icons.아이콘_이름 형태로 아이콘을 지정할 수 있습니다.

아이콘 스타일링하기

Row 위젯에서 아이콘을 사용할 때는 아이콘의 색상, 크기 등을 스타일링할 수 있습니다. 예를 들어, 아이콘의 크기를 조절하고 색상을 변경하고 싶다면 Icon 위젯 내부에서 sizecolor 속성을 사용하세요.

Row(
  children: [
    Icon(Icons.home, size: 24, color: Colors.red), // 홈 아이콘, 크기 24, 빨간색
    Icon(Icons.settings, size: 24, color: Colors.blue), // 설정 아이콘, 크기 24, 파란색
    Icon(Icons.person, size: 24, color: Colors.green), // 프로필 아이콘, 크기 24, 초록색
  ],
)

위의 예시에서는 각각의 아이콘에 사이즈와 색상을 적용하였습니다.

결론

이제 여러분은 Row 위젯을 사용하여 아이콘을 가로로 배열하는 방법에 대해 알게 되었습니다. 이를 통해 원하는 방식대로 아이콘을 배치하여 UI를 구성할 수 있을 것입니다. Flutter는 다양한 아이콘을 제공하므로 다양한 UI 요구사항을 충족시킬 수 있습니다.

자세한 내용은 Flutter 아이콘 위젯 설명서를 참고하세요.