Flutter/Flutter FAQ
Flutter 플러터에서 흐릿한 장식 이미지, Blurred Decoration Image in Flutter
독학코딩
2024. 1. 3. 08:48
반응형
질문
내 앱의 배경은 다음과 같이 설정되어 있습니다:
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Container(
decoration: new BoxDecoration(
image: new DecorationImage(
image: new ExactAssetImage('assets/lol/aatrox.jpg'),
fit: BoxFit.cover,
),
),
child: new BackdropFilter(filter: new ImageFilter.blur(sigmaX: 600.0, sigmaY: 1000.0)),
width: 400.0,
),
);
}
}
DecorationImage
를 흐리게 만들고 싶어서 Container에 BackdropFilter
를 추가했지만, 어떤 변화도 보이지 않습니다. 무엇이 잘못되었을까요?
답변
이렇게 하면 컨테이너의 자식을 흐리게 할 수 있습니다.
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Container(
decoration: new BoxDecoration(
image: new DecorationImage(
image: new ExactAssetImage('assets/dog.png'),
fit: BoxFit.cover,
),
),
child: new BackdropFilter(
filter: new ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
child: new Container(
decoration: new BoxDecoration(color: Colors.white.withOpacity(0.0)),
),
),
),
);
}
}
반응형