Ui
Ui 패키지 없이 그라디에이션 꾸미기.
까사파파
2023. 12. 19. 21:28
컨테이너, 텍스트 등 . 아래와 같이 그라데이션을 패키지 없이 작성이 가능 합니다.
final gradient = LinearGradient(
begin: Alignment.topLeft, end: Alignment.bottomRight,
colors: [Colors.blueAccent, Colors.redAccent, Colors.amberAccent]);
텍스트 자체의 Shadow 그림자 . .
Text('Do Not \nUse\nPackage\nFor this\nGradation.', style: TextStyle(fontSize: 50,fontWeight: FontWeight.bold,
shadows: [
Shadow(
blurRadius:10.0, // shadow blur
color: Colors.black, // shadow color
offset: Offset(2.0,2.0), // how much shadow will be shown
),
],))
쉐이더를 이용해서 그라디언트를 입히면 위와 같은 화면이 만들어 집니다.
ShaderMask(
shaderCallback: (bounds)=>gradient.createShader(Rect.fromLTWH(0, 0, bounds.width,
bounds.height)),
child: Text('Do Not \nUse\nPackage\nFor this\nGradation.', style: TextStyle(fontSize: 50,
fontWeight: FontWeight.bold,
shadows: [
Shadow(
blurRadius:10.0, // shadow blur
color: Colors.black, // shadow color
offset: Offset(2.0,2.0), // how much shadow will be shown
),
],))),