我写了一个代码,其中的动物的形象将被显示&我必须选择动物的名字从下拉框。
下拉框将包含动物列表,如狗,猫,狮子。假设,如果我选择狗,只要狗选项被选中,下面的文字应该显示“狗是家庭犬科和食肉目的家养哺乳动物。”
同样,如果我选择猫选项,下面的文字应该显示“猫有一个强大的灵活的机构,快速React,锋利的牙齿”。
代码如下:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Section 2'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String _selectedAnimal="Dog";
var animal={'Dog':'W1','Cat':'W2','Lion':'W3'};
List _animals=[];
AnimalDependentDropDown(){
animal.forEach((key, value) {
_animals.add(key);
});
}
@override
void initState() {
// TODO: implement initState
super.initState();
AnimalDependentDropDown();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Container(
margin:EdgeInsets.all(15),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
SizedBox(height: 23,),
Align(
alignment: Alignment.centerLeft,
child:Text("Animal", style: TextStyle(fontWeight:FontWeight.bold,fontSize: 18),),
),
Container(
width: 400,
child: DropdownButton(
value: _selectedAnimal,
onChanged: (newValue){
setState(() {
_selectedAnimal="$newValue";
});
},
items:_animals.map((animal){
return DropdownMenuItem(
child: Text(animal),
value:animal,
);
}).toList(),
),
),
SizedBox(height: 23,),
],
),
),
// This trailing comma makes auto-formatting nicer for build methods.
);
}
}
从下拉框中选择选项后,我无法显示文本。
1条答案
按热度按时间s1ag04yj1#
当您使用Map键dropdownButton时,您可以使用选定的键来显示值。