我正在为一个咖啡馆创建一个订单应用程序，在这个应用程序上，我有一个主类之外的咖啡馆项目列表，作为我使用地图创建的自己的文件，在主dart中，我已经调用了文件之外的地图类，并将其放入列表视图生成器中，但我希望主页中也有下拉列表。我想连接列表查看器和下拉按钮，但我不知道我是否可以使用下拉菜单中的地图，或者我是否必须将它们变成列表等等。此外，如果我们可以在下拉按钮中使用地图，我们如何将其定义为"；项目"；如果按下下拉按钮。
这是我的地图文件
class Menu {
Menu();
Menu.s(this._sandwichMap);
Menu.b(this._burgerMap);
Menu.o(this._otherItemsMap);
Menu.q(this._sidesMap);
Menu.p(this._pizzaMap);
Map<String, double> _sandwichMap = {
"Veggie Melt": 4.50,
"Crispy Chicken Wrap": 6.95,
"Italian Meatball Sub": 6.99,
"Chicken Parm Grinder": 6.59,
"Grill Cheese": 3.59,
"Grilled Ham & Cheese": 4.59,
"Bacon Bagel Melt": 5.29};
Map<String, double> getSandwichMap() {
return this._sandwichMap;
}
//check burger prices again
Map<String, double> _burgerMap = {
"Veggie Burger": 4.99,
"The Quantum Burger": 7.25,
"Cafe Melt": 6.59,
"The Bull Rider": 5.79,
"Double Cheese Burger": 5.89,
"Hamburger": 3.99};
Map<String, double> getBurgerMap() {
return this._burgerMap;
}
Map<String, double> _otherItemsMap = {
"Chicken Quesadilla": 6.79,
"Cheese Quesadilla": 6.29,
"Chicken Strips": 4.99,
"Popcorn Chicken": 4.59,
"Jalapeno Poppers": 3.49};
Map<String, double> getOtherItemsMap() {
return this._otherItemsMap;
}
Map<String, double> _sidesMap = {
"French Fries": 3.29,
"Onion Rings": 4.79,
"Jalapeno Cheese Curds": 4.99,
"Tater Tots": 3.19,
"Pretzel Bites": 4.59,
"Nachos & Cheese": 3.50};
Map<String, double> getSidesMap() {
return this._sidesMap;
}
Map<String, double> _pizzaMap = {
"7-inch Cheese": 4.59,
"7-inc with topping": 4.99};
Map<String, double> getPizzaMap() {
return this._pizzaMap;
}
}
这是我的主文件和下拉
import 'dart:core';
import 'package:flutter/material.dart';
//import 'package:flutter/foundation.dart';
import 'package:flutter/cupertino.dart';
import 'maps.dart';
//var menu = Menu();
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
//Always use Stateless first then use stateful or stateless widgets afterward
@override
Widget build(BuildContext context) {
return MaterialApp(
//only used at the beginning of the program
title: 'The Cafe',
//just a title to the app it does not show for there is nothing telling it to show on the screen
debugShowCheckedModeBanner: false,
//takes out the ribbon at the top right corner of the screen and app
theme: ThemeData(
primarySwatch: Colors.green,
brightness: Brightness.dark,
fontFamily: 'georgia',
textTheme: TextTheme(headline1: TextStyle(fontSize: 100))
//controls the color of the very top part of the application
),
home: StartPage(),
//used to connect the Stateless widget to the Stateful widget below
);
}
}
class StartPage extends StatefulWidget {
@override
_StartPageState createState() => _StartPageState();
}
// do not forget the } prior to this comment if you do it will result in error and the program does not known why either
class _StartPageState extends State<StartPage> {
var menu = Menu();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('The Campus Cafe'),
//where the main title is computed to be shown on the screen
centerTitle: true,
//centers the title
),
body: Center(
//This is Header that is after the main Title
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
//Header Container
Expanded(
child: Image.asset(
'assets/images/campus-cafe-logo-350sidebar.png',)
),
Container(
padding: const EdgeInsets.all(8.0),
alignment: Alignment.center,
child: Text("Our Menu", style: TextStyle(fontSize: 30),
),
),
Expanded(
child: ListView.builder(
itemCount: 5,
itemBuilder: (context, int index) {
String key = menu.getSandwichMap().keys.elementAt(index);
List<String> key1 = menu.getSandwichMap().keys.toList();
//List<double> key2 = menu.getSandwichMap().values.toList();
return DropdownButton(
value: key[index],
items: key,
onChanged: (value) {
key = value;
setState(() {});
},
hint: Text('Sandwich'),
);
return DropdownButton(items: [],
);
}),
),
]
),
),
);
}
}
如果需要更多关于我希望我的下拉列表看起来如何的信息，我希望它们看起来也像下面的文件，只有listview.builder，但如果可能的话，我希望这些信息在下拉列表中
import 'dart:core';
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/cupertino.dart';
import 'maps.dart';
//var menu = Menu();
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
//Always use Stateless first then use stateful or stateless widgets afterward
@override
Widget build(BuildContext context) {
return MaterialApp(
//only used at the beginning of the program
title: 'The Cafe',
//just a title to the app it does not show for there is nothing telling it to show on the screen
debugShowCheckedModeBanner: false,
//takes out the ribbon at the top right corner of the screen and app
theme: ThemeData(
primarySwatch: Colors.green,
brightness: Brightness.dark,
fontFamily: 'georgia',
textTheme: TextTheme(headline1: TextStyle(fontSize: 100))
//controls the color of the very top part of the application
),
home: StartPage(),
//used to connect the Stateless widget to the Stateful widget below
);
}
}
class StartPage extends StatefulWidget {
@override
_StartPageState createState() => _StartPageState();
}
// do not forget the } prior to this comment if you do it will result in error and the program does not known why either
class _StartPageState extends State<StartPage> {
var menu = Menu();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('The Campus Cafe'),
//where the main title is computed to be shown on the screen
centerTitle: true,
//centers the title
),
body: Center(
//This is Header that is after the main Title
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
//Header Container
Expanded(
child: Image.asset(
'assets/images/campus-cafe-logo-350sidebar.png',)
),
Container(
padding: const EdgeInsets.all(8.0),
alignment: Alignment.center,
child: Text("Our Menu", style: TextStyle(fontSize: 30),
),
),
Expanded(
child: ListView.builder(
itemCount: menu.getSandwichMap().length,
itemBuilder: (context, int index) {
String key = menu.getSandwichMap().keys.elementAt(index);
return new Column(
children: <Widget>[
//DropdownButton<String>(
//isExpanded: true;
//items: menu.getSandwichMap();
new ListTile(
title: new Text("$key"),
subtitle: new Text("${menu.getSandwichMap()[key]}"),
),
new Divider(
height: 2.0,
),
// ),
],
);
},
),
)
]
),
),
);
}
}
从映射值构建下拉字段并不困难。
基本上，这个想法是你需要先得到一个List<String>。然后，你的生活会轻松很多。你想怎样到达那里取决于你自己。
我使用您的值创建了一个DartPad示例。试试看那里。
https://dartpad.dev/93b680c13c57e7a8faff99116793cd3f
class MyStatefulWidget extends StatefulWidget {
MyStatefulWidget({Key key}) : super(key: key);
@override
_MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}
class _MyStatefulWidgetState extends State<MyStatefulWidget> {
final List<String> sandwichItems = sandwichMap.keys.toList();
String dropdownValue;
Widget build(BuildContext context) {
return
Container(
child: DropdownButton<String>(
value: dropdownValue ?? sandwichItems[0],
onChanged: (String newValue) {
setState(() {
dropdownValue = newValue;
});
},
items: sandwichItems.map((e){
return DropdownMenuItem<String>(
value: e,
child: Text(e),
);
}).toList(),
),
);
}
}
Map<String, double> sandwichMap = {
"Veggie Melt": 4.50,
"Crispy Chicken Wrap": 6.95,
"Italian Meatball Sub": 6.99,
"Chicken Parm Grinder": 6.59,
"Grill Cheese": 3.59,
"Grilled Ham & Cheese": 4.59,
"Bacon Bagel Melt": 5.29};