[英]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.