学习Flutter搜索展开

import 'package:flutter/material.dart';
/**
 * 定义一个一个数组
 */
const CITY_NAMES={
  '北京':['东城区','西城区','朝阳区','丰台区','石景山区','海淀区','顺义区'],
  '上海':['黄浦区','徐汇区','长宁区','静安区','普陀区','闸北区','虹口区'],
  '广州':['越秀','海珠','荔湾','天河','白云','黄埔','南沙','番禺'],
  '深圳':['南山','福田','罗湖','盐田','龙岗','宝安','龙华'],
  '杭州':['上城区','下城区','江干区','拱墅区','西湖区','滨江区'],
  '苏州':['姑苏区','吴中区','相城区','高新区','虎丘区','工业园区','吴江区'],
};


void main() =>runApp(
  MyListViewApp()
);

class MyListViewApp extends StatefulWidget {
  @override
  _MyListViewAppState createState() => _MyListViewAppState();
}

class _MyListViewAppState extends State<MyListViewApp> {
  String counString ='';
  String localCount ='';
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
          home: Scaffold(
            appBar: AppBar(
              title: Text('列表的展开与收起'),
            ),
            body: ListView(
              children:_buildList(),
            ),
          ),
    );
  }
  // 如果需要引入另一个widget
  List<Widget> _buildList(){
    // 定义一个List 用来存放widgets
    List<Widget> widgets=[];
    // 使用foreach方法 获取所有的数值
    CITY_NAMES.keys.forEach((key){
      widgets.add(_item(key,CITY_NAMES[key]));
    });
    return widgets;
  }
  Widget _item(String city,List<String> subCities){
    // 可以伸缩收起的部件
    return ExpansionTile(
      title:Text(city,style: TextStyle(color: Colors.black54,fontSize: 20),),
      children: subCities.map((subCity)=>_buildSub(subCity)).toList(),
    );
  }

  Widget _buildSub(String subCity){
    // 可以伸缩的sizeBox
    return FractionallySizedBox(
      widthFactor: 1,
      child: Container(
        height: 30,
        alignment: Alignment(0, 0),
        margin: EdgeInsets.only(bottom:1),
        decoration: BoxDecoration(
          color: Colors.lightBlueAccent
        ),
        child: Text(subCity),
      ),
    );
  }

}

查看原文点击原文地址

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值