如何解决如何在flutter中的任何小部件周围制作渐变阴影?
示例:
请注意,小部件的颜色无关紧要,只有它周围的阴影颜色。
我一直在尝试编辑 BoxShadow 的源代码,它只有 100 行,但我没有取得太大的成功。
任何帮助将不胜感激!谢谢!
解决方法
通过使用 this,我实现了您想要的。
import 'package:flutter/material.dart';
import 'gradient_decoration.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',theme: ThemeData(
primarySwatch: Colors.blue,visualDensity: VisualDensity.adaptivePlatformDensity,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key,this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),body: _buildBody(),floatingActionButton: FloatingActionButton(
onPressed: () {},tooltip: 'Increment',child: Icon(Icons.add),);
}
Widget _buildBody() {
return Center(
child: Container(
width: 300,height: 80,decoration: GradientShadowBoxDecoration(
borderRadius: BorderRadius.circular(20),boxShadow: [
BoxShadow(
offset: Offset(0.0,0.0),blurRadius: 25,],gradient: LinearGradient(
begin: Alignment.centerLeft,end: Alignment.centerRight,colors: [
Colors.blue,Colors.purple,)),child: Center(
child: Text(
'Login',style: TextStyle(
fontSize: 25.0,fontWeight: FontWeight.bold,color: Colors.white,);
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。