Flutter-第一屏仅在真实的iOS设备上损坏,而在Android而不是模拟器上损坏

时间:2019-05-07 07:13:05

标签: flutter flutter-layout

当用户打开应用程序并在启动屏幕后,应用程序自己的启动屏幕启动时,就会出现问题。

它代替了Android上的常规加载屏幕,而是将所有字符绘制为块,并随着屏幕重新绘制越来越小的广告无限(如背景)而显示渐进式镜像效果。

https://ibb.co/m6K3YCQ

我尝试将应用程序部署到IOS Simulator,一切正常。

我的依赖关系:

dependencies:
  flutter:
      sdk: flutter
  http: ^0.12.0+1
  shared_preferences: ^0.5.1+2
  transparent_image: ^1.0.0
  photo_view: ^0.2.2
  cached_network_image: ^0.7.0
  firebase_admob: ^0.8.0+3
  connectivity: ^0.4.2
  flutter_webview_plugin: ^0.3.4

我的代码:

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:transparent_image/transparent_image.dart';
import 'package:technokids_gallery/app/utils/Network.dart';
import 'package:technokids_gallery/app/models/mainCategories.dart';
import 'package:technokids_gallery/app/pages/subCategory.dart';

class HomePage extends StatefulWidget {
  static final String routeName = 'home';

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

class _HomePageState extends State<HomePage> {
  GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  var _page = 0;

  @override
  void initState() {
    super.initState();
    NetworkUtils.checkConnectivity(_scaffoldKey);
  }

  @override
  Widget build(BuildContext context) {
    /* final double barHeight = 20.0;
    final double statusbarHeight = MediaQuery.of(context).padding.top; */

    return Scaffold(
      key: _scaffoldKey,
      appBar: PreferredSize(
        preferredSize: Size.fromHeight(40.0),
        child: AppBar(
          title: Text(
            'TECHNOKIDS GALLERY',
            style: TextStyle(
              fontSize: 22.0,
              fontWeight: FontWeight.bold,
              letterSpacing: 0,
            ),
          ),
          centerTitle: true,
          elevation: 0,
          flexibleSpace: Container(
            decoration: BoxDecoration(
              gradient: LinearGradient(
                colors: [Color(0xFF0D47A1), Color(0xFF1976D2)],
                begin: const FractionalOffset(0.0, 0.0),
                end: const FractionalOffset(0.4, 0.9),
                stops: [0.0, 1.0],
                tileMode: TileMode.clamp,
              ),
            ),
          ),
        ),
      ),
      body: PageView(
        children: <Widget>[
          Offstage(
              offstage: _page != 0,
              child: TickerMode(
                enabled: _page == 0,
                child: FutureBuilder(
                  future: getMainCategories(),
                  builder:
                      (BuildContext context, AsyncSnapshot<List> snapshot) {
                    if (!snapshot.hasData)
                      return Container(
                        child: Center(
                          child: CircularProgressIndicator(
                            strokeWidth: 3.0,
                            valueColor:
                                AlwaysStoppedAnimation<Color>(Colors.orange),
                          ),
                        ),
                      );
                    List mainCats = snapshot.data;
                    return CustomScrollView(
                      primary: true,
                      slivers: <Widget>[
                        SliverPadding(
                          padding: const EdgeInsets.all(8.0),
                          sliver: SliverGrid.count(
                            crossAxisSpacing: 8.0,
                            childAspectRatio: 1.35,
                            mainAxisSpacing: 8,
                            crossAxisCount: 2,
                            children:
                                createMainCategoryCardItem(mainCats, context),
                          ),
                        )
                      ],
                    );
                  },
                ),
              ))
        ],
      ),
    );
  }

  List<Widget> createMainCategoryCardItem(
      List<MainCategories> maincats, BuildContext context) {
    // Children list for the list.
    List<Widget> listElementWidgetList = List<Widget>();

    if (maincats != null) {
      var lengthOfList = maincats.length;

      for (int i = 0; i < lengthOfList; i++) {
        MainCategories maincat = maincats[i];
        // Image URL        
        var imageURL =
            "http://10.0.3.2:8081/gallery/sections/" + maincat.sectionPhoto;
        // List item created with an image of the poster
        var listItem = GridTile(
          child: GestureDetector(
            onTap: () {
              if (maincat.id != "0") {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (_) => SubCategoryPage(maincat.id),
                  ),
                );
              }
            },
            child: FadeInImage.memoryNetwork(
              placeholder: kTransparentImage,
              image: imageURL,
            ),
          ),
        );

        listElementWidgetList.add(listItem);
      }
    }
    return listElementWidgetList;
  }
}

2 个答案:

答案 0 :(得分:1)

我认为这是因为您没有使用Scaffold小部件来包装您的应用程序。 PageView小部件无法理解您要采用的尺寸,从而使应用程序崩溃。

答案 1 :(得分:0)

我发现了这个问题。我的问题是FadeInImage。

child: FadeInImage.memoryNetwork(
         placeholder: kTransparentImage,
         image: imageURL,
         fit: BoxFit.contain,
),

to

child: CachedNetworkImage(
         imageUrl: imageURL,
         fit: BoxFit.contain,
       errorWidget: (context, url, error) => Icon(
          Icons.error,
           color: Colors.red,
           ),
),
相关问题