[英]Possible render error in Flutter DropdownButton
我正在使用 Flutter Web 上的 Spotify UI 克隆(web 版本),并实现了顶栏与后退/前进按钮,但用户意识到右栏是固定的列上面是 position,您的音乐建议会滚动浏览。
我的解决方案是设置一个堆栈,顶部有栏,如下所示:
_mainScreen(BuildContext context){
Size size = MediaQuery.of(context).size;
return Container(
padding: EdgeInsets.symmetric(horizontal: 15.0),
color: Color.fromRGBO(22, 22, 22, 1.0),
height: double.infinity,
width: size.width*0.82,
child: Stack(
children: <Widget>[
SingleChildScrollView(
child: Column(
children: <Widget>[
SizedBox(height: size.height*0.09,),
_suggestionLists(size)
],
),
),
_topBar(size)
],
)
);
}
然后发生了这样的事情:那条白线不应该在那里
在进行我之前提到的更改之前,它都不存在。 这是该小部件的代码:
_profileButtons(Size size){
return Container(
height: size.height*0.05,
padding: EdgeInsets.symmetric(horizontal: 5.0),
decoration: BoxDecoration(
color: Color.fromRGBO(15, 15, 15, 0.8),
borderRadius: BorderRadius.circular(100.0)
),
child: DropdownButton<String>(
dropdownColor: Color.fromRGBO(75, 75, 75, 1.0),
style: TextStyle(color: Colors.white),
hint: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
padding: EdgeInsets.all(1.0),
child: Icon(Icons.person, color: Colors.white, size: 20,),
decoration: BoxDecoration(
color: Color.fromRGBO(75, 75, 75, 1.0),
border: Border.all(color: Color.fromRGBO(75, 75, 75, 1.0)),
borderRadius: BorderRadius.circular(100.0)
),
),
SizedBox(width: 5.0,),
Text('Your UserName', style: TextStyle(color: Colors.white),),
],
),
icon: Icon(Icons.arrow_drop_down, color: Colors.white,),
items: <String>['Account', 'Profile', 'Log out'].map((String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text(value),
);
}).toList(),
onChanged: (_) {},
)
);
}
我试过把容器、边框等弄乱一点,但我似乎没有发现它有什么问题,可能是渲染错误吗? 如果需要,我将提供额外的代码/详细信息
您可以在下面复制粘贴运行完整代码
要隐藏下划线,可以使用DropdownButtonHideUnderline
wrap DropdownButton
代码片段
DropdownButtonHideUnderline(
child: DropdownButton<String>(
工作演示
完整代码
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
_profileButtons(Size size) {
return Container(
height: size.height * 0.05,
padding: EdgeInsets.symmetric(horizontal: 5.0),
decoration: BoxDecoration(
color: Color.fromRGBO(15, 15, 15, 0.8),
borderRadius: BorderRadius.circular(100.0)),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
dropdownColor: Color.fromRGBO(75, 75, 75, 1.0),
style: TextStyle(color: Colors.white),
hint: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
padding: EdgeInsets.all(1.0),
child: Icon(
Icons.person,
color: Colors.white,
size: 20,
),
decoration: BoxDecoration(
color: Color.fromRGBO(75, 75, 75, 1.0),
border:
Border.all(color: Color.fromRGBO(75, 75, 75, 1.0)),
borderRadius: BorderRadius.circular(100.0)),
),
SizedBox(
width: 5.0,
),
Text(
'Your UserName',
style: TextStyle(color: Colors.white),
),
],
),
icon: Icon(
Icons.arrow_drop_down,
color: Colors.white,
),
items:
<String>['Account', 'Profile', 'Log out'].map((String value) {
return new DropdownMenuItem<String>(
value: value,
child: new Text(value),
);
}).toList(),
onChanged: (_) {},
),
));
}
@override
Widget build(BuildContext context) {
return Scaffold(appBar: AppBar(), body: _profileButtons(Size(800, 800)));
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.