DrawerHeader 小部件在 DrawerHeader 小部件下方生成一条微弱的线。我怎样才能删除这个?我已经尝试过装饰选项,到目前为止我发现的唯一方法是从 DrawerHeader 切换到自定义小部件,如果可能的话我想避免这种情况。
以下是 Flutter.dev 指南中的代码,DrawerHeader 颜色设置为白色,因此该线可见。
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
static const appTitle = 'Drawer Demo';
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: appTitle,
home: MyHomePage(title: appTitle),
);
}
}
class MyHomePage extends StatelessWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(title)),
body: const Center(
child: Text('My Page!'),
),
drawer: Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: [
const DrawerHeader(
decoration: BoxDecoration(
color: Colors.white,
),
child: Text('Drawer Header'),
),
ListTile(
title: const Text('Item 1'),
onTap: () {
Navigator.pop(context);
},
),
ListTile(
title: const Text('Item 2'),
onTap: () {
Navigator.pop(context);
},
),
],
),
),
);
}
}
Run Code Online (Sandbox Code Playgroud)
编辑:它似乎是从抽屉_header.dart(std lib)文件中的这一行添加的。第 85 行。无论如何我看不到禁用它。
border: Border(
bottom: Divider.createBorderSide(context),
),
Run Code Online (Sandbox Code Playgroud)
小智 9
这是一个解决方案。只需将您的抽屉标题小部件包装在主题小部件中并应用此数据,或者仅在您的DividerThemeData
和 Booom 中设置透明颜色。
Theme(
data: Theme.of(context).copyWith(
dividerTheme: const DividerThemeData(color: Colors.transparent),
),
child: DrawerHeader(child: YourWidget())
);
Run Code Online (Sandbox Code Playgroud)
要使分隔线不可见,也许可以使装饰透明:
decoration: BoxDecoration(
color: Colors.transparent
)
Run Code Online (Sandbox Code Playgroud)
可能想确保您也使用最新版本。
归档时间: |
|
查看次数: |
2421 次 |
最近记录: |