trips_page.dart

//import 'dart:html';

import 'package:flutter/material.dart';
import 'dart:io';
import 'package:provider/provider.dart';
import 'package:wndlust_flutter/notifier/story_change_notifier.dart';
import 'package:wndlust_flutter/notifier/user_change_notifier.dart';

import 'package:wndlust_flutter/api.dart';

const GREY_COLOR = Color(0xffe5e6ea);

class TripsPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    StoryChangeNotifier storyNotifier =
        Provider.of<StoryChangeNotifier>(context);
    UserChangeNotifier userNotifier = Provider.of<UserChangeNotifier>(context);

    return new MaterialApp(
      home: new DefaultTabController(
        length: 2,
        child: new Scaffold(
          body: new NestedScrollView(
            headerSliverBuilder:
                (BuildContext context, bool innerBoxIsScrolled) {
              return <Widget>[
                SliverAppBar(
                  expandedHeight: 220.0,
                  // 220
                  floating: true,
                  pinned: true,
                  snap: false,
                  automaticallyImplyLeading: false,
                  backgroundColor: Colors.white,
                  //Color(0xfcfcfc)
                  bottom: new TabBar(
                    labelColor: Colors.black,
                    tabs: [
                      new Tab(text: 'tab1'),
                      new Tab(text: 'tab2'),
                    ],
                  ),
                  flexibleSpace: FlexibleSpaceBar(
                      background: SafeArea(
                          child: Padding(
                              padding: EdgeInsets.only(top: 25.0), // 50
                              child: _buildNav(
                                  context, userNotifier, storyNotifier)))),
                ),
              ];
            },
            body: new TabBarView(
                  children: [
                    CustomScrollView(
                      slivers: [
                        SliverPadding(
                            padding: EdgeInsets.symmetric(vertical: 20.0),
                            sliver: SliverGrid(
                              gridDelegate:
                              SliverGridDelegateWithFixedCrossAxisCount(
                                  crossAxisCount: 2,
                                  crossAxisSpacing: 0.0,
                                  mainAxisSpacing: 10.0,
                                  childAspectRatio: 2 / 3),
                              delegate: SliverChildBuilderDelegate(
                                    (BuildContext context, int index) {
                                  return _buildGridItem(
                                      context, storyNotifier, index);
                                },
                                childCount: storyNotifier.stories.length,
                              ),
                            )),
                      ],
                    ),
                    CustomScrollView()
                  ],
                ),
              ),
          bottomNavigationBar: Container(
            decoration: BoxDecoration(
              color: Colors.white,
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(0.5),
                  spreadRadius: 5,
                  blurRadius: 7,
                  offset: Offset(0, 3), // changes position of shadow
                ),
              ],
            ),
            padding: EdgeInsets.all(16.0),
            child: RaisedButton(
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(3.0),
              ),
              padding: const EdgeInsets.all(15.0),
              child: Text("+ ADD A STORY",
                  style: TextStyle(color: Colors.white, fontFamily: 'BebasNeue')),
              color: Colors.black,
              onPressed: () async {
                Story story = await storyNotifier.addStory();

                storyNotifier.selectStory(story);

                Navigator.pushNamed(context, "/story");
              },
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildNav(BuildContext context, UserChangeNotifier userNotifier,
      StoryChangeNotifier storyNotifier) {
    return Column(
      children: <Widget>[
        Container(
            padding: const EdgeInsets.all(15.0), // 15
            child: Row(
              children: <Widget>[
                SizedBox(
                  width: 31, // 31
                ),
                Container(
                    child: Column(
                  children: <Widget>[
                    Text(
                      "10",
                      style: TextStyle(fontSize: 30, fontFamily: 'BebasNeue'),
                    ),
                    Text("Стран", style: TextStyle(fontFamily: 'BebasNeue')),
                  ],
                )),
                SizedBox(
                  width: 40,
                ),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  // Поменять следующие заголовки получается только при комментировании Theme.of
                  children: <Widget>[
                    Text("Вы посетили",
                        style: TextStyle(fontFamily: 'BebasNeue')
                        // Theme.of(context)
                        //     .textTheme
                        //     .headline6
                        //     .apply(color: Colors.black),
                        ),
                    SizedBox(height: 5.0),
                    Text("10% от всего мира",
                        style: TextStyle(fontFamily: 'BebasNeue')

                        //   Theme.of(context)
                        // .textTheme
                        // .subtitle2
                        // .apply(color: Colors.black),
                        )
                  ],
                ),
                SizedBox(
                  width: 40,
                ),
                Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      new Container(
                          child: GestureDetector(
                        child: new FutureBuilder<String>(
                            future:
                                Api.buildProfilePictureUrl(userNotifier.user),
                            builder: (BuildContext context,
                                AsyncSnapshot<String> snapshot) {
                              if (snapshot.hasData) {
                                return CircleAvatar(
                                    radius: 41.3,
                                    backgroundColor: Colors.blue,
                                    backgroundImage:
                                        NetworkImage(snapshot.data));
                              }
                              return ClipRRect(
                                borderRadius: BorderRadius.circular(100),
                                child: Image.asset(
                                  "assets/img/alf.jpg",
                                  fit: BoxFit.fill,
                                  width: 80,
                                ),
                              );
                            }),
                        onTap: () {
                          Navigator.pushNamed(context, "/profile");
                        },
                      ))
                    ])
              ],
            )),
        // Закоментировал кнопку, которая до этого была под AppBar, скопировал и перенес на 70ю строку
        /*RaisedButton(
          child: Text("+ ADD A STORY"),
          onPressed: () async {
            Story story = await storyNotifier.addStory();

            storyNotifier.selectStory(story);

            Navigator.pushNamed(context, "/story");
          },
        ),*/
        Divider(color: Colors.black),
      ],
    );
    // Собственно TabBar, скопированный с документации, но не отображается после Divider
  }

  Widget _buildGridItem(
      BuildContext context, StoryChangeNotifier storyNotifier, int i) {
    var records = storyNotifier.records[storyNotifier.stories[i].id];
    var images = storyNotifier.images;
    WImage tripImage = Api.buildTripImage(records, images);

    return new GestureDetector(
        onTap: () {
          storyNotifier.selectStory(storyNotifier.stories[i]);
          Navigator.pushNamed(context, "/story");
        },
        child: Container(
          margin: EdgeInsets.only(left: 5.0, right: 5.0),
          decoration: BoxDecoration(
            color: GREY_COLOR,
            shape: BoxShape.rectangle,
            borderRadius: BorderRadius.all(Radius.circular(20.0)),
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Expanded(
                child: Container(
                    decoration: BoxDecoration(
                        shape: BoxShape.rectangle,
                        borderRadius: BorderRadius.all(Radius.circular(20.0)),
                        color: GREY_COLOR),
                    child: Stack(
                      children: <Widget>[
                        Container(
                            decoration: BoxDecoration(
                                shape: BoxShape.rectangle,
                                borderRadius:
                                    BorderRadius.all(Radius.circular(20.0)),
                                color: GREY_COLOR,
                                image: DecorationImage(
                                    fit: BoxFit.cover,
                                    image: (tripImage != null)
                                        // ? CachedNetworkImageProvider(tripUrl)
                                        ? ((tripImage.type == ImageType.REMOTE)
                                            ? NetworkImage(
                                                Api.buildTripUrl(tripImage))
                                            : FileImage(File(tripImage.url)))
                                        : AssetImage("assets/img/london.jpg")),
                                gradient: LinearGradient(
                                    begin: FractionalOffset.bottomCenter,
                                    end: FractionalOffset(0.5, 0.8),
                                    colors: [
                                      Colors.black54,
                                      Colors.transparent,
                                    ]))),
                        Container(
//                            decoration: BoxDecoration(),
                            alignment: Alignment.bottomCenter,
                            padding: EdgeInsets.only(bottom: 10.0),
                            child: Text(storyNotifier.stories[i].title,
                                style: TextStyle(
                                    color: Colors.white, fontSize: 16),
                                maxLines: 2)),
                      ],
                    )),
              ),
            ],
          ),
        ));
  }
}