Flutter应用程序无法通过映射将文本字段的集合传递到列表,然后传递卡片小部件

时间:2019-03-14 00:59:04

标签: flutter flutter-layout flutter-dependencies

我真的很开心。我用一堆TextFields创建了一个页面,每个TextFields将被分配给变量。但是,我正在考虑将所有这些都传递给地图,然后将其发送回页面:`

import 'package:flutter/material.dart';
import 'posts_page.dart';

class WritePost extends StatefulWidget {
  final Function addPost;
  WritePost({this.addPost});
  @override
  State<StatefulWidget> createState() {
    return _WritePost();
  }
}

class _WritePost extends State<WritePost> {
  String titleValue;
  String textValue;

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () {
        Navigator.pop(context, false);
        return Future.value(false);
      },
      child: Scaffold(
        appBar: AppBar(
          title: Text("Write Post"),
        ),
        body: Container(
          alignment: Alignment.center,
          child: ListView(
            children: <Widget>[
              TextField(
                autocorrect: true,
                decoration: InputDecoration(
                    labelText: "Title", icon: Icon(Icons.title)),
                onChanged: (value) {
                  setState(() {
                    titleValue = value;
                  });
                },
              ),
              TextField(
                maxLines: 5,
                decoration: InputDecoration(
                    labelText: "Title", icon: Icon(Icons.textsms)),
                onChanged: (String value) {
                  setState(() {
                    textValue = value;
                  });
                },
              )
            ],
          ),
        ),
        floatingActionButton: FloatingActionButton(
          child: Icon(Icons.wb_iridescent),
          onPressed: () {
            final Map<String, dynamic> post = {
              "title": titleValue,
              "text": textValue
            };
            helper_function(mapHelper: post);
            Navigator.pop(context);
          },
        ),
      ),
    );
  }
}
`

将收到的页面称为posts_page,我想将其收集到地图列表中,每次创建帖子时,它将转到该列表,此列表将被发送到另一个具有Cards Widget的类ListView。

posts_page:

    import 'package:flutter/material.dart';
import './posts.dart';
import '../pages/dashboard/dashboard.dart';
import 'package:unicorndial/unicorndial.dart';
import 'write_post.dart';

helper_function({Map<String, dynamic> mapHelper}) {

    return mapHelper;

}

class PostsPage extends StatefulWidget {
  final Map<String, dynamic> startPost;
  PostsPage({this.startPost});

  @override
  State<StatefulWidget> createState() {
    return _PostsPage();
  }
}

class _PostsPage extends State<PostsPage> {
  List<Map<String, dynamic>> _posts = [];

  @override
  void initState() {
    if (widget.startPost != null) {
      _posts.add(widget.startPost);
    }
    super.initState();
  }

  @override
  void didUpdateWidget(PostsPage oldWidget) {
    super.didUpdateWidget(oldWidget);
  }


  void _addPosts() {
    setState(() {
      _posts.add(helper_function());
    });
  }

  Widget uppBar() {
    return AppBar(
      title: Text('Post page'),
      centerTitle: true,
    );
  }

  @override
  Widget build(BuildContext context) {
    var chillButon = List<UnicornButton>();

    //first button
    chillButon.add(UnicornButton(
      hasLabel: true,
      labelText: "Post Now!",
      currentButton: FloatingActionButton(
        mini: true,
        child: Icon(Icons.local_post_office),
        onPressed: () {
          Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (BuildContext context) => WritePost()));
        },
      ),
    ));
    //second button
    chillButon.add(UnicornButton(
      hasLabel: true,
      labelText: "Dashboard",
      currentButton: FloatingActionButton(
        heroTag: "dashboard",
        backgroundColor: Colors.redAccent,
        mini: true,
        child: Icon(Icons.dashboard),
        onPressed: () {
          Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (BuildContext context) => Dashboard()));
        },
      ),
    ));

    chillButon.add(UnicornButton(
      hasLabel: true,
      labelText: "Support App",
      currentButton: FloatingActionButton(
        heroTag: "support app",
        backgroundColor: Colors.blueGrey,
        mini: true,
        child: Icon(Icons.info_outline),
        onPressed: () {},
      ),
    ));

    return Scaffold(
      body: Column(
        children: [
          uppBar(),
          Posts(_posts),
        ],
      ),
      floatingActionButton: UnicornDialer(
        backgroundColor: Color.fromRGBO(255, 255, 255, 0.6),
        parentButtonBackground: Colors.deepPurpleAccent,
        orientation: UnicornOrientation.VERTICAL,
        parentButton: Icon(Icons.menu),
        childButtons: chillButon,
      ),
    );
  }
}

这是称为帖子的卡类:

    import 'package:flutter/material.dart';
import '../pages/post_page.dart';
import 'package:liquid_pull_to_refresh/liquid_pull_to_refresh.dart';
import 'dart:async';


class Posts extends StatelessWidget {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  final GlobalKey<RefreshIndicatorState> _refreshIndicatorKey =
      GlobalKey<RefreshIndicatorState>();

  final List<Map<String, dynamic>> posts;
  Posts(this.posts);

  Widget _buildPostItem(BuildContext context, int index) {
    return new Container(
        child: Card(
      child: Column(
        children: <Widget>[
           Text(posts[index]["title"]),
          Text(posts[index]["text"]),
          ButtonBar(
            children: <Widget>[
              FlatButton(
                child: Text("Read More"),
                onPressed: () => Navigator.push<bool>(
                      context,
                      MaterialPageRoute(
                        builder: (BuildContext context) => PostPage(
                            posts[index]['title'], posts[index]['text']),
                      ),
                    ),
              )
            ],
          )
        ],
      ),
    ));
  }

  Future<void> _handleRefresh() {
    final Completer<void> completer = Completer<void>();
    Timer(Duration(seconds: 1), () {
      completer.complete();
    });
    return completer.future.then<void>((_) {
      _scaffoldKey.currentState?.showSnackBar(
        SnackBar(
          content: null,
          action: SnackBarAction(
            label: null,
            onPressed: () {
              _refreshIndicatorKey.currentState.show();
            },
          ),
        ),
      );
    });
  }

  Widget _buildPostList() {

    Widget postCard;
    if (posts.length > 0) {
      postCard = LiquidPullToRefresh(
          showChildOpacityTransition: true,
          onRefresh: _handleRefresh,
          child: ListView.builder(
            itemBuilder: _buildPostItem,
            itemCount: posts.length,
          ));
    } else {
      postCard = Center(
        child: Text(
            "\tNo Post yet please add a one to share \n with our cool coummanity"),
      );
    }
    return postCard;
  }

  @override
  Widget build(BuildContext context) {
    return _buildPostList();
  }
}

所以我的问题我不知道如何将数据传递到列表,然后再进入卡片类

0 个答案:

没有答案