【问题标题】:How to take value from dropdown and display as text on screen?如何从下拉列表中获取值并在屏幕上显示为文本?
【发布时间】:2018-10-16 12:55:56
【问题描述】:

如何使 Stylish 下拉并从该下拉列表中获取数据并将其显示为文本。我怎样才能完成这项任务?这是我的代码,我在其中制作了一个旋转瓶游戏的颤振应用程序。我已经在其中做了一个下拉菜单,但是,如何获取它的值并在屏幕上打印为文本:

import 'package:flutter/material.dart';
import 'dart:math';

List<DropdownMenuItem<String>> listDrop = [];
loadData() {
  listDrop = [];
  listDrop.add(new DropdownMenuItem(
    child: new Text('Item 1'),
    value: "1",
  ));
  listDrop.add(new DropdownMenuItem(
    child: new Text('Item 2'),
    value: "2",
  ));
  listDrop.add(new DropdownMenuItem(
    child: new Text('Item 3'),
    value: "3",
  ));
}
class ImageRotate extends StatefulWidget {
  @override
  _ImageRotateState createState() => new _ImageRotateState();
}
class _ImageRotateState extends State<ImageRotate>
  with SingleTickerProviderStateMixin {
  AnimationController animationController;

  static var rng = new Random();
  double random_number = 0.0;
  );
}                  }
new Container(
  alignment: Alignment.centerRight,
  padding: new EdgeInsets.only(top: 200.0, right: 100.0),
  child: new DropdownButton(
    style: new TextStyle(
      color: Colors.redAccent,
      fontWeight: FontWeight.bold, 
    ),
    items: listDrop,
    hint: new Text(
      "Select"
    ),
    onChanged: loadData(),
  ),
),

【问题讨论】:

    标签: android dart flutter flutter-layout


    【解决方案1】:

    你的代码不清楚,所以我为你添加了完整的例子。

    import 'package:flutter/material.dart';
    
      void main() => runApp(Home());
    
      class Home extends StatelessWidget {
        @override
        Widget build(BuildContext context) {
          return MaterialApp(
            home:MultipleDropDownPage()
          );
        }
      }
    
    
      class MultipleDropDownPage extends StatefulWidget {
        MultipleDropDownPage({Key key}) : super(key: key);
    
        @override
        _MultipleDropDownPageState createState() => new _MultipleDropDownPageState();
      }
    
      class _MultipleDropDownPageState extends State<MultipleDropDownPage> {
        String selectedValues;
    
        @override
        void initState() {
          // TODO: implement initState
          super.initState();
          selectedValues = "1";
        }
    
        @override
        Widget build(BuildContext context) {
          return new Scaffold(
            appBar: new AppBar(
              title: Text('Multi Drop'),
            ),
            body:  Column(
              children: <Widget>[
                new Text(selectedValues.toString()),
                new DropdownButton<String>(
                      onChanged: (String value) {
                        setState(() {
                          selectedValues = value;
                        });
                      },
                      hint: new Text('Course Unit'),
                      value: selectedValues,
                      items: <String>["1", "2", "3", "4", "5"].map((String value) {
                        return new DropdownMenuItem<String>(
                          value: value,
                          child: new Text(value),
                        );
                      }).toList(),
                    ),
              ],
            ),
            floatingActionButton: FloatingActionButton(
              onPressed: () {
                setState(() {
                });
              },
            ),
          );
        }
      }
    

    【讨论】:

    • 这完全符合我的要求,谢谢。 :-) 你能告诉我如何在我想要的位置对齐一列这意味着我如何在一个coloum中提供填充?
    • 我正在尝试这样做 // 对齐:Alignment.centerRight, //padding: new EdgeInsets.only(top: 200.0, right: 100.0),但它不接受列中的填充
    • 要做到这一点,您必须使用列属性 mainAxisSize: MainAxisSize.min,因为列高默认等于屏幕的全高。
    猜你喜欢
    • 2023-01-29
    • 1970-01-01
    • 2011-12-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-08-19
    相关资源
    最近更新 更多