zoukankan      html  css  js  c++  java
  • 导航区域 温故GridView 和 column

    代码:

    import 'package:flutter/material.dart';
    import 'package:flutter_screenutil/flutter_screenutil.dart';
    class TopNavigator extends StatelessWidget {
    final List navigatorList;

    TopNavigator({this.navigatorList});

    Widget _gridViewItemUI(BuildContext context,item){
    return InkWell(
    onTap: (){
    print('点击了导航');
    },
    child: Column(
    children: <Widget>[
    Image.network(item['image'],ScreenUtil().setWidth(95)),
    Text(item['mallCategoryName'])
    ],
    ),
    );
    }

    @override
    Widget build(BuildContext context) {
    if (this.navigatorList.length > 10) {
    this.navigatorList.removeRange(10, this.navigatorList.length);
    }
    return Container(
    height: ScreenUtil().setHeight(320),
    padding: EdgeInsets.all(10.0),
    child: GridView.count(
    crossAxisCount: 5,//每行5个
    padding: EdgeInsets.all(5.0),//间距
    children: navigatorList.map((item){
    return _gridViewItemUI(context, item);
    }).toList(),//切记返回一个集合 tolist()
    ),
    );
    }
    }
     
    加载导航区域代码:
    Container(
    child: FutureBuilder(//网络数据返回能很好的渲染控件
    future: getHomePageContent(),//网络返回的数据
    builder: (context,snapshot){
    if (snapshot.hasData) {//snapshot 相当于返回的数据
    var data = json.decode(snapshot.data.toString());
     
    List<Map> swiper = (data['data']['slides'] as List).cast();

    List<Map> navlist = (data['data']['category'] as List).cast();
    return Column(
    children: <Widget>[
    SwiperDiy(swiperDataList: swiper),
    TopNavigator(navigatorList: navlist),
    ],
    );
    }else{
    return Center(
    child: Text('加载错误'),
    );
    }
    },
    ),
    );
  • 相关阅读:
    Java-数组
    排序-冒泡排序
    排序-选择排序
    Java-基础
    Java-Html-session
    Java-API
    Tomcat-常用设置
    Tomcat目录结构
    TOMCAT-安装配置
    Java-public
  • 原文地址:https://www.cnblogs.com/pp-pping/p/12222787.html
Copyright © 2011-2022 走看看