GridView在抖动中不可见

时间:2018-07-23 15:07:40

标签: flutter flutter-layout

我对Flutter超级陌生,创建Gridview时遇到问题。 当我调用母版页时不可见。我不知道为什么会发生冲突-有帮助吗?

Here is the complete code

我有两页:

[主要]

import 'package:flutter/material.dart'; import './pizza_page.dart';
import './master_page.dart' as first; import './events_page.dart' as
second; import './places_pages.dart' as third;


void main() {   runApp(new MaterialApp(
    home: new TestHome(),
    routes: <String, WidgetBuilder>{
     "/PizzaPage": (BuildContext context) => new PizzaPage()
     },   )); }

class TestHome extends StatefulWidget {   @override   _TestHomeState
createState() => new _TestHomeState(); }

class _TestHomeState extends State<TestHome>
    with SingleTickerProviderStateMixin {

  TabController controller;

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

  @override   void initState() {
    super.initState();
    controller = new TabController(vsync: this, length: 3);   }

  @override   Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("NASY"),
        backgroundColor: Colors.cyan[400],
        bottom: new TabBar(
          controller: controller,
          tabs: <Widget>[
            new Tab(
              icon: new Icon(Icons.home),
            ),
            new Tab(
              icon: new Icon(Icons.location_on),
            ),
            new Tab(
              icon: new Icon(Icons.event_note),
            )
          ],
         ),
      ),
      body: new TabBarView(controller: controller, children: <Widget>[
        new first.MasterPage(),
        new second.EventPage(),
        new third.PlacesPage(),
      ]),
    );   
  }
}

[母版页]

import 'package:flutter/material.dart';

class MasterPage extends StatefulWidget {
  @override
  _MasterPageState createState() => new _MasterPageState();
}

class _MasterPageState extends State<MasterPage> {
  List<Container> daftarSuperhero = new List();

  var karakter = [
    {"nama": "Ipnone 5", "gambar": "iphone1.jpg"},
    {"nama": "Iphone 5s", "gambar": "iphone2.jpg"},
    {"nama": "Iphone 7", "gambar": "iphone3.jpg"},
    {"nama": "Iphone 8", "gambar": "iphone4.jpg"},
    {"nama": "Iphone X", "gambar": "iphone5.png"},
    {"nama": "Ipnone 5", "gambar": "iphone1.jpg"},
    {"nama": "Iphone 5s", "gambar": "iphone2.jpg"},
    {"nama": "Iphone 7", "gambar": "iphone3.jpg"},
    {"nama": "Iphone 8", "gambar": "iphone4.jpg"},
    {"nama": "Iphone X", "gambar": "iphone5.png"},
  ];

  _buatlist() async {
    for (var i = 0; i < karakter.length; i++) {
      final karakternya = karakter[i];
      final String gambar = karakternya["gambar"];

      daftarSuperhero.add(new Container(
          padding: new EdgeInsets.all(10.0),
          child: new Card(
              child: new Column(
            children: <Widget>[
              new Padding(
                padding: EdgeInsets.all(10.0),
              ),
              new Image.asset(
                "assets/products/$gambar",
                fit: BoxFit.cover,
                height: 100.0,
              ),
              new Text(
                karakternya['nama'],
                style: new TextStyle(fontSize: 20.0),
              )
            ],
          ))));
    }
  }

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

  @override
  Widget build(BuildContext context) {
    return new GridView.count(
      primary: true,
      crossAxisCount: 2,
      children: daftarSuperhero,
    );
   }
 }

该代码的主要目的是在主屏幕中创建一个顶部导航栏,并将其与gridview链接。

1 个答案:

答案 0 :(得分:0)

我下载了完整的代码并在运行良好的物理设备上对其进行了测试,我发现唯一的错误是导入:

import 'package:flutter/material.dart';
import './pizza_page.dart';
import './home_page.dart' as first;
import './events_page.dart' as second;
import './places_pages.dart' as third;

应该是这样

import 'package:flutter/material.dart';
import 'pizza_page.dart';
import 'home_page.dart' as first;
import 'events_page.dart' as second;
import 'places_pages.dart' as third;