• flutter 下拉菜单封装


    直接上代码,简单的下拉菜单封装

    import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';
    import 'package:flutter_app/utils/CXColors.dart';
    
    class DropDownSelect extends StatelessWidget {
      final String label;
      String value;
      final List<DropdownMenuItem> items;
      final ValueChanged onChanged;
      bool isText;
    
      DropDownSelect({Key key, this.label, this.value, this.items, this.onChanged, this.isText = false});
    
      @override
      Widget build(BuildContext context) {
        return new Container(
          height: 50.0,
          padding: EdgeInsets.fromLTRB(20.0, 0, 20.0, 0),
          decoration: new BoxDecoration(
            border: Border(
              bottom: BorderSide(color: CXColors.titleColor_cc,  0.5),
            ),
          ),
          child: Row(
            children: <Widget>[
              new Expanded(
                flex: 3,
                child: new Container(
                  child: new Text(
                    this.label,
                    style: TextStyle(fontSize: 16.0, color: Colors.black87),
                  ),
                ),
              ),
              new Expanded(
                flex: 8,
                child: Container(
                  padding: EdgeInsets.only(top: 4.0),
                  child: this.isText ? Text(this.value) : DropdownButton(
                    icon: Icon(
                      Icons.arrow_downward,
                      color: Colors.black26,
                    ),
                    style: TextStyle(fontSize: 15.0, color: Colors.black54),
                    iconSize: 22.0,
                    isExpanded: true,
                    underline: new Container(),
                    hint: Text('请选择',
                      style: TextStyle(
                          color: Colors.black26
                      ),
                    ),
                    items: this.items,
                    onChanged: onChanged,
                    value: this.value,
                  ),
                ),
              ),
            ],
          ),
        );
      }
    }

    使用方式:

    // 声明items
    List<DropdownMenuItem> _items = [
        new DropdownMenuItem(child: Text(''), value: ''),
        new DropdownMenuItem(child: Text(''), value: ''),
    ];
    // 声明value,默认值是否
    String _value = '';
    // 使用Widget
    DropDownSelect(
      label: '下拉菜单',
      items: _items,
      value: _value,
      isText: false,  // 为true时显示不可编辑文本,为false时显示下拉菜单,主要用于展示和编辑
      onChanged: (T) {
        setState(() {
          _value = T;
        });
      },
    ),
  • 相关阅读:
    5月读书日志
    把代码搬到Git Hub 吧(一)
    RTX二次开发(二)(基于ASP.NET)
    RTX二次开发(一)(基于ASP.NET)
    文件夹下迭代查询文件
    JS URL传递中文参数时出现乱码的处理
    js实现上下滑动侧边栏
    基本select语句的生命周期
    NodeJs下的测试框架Mocha
    带新人感想
  • 原文地址:https://www.cnblogs.com/SamNicole1809/p/12100199.html
Copyright © 2020-2023  润新知