Flutter는 텍스트 스타일링을 지원하는 RichText 위젯을 제공합니다. RichText를 사용하면 텍스트의 서로 다른 부분에 서로 다른 스타일을 적용할 수 있습니다. 예를 들어, 서로 다른 색상, 글꼴 크기 및 글꼴 스타일을 사용할 수 있습니다. 이를 통해 더욱 다양하고 풍부한 텍스트 효과를 적용할 수 있습니다.
다음은 Flutter에서 RichText를 사용하는 예시 코드입니다. 이 예시 코드에서는 두 개의 TextSpan을 RichText 위젯에 추가하고 각각 서로 다른 스타일을 적용합니다.
RichText(
text: TextSpan(
text: 'Flutter is ',
style: TextStyle(
color: Colors.black,
fontSize: 20.0,
fontWeight: FontWeight.bold,
),
children: <TextSpan>[
TextSpan(
text: 'awesome',
style: TextStyle(
color: Colors.blue,
decoration: TextDecoration.underline,
),
),
TextSpan(
text: '!',
style: TextStyle(
color: Colors.black,
fontSize: 20.0,
fontWeight: FontWeight.bold,
),
),
],
),
);
이 예시 코드에서는 RichText 위젯을 생성하고, text 속성을 설정하여 TextSpan 객체를 전달합니다. TextSpan 객체는 첫 번째 TextSpan에는 “Flutter is”라는 텍스트를 나타내는 TextStyle 객체를 포함하고, 두 번째 TextSpan에는 “awesome”라는 텍스트를 나타내는 TextStyle 객체를 포함합니다.
첫 번째 TextSpan의 TextStyle 객체는 글꼴 크기가 20, 굵은 글꼴, 검은색 텍스트로 설정됩니다. 두 번째 TextSpan의 TextStyle 객체는 파란색으로 텍스트를 강조하고 밑줄을 추가합니다.
RichText 위젯은 이 두 개의 TextSpan을 결합하여 “Flutter is awesome!”라는 텍스트를 나타냅니다. 결과적으로, “Flutter is”는 검은색 굵은 글꼴로 표시되고, “awesome”는 파란색 밑줄로 강조된 텍스트로 표시됩니다. 마지막으로, 끝에는 다시 검은색 굵은 글꼴로 된 느낌표가 있습니다.