AppBar in flutter

Question

I have designed a news application in flutter where I have an app bar with tabs following it. In the tabbarview I have a list of news. on click of the news, it will show details description and image of the news(as shown in the image). When I try to put the app bar in that file. Two app bar appears. What would the possible way sort it out?

Here is the code:

appBar: AppBar(
            title: Text(""),
            backgroundColor: Color(0xFF125688), //#125688 //FFFF1744
            actions: <Widget>[
              Container(
                alignment: Alignment.topRight,
                child: FlatButton(
                    onPressed: () {},
                    padding: EdgeInsets.fromLTRB(0, 10.0, 8.0, 0),
                    child: Text(
                      date,
                      style: TextStyle(
                        color: Colors.white,
                      ),
                    )),
              )
            ],
            bottom: TabBar(
              tabs: <Widget>[
                Tab(text: "TOP-HEADLINES"),
                Tab(text: "LATEST-NEWS"),
                Tab(text: "SPORTS"),
                Tab(text: "CRIME-NEWS"),
              ],
              isScrollable: true,
            ),
          ),
          body: TabBarView(children: [
            TopHeadlines(),
            LatestNews(),
            Sports(),
            CrimeNews(),
              ],
            ),

CODE FOR TOPHEADLINES()

class TopHeadlines extends StatefulWidget {
  int index;
  String value_image,value_description,value_title;


  TopHeadlines({Key key,this.value_image,this.value_description,this.value_title,this.index}) : super(key:key);
  @override
  _topHeadlines createState() => _topHeadlines();


}

class _topHeadlines extends State<TopHeadlines> {
  List<News> dataList = List();
  bool _isLoading = false;
  BuildContext context1;


  Future<String> loadFromAssets() async {
    DateTime oops = DateTime.now();
    String d_date = DateFormat('ddMMyyyy').format(oops);


    var url = 'https://www.example.com/json-12.json';


    print(url);
    var response = await http
        .get('$url', headers: {"charset": "utf-8", "Accept-Charset": "utf-8"});
    String utfDecode = utf8.decode(response.bodyBytes);

    return utfDecode;
  }

  Future loadyourData() async {
    setState(() {
      _isLoading = true;
    });

    String jsonString = await loadFromAssets();

    String newStr = jsonString.substring(1, jsonString.length - 1);

    print(newStr);
    Map newStringMap = json.decode(newStr);
    var list = new List();
    newStringMap.forEach((key, value) {
      list.add(value);
    });

    for (var newsList in list) {
      var news = News.fromJson(newsList);
      dataList.add(news);
    }
    print('This is the length' + dataList.length.toString());
    print(dataList[0].title);
    setState(() {
      _isLoading = false;
    });
  }

  @override
  void initState() {
    super.initState();

    loadyourData();
  }

  @override
  Widget build(BuildContext context) {
    DateTime oops = DateTime.now();

    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home: Container(
          child: _isLoading ? Center(
            child: CircularProgressIndicator(),) :
          ListView.builder(
            itemCount: dataList.length, itemBuilder: (context, index) {
            return SizedBox(
                          height: 130.0,
                          child: Card(
                            color: Colors.white,
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                InkWell(
                                  onTap: (){
                                 //   dataList;
                                      Navigator.push(context, MaterialPageRoute(builder: (context) {
                                        print(index);
                                        return Newsdetail(value_image: dataList[index].image,value_description: dataList[index].description,value_title: dataList[index].title, );
                                    }));
                                  },
                                  child: Padding(
                                    padding: const EdgeInsets.all(8.0),
                                    child: Row(
                                      children: <Widget>[
                                        Expanded(
                                            child: Image.network(
                                              dataList[index].image,
                                              height: 92.5,
                                              width: 75.0,
                                            )),
                                        Expanded(
                                          child: Text(
                                            dataList[index].title,
                                            style: TextStyle(
                                              //title
                                              fontSize: 15.0, color: Colors.grey,
                                            ),
                                          ),
                                        )
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        );
                },
            ),
    ));
  }
}

Answer 1

Remove the appBars from these views:

TopHeadlines(),
LatestNews(),
Sports(),
CrimeNews(),

Only return the Content you want to display by return a Container or the widget you want to display