[flutter] RichText에서 텍스트에 그림자 효과 주기
RichText 위젯을 사용하여 Flutter 앱에서 다양한 텍스트 스타일을 쉽게 적용할 수 있습니다. 텍스트에 그림자 효과를 주고 싶을 때도 꽤 간단하게 구현할 수 있습니다.
이 포스트에서는 Flutter의 RichText 위젯을 사용하여 텍스트에 그림자 효과를 적용하는 방법을 알아보겠습니다.
RichText 위젯
RichText 위젯은 여러 스타일과 서식을 가진 텍스트를 표시할 수 있는 Flutter의 강력한 위젯입니다. RichText를 사용하면 하나의 텍스트 문자열에 대해 여러 가지 서식을 지정할 수 있습니다.
RichText(
text: TextSpan(
style: TextStyle(
color: Colors.black,
shadows: [Shadow(color: Colors.grey, blurRadius: 2)],
),
children: <TextSpan>[
TextSpan(text: 'Hello', style: TextStyle(fontWeight: FontWeight.bold)),
TextSpan(text: ' World!'),
],
),
)
위의 예제에서는 RichText를 사용하여 “Hello World!”라는 텍스트를 보여주고 있습니다. 그림자 효과를 적용하려면 TextStyle
의 shadows
속성을 사용하여 그림자를 정의하면 됩니다.
그림자 효과 적용하기
RichText의 TextStyle
에서 shadows
속성은 리스트 형태의 Shadow
를 받습니다. Shadow
객체를 생성할 때 색상과 블러(흐림) 효과를 지정할 수 있습니다.
TextStyle(
color: Colors.black,
shadows: [Shadow(color: Colors.grey, blurRadius: 2)],
)
위의 코드에서는 텍스트의 색상을 검정으로 지정하고, 이에 대한 그림자 효과를 회색으로 지정하고, 블러 효과의 반경을 2로 설정하였습니다.
RichText를 사용하여 텍스트에 그림자 효과를 적용하는 방법을 알아보았습니다. 이를 응용하여 다양한 텍스트 스타일링을 구현해보세요!