flutter 实现多布局列表的示例代码

 更新时间:2020年02月02日 12:04:11   作者:泰山123  
这篇文章主要介绍了flutter 实现多布局列表的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

闲来无事,写个玩安卓的首页,实现多布局、banner的效果。其中涉及知识点侧滑,pageview 切换页面,页面跳转传值及回调数据(在侧滑里)。这些都是基于自己学习做的demo。
当然还有很多瑕疵需要完善。

先看效果:

这里主要讲解多布局,所以其他功能可以参考github
https://github.com/chentaishan/flutter_app

多布局功能代码:

 @override
 void initState() {
  // TODO: implement initState
  super.initState();
  // 获取网络数据 一个banner 一个列表
  initBannerData();
  initHomeList();
 }

 @override
 Widget build(BuildContext context) {
  Widget itemColor = Divider(
   color: Colors.blue,
  );
  Widget nullColor = Divider(
   color: Colors.white,
  );
  return ListView.separated(
   itemCount: _homeListBeanEntity.data.datas.length,
   itemBuilder: (BuildContext context, int index) {
   // 根据规则,抽取banner方法和listitem
    return _bannerBeanData != null && _bannerBeanData.data.length > 0&&index==0
      ? bannerItem(_bannerBeanData)
      : listItem(_homeListBeanEntity, index);
   },
   separatorBuilder: (BuildContext context, int index) {
    return index > 0 ? itemColor : nullColor;
   },
  );
 }

void initBannerData() async {
  result = await getNetWorkData("https://www.wanandroid.com/banner/json");

  print("list=" + result);

  if (result.toString().length > 0) {
   BannerBeanEntity bannerBeanEntity =
     BannerBeanEntity.fromJson(json.decode(result));
   if (bannerBeanEntity != null) {
    setState(() {
     _bannerBeanData = bannerBeanEntity;
    });
   }
  }
 }

getNetWorkData(String url) async {
  var uri = Uri.parse(url);

  HttpClient httpClient = new HttpClient();

  HttpClientRequest request = await httpClient.getUrl(uri);

  HttpClientResponse httpClientResponse = await request.close();

  var str = await httpClientResponse.transform(utf8.decoder).join();

  print(httpClientResponse.toString());

  return str;
 }
 void initHomeList() async {

  result =await getNetWorkData("https://www.wanandroid.com/article/list/0/json");

  print("list=" + result);

  if (result.toString().length > 0) {
   HomeListBeanEntity homeListBeanEntity =
     HomeListBeanEntity.fromJson(json.decode(result));
   if (homeListBeanEntity != null) {
    setState(() {
     _homeListBeanEntity = homeListBeanEntity;
    });
   }
  }
 }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • Kotlin协程launch原理详解

    Kotlin协程launch原理详解

    这篇文章主要为大家介绍了Kotlin协程launch原理的示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • Flutter 用自定义转场动画实现页面切换

    Flutter 用自定义转场动画实现页面切换

    本篇介绍了 fluro 导航到其他页面的自定义转场动画实现,Flutter本身提供了不少预定义的转场动画,可以通过 transitionBuilder 参数设计多种多样的转场动画,也可以通过自定义的 AnimatedWidget实现个性化的转场动画效果。
    2021-06-06
  • Flutter Getx中的put和lazyPut函数使用案例解析

    Flutter Getx中的put和lazyPut函数使用案例解析

    这篇文章主要为大家介绍了Flutter Getx中的put和lazyPut函数使用案例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-07-07
  • Android一次性退出多个Activity的方法

    Android一次性退出多个Activity的方法

    这篇文章主要介绍了Android一次性退出多个Activity的方法,结合实例形式分析了Activity的创建,继承,遍历与关闭等实现步骤与相关技巧,需要的朋友可以参考下
    2016-02-02
  • Android studio 自动换行和取消自动换行操作

    Android studio 自动换行和取消自动换行操作

    这篇文章主要介绍了Android studio 自动换行和取消自动换行操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-04-04
  • Android防止按钮重复点击示例代码

    Android防止按钮重复点击示例代码

    本文介绍封装的一个小的工具类库,按钮点击事件类库,该类库可以防止按钮重复点击,可以判断网络状态,可以判断用户登录态,以及自定义验证条件等等,有兴趣的可以了解一下
    2018-05-05
  • Android相机启动加速详解

    Android相机启动加速详解

    本篇文章给大家详细分析了Android实现相机启动加速的相关知识点内容以及实例代码,有兴趣的朋友参考下。
    2018-07-07
  • Android自定义图片选择器简单版

    Android自定义图片选择器简单版

    这篇文章主要为大家详细介绍了Android自定义图片选择器简单版,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-02-02
  • Android在项目中接入腾讯TBS浏览器WebView的教程与注意的地方

    Android在项目中接入腾讯TBS浏览器WebView的教程与注意的地方

    今天小编就为大家分享一篇关于Android在项目中接入腾讯TBS浏览器WebView的教程与注意的地方,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧
    2018-10-10
  • Android自定义照相机的实例

    Android自定义照相机的实例

    这篇文章主要介绍了Android自定义照相机的实例的相关资料,需要的朋友可以参考下
    2017-06-06

最新评论