這里的下拉選擇器使用的庫(kù)是 flutter_picker 版本是^2.0.1

pubspec.yaml中配置該庫(kù)

dependencies:
  flutter:
    sdk: flutter
  flutter_picker: ^2.0.1

先講一下選擇器適配器的格式如下

//選擇器適配器，用于提供數(shù)據(jù)和生成小部件
adapter: PickerDataAdapter<String>(data: [
 new PickerItem(text: Text('江蘇'), value: '0', children: [
            PickerItem(
            text: Text('無錫'),
            value:'01',
            children:[
            PickerItem(text: Text('惠山'),value:'03'),
            PickerItem(text: Text('濱湖'),value:'04')
            ]),
           PickerItem(text: Text('蘇州'),value:'1'),       
          ]),
          PickerItem(text: Text('四川'), value: '1', children: [
            PickerItem(
            text: Text('達(dá)州'),
            value:'01',
           ),
           PickerItem(text: Text('巴中'),value:'1'),       
          ])
])

上面這個(gè)適配器的寫法看起來比較糟糕，數(shù)據(jù)少還可以一個(gè)一個(gè)的寫下去，一旦多了不可能一個(gè)個(gè)去寫，而是需要將給出的數(shù)據(jù)遍歷生成上面的這種格式

這里的是我的一個(gè)home.dart

參考下面的數(shù)據(jù)數(shù)據(jù)處理，去生成相對(duì)應(yīng)的數(shù)據(jù)適配器

import 'package:flutter/material.dart';
//引入flutter_picker插件
import 'package:flutter_picker/Picker.dart';
//假設(shè)后臺(tái)給出的下拉數(shù)據(jù)格式如下
const PickerData = [
  {
    'label': '江蘇',
    'value': '0',
    'children': [
      {
        'label': '無錫',
        'value': '01',
        'children': [
          {'label': '惠山', 'value': '03'},
          {'label': '濱湖', 'value': '04'}
        ]
      },
      {'label': '蘇州', 'value': '02'}
    ]
  },
  {
    'label': '四川',
    'value': '1',
    'children': [
      {'label': '達(dá)州', 'value': '11'},
      {'label': '巴中', 'value': '12'}
    ]
  }
];
/**
定義一個(gè)方法遍歷生成adapter(數(shù)據(jù)適配器)
data:后臺(tái)給出的下拉的下拉數(shù)據(jù)
label:默認(rèn)值為'label'，下拉顯示的數(shù)據(jù)
value:默認(rèn)值為'value',下拉選擇后傳給后端的數(shù)據(jù)
children:下拉二級(jí)或者更多集合的字段，默認(rèn)為'children';
**/
//聲明返回的類型為 List對(duì)象
List getData(List data,
    {String label = 'label',
    String value = 'value',
    String children = 'children'}) {
 //遍歷生成相對(duì)應(yīng)的PickerItem
  List<PickerItem> list = data.map((item) {
    //pickerItem的類型為PickerItem<String> 不指明類型會(huì)報(bào)錯(cuò)
    PickerItem<String> pickerItem = PickerItem(
        text: Text(item[label]),
        value: item[value],
          //如果子項(xiàng)有數(shù)據(jù)就遞歸，否則子項(xiàng)的children就是空List
        children: item.containsKey(children) && item[children].length > 0
            ? getData(item[children])
            : []);
    //最終把遍歷的每一項(xiàng)返出去
    return pickerItem;
  }).toList();
  return list;
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('首頁(yè)'),
        ),
        body: myHome(),
      ),
    );
  }
}

class myHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    print(getData(PickerData));
    return RaisedButton(
      child: Text('選擇器'),
      onPressed: () {
        new Picker(
            //選擇器適配器，用于提供數(shù)據(jù)和生成小部件
            //適配器中的data類型為PickerItem<String>，所以在getData中我們有聲明其類型
            adapter: PickerDataAdapter<String>(data: getData(PickerData)),
           //當(dāng)上一級(jí)選擇更改時(shí)，將子級(jí)滾動(dòng)到第一項(xiàng)
            changeToFirst: true,
            //是否隱藏頭部
            hideHeader: false,
            title: Text('選擇省份'),
            confirmText: "確認(rèn)",
            cancelText: "取消",
            onConfirm: (Picker picker, List value) {
              // print(value.toString());
              print(picker.adapter.text);
            }).showModal(context);
      },
    );
  }
}