stackoverflowAppHomePage.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:stackoverflow/home/index.dart';
import 'package:pk_skeleton/pk_skeleton.dart';

class HomeScreen extends StatefulWidget {
  const HomeScreen({
    Key key,
    @required HomeBloc homeBloc,
  })  : _homeBloc = homeBloc,
        super(key: key);

  final HomeBloc _homeBloc;

  @override
  HomeScreenState createState() {
    return new HomeScreenState(_homeBloc);
  }
}

class HomeScreenState extends State<HomeScreen> {
  final HomeBloc _homeBloc;
  HomeScreenState(this._homeBloc);

  @override
  void initState() {
    super.initState();
    this._homeBloc.dispatch(LoadHomeEvent());
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<HomeEvent, HomeState>(
        bloc: widget._homeBloc,
        builder: (
          BuildContext context,
          HomeState currentState,
        ) {
          if (currentState is UnHomeState) {
            return PKCardListSkeleton();
          }
          if (currentState is ErrorHomeState) {
            return new Container(
                child: new Center(
              child: new Text(currentState.errorMessage ?? 'Error'),
            ));
          }
          if (currentState is InHomeState) {
            QuestionData questionData = currentState.questionData;
            return Material(
              child: Column(
                children: <Widget>[
                  Stack(
                    children: <Widget>[
                      Container(
                        height: MediaQuery.of(context).size.height * 0.3,
                        width: MediaQuery.of(context).size.width,
                        decoration: BoxDecoration(
                            gradient: LinearGradient(colors: [
                              Color(0xffd399c1),
                              Color(0xff9b5acf),
                              Color(0xff611cdf),
                            ]),
                            borderRadius: BorderRadius.only(
                                // bottomLeft: Radius.circular(30),
                                bottomRight: Radius.circular(70))),
                      ),
                      AppBar(
                        backgroundColor: Colors.transparent,
                        elevation: 0.0,
                        title: Center(child: Text("Stackoverflow")),
                      ),
                      Positioned(
                        top: MediaQuery.of(context).size.height * 0.15,
                        left: 20,
                        right: MediaQuery.of(context).size.width * 0.3,
                        child: Text(
                          "Welcome to Stack Overflow Questions App",
                          style: TextStyle(
                            color: Colors.white70,
                            fontSize: 20,
                          ),
                        ),
                      )
                    ],
                  ),
                  Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Text(
                      "All Questions",
                      style: TextStyle(
                          color: Colors.black,
                          fontWeight: FontWeight.bold,
                          fontSize: 24),
                    ),
                  ),
                  Expanded(
                    child: ListView.builder(
                      itemCount: questionData.questions.length,
                      itemBuilder: (context, i) {
                        Questions questions = questionData.questions[i];
                        String tags = questions.tags;
                        tags = tags.substring(1, tags.length - 1);
                        var tagList = tags.split(",");
                        return ExpansionTile(
                          leading: Container(
                              height: 50,
                              width: 50,
                              decoration: BoxDecoration(
                                  borderRadius:
                                      BorderRadius.all(Radius.circular(25)),
                                  gradient: LinearGradient(colors: [
                                    Color(0xff611cdf),
                                    Color(0xff9b5acf),
                                    Color(0xffd399c1),
                                  ])),
                              child: Column(children: <Widget>[
                                SizedBox(
                                  height: 8,
                                ),
                                Center(
                                    child: Text(questions.coteCount.toString(),
                                        style: TextStyle(
                                            fontSize: 9, color: Colors.white))),
                                SizedBox(
                                  height: 1,
                                ),
                                Text("Votes",
                                    style: TextStyle(
                                        fontSize: 9, color: Colors.white))
                              ])),
                          // leading: CircleAvatar(
                          //   radius: 25,
                          //   backgroundColor: Colors.blueGrey,
                          //   // backgroundColor:Color.fromARGB(0xFF, 0x42, 0xA5, 0xF5),
                          //   foregroundColor: Colors.white,
                          //   child: Column(children: <Widget>[
                          //     SizedBox(
                          //       height: 8,
                          //     ),
                          //     Center(
                          //         child: Text(questions.coteCount.toString())),
                          //     SizedBox(
                          //       height: 1,
                          //     ),
                          //     Text("Votes", style: TextStyle(fontSize: 10))
                          //   ]),
                          // ),
                          title: Text(
                            questions.question,
                            style: TextStyle(fontSize: 10),
                          ),
                          children: <Widget>[
                            Row(
                              children: <Widget>[
                                Container(
                                  alignment: Alignment.bottomLeft,
                                  margin: EdgeInsets.only(left: 15, right: 10),
                                  child: Chip(
                                    // shape: BeveledRectangleBorder(
                                    // borderRadius: BorderRadius.circular(10)
                                    // ),
                                    label: Text(questions.views),
                                    backgroundColor: Colors.blueGrey,
                                  ),
                                ),
                                Expanded(
                                  child: Text(
                                      "Asked by: ${questions.askedby} @ ${questions.time}"),
                                )
                              ],
                            ),
                            Divider(),
                            Wrap(
                              children: tagList
                                  .map((t) => Padding(
                                      padding: EdgeInsets.all(5),
                                      child: Chip(
                                          backgroundColor: Color(0xff9b5acf),
                                          label: Text(
                                            t,
                                            style: TextStyle(
                                                color: Colors.white,
                                                fontSize: 10),
                                          ))))
                                  .toList(),
                            ),
                          ],
                          // trailing: Chip(
                          //   // shape: BeveledRectangleBorder(
                          //   // borderRadius: BorderRadius.circular(10)
                          //   // ),
                          //   label: Text(questions.views),
                          //   backgroundColor: Colors.blueGrey,
                          // ),
                        );
                      },
                    ),
                  )
                ],
              ),
            );
          }
        });
  }
}