Question

对不起，我英语不好。我实施了资产的准备工作，但是他没有听到任何变化，总是在我第一次选择指南图标时，在导航平稳且图标状态快速变化之后，他的状态变化延迟很小，我是扑朔迷离的初学者，也许是我的逻辑做错了。有更多经验的人可以看到我在哪里吗？我正在使用物理设备进行测试，Android。

import 'package:flutter/material.dart';
import 'package:gestorgendo/pages/Dash/ScheduleScreen.dart';

class DashScreen extends StatefulWidget {
  @override
  _DashScreenState createState() => _DashScreenState();
}

class _DashScreenState extends State<DashScreen> with SingleTickerProviderStateMixin {
  TabController _tabcontroller;
  int _tabIndex = 0;
  Image calendarSelect;
  Image calendarUnselect;
  Image invoiceSelect;
  Image invoiceUnselect;
  Image addSelect;
  Image addUnselect;
  Image chatSelect;
  Image chatUnselect;
  Image settingsSelect;
  Image settingsUnselect;

  List<Widget> _tabListBody = [ new ScheduleScreen(), new ScheduleScreen(), new ScheduleScreen(), new ScheduleScreen(), new ScheduleScreen()];
  @override
  void initState(){
    super.initState();
      calendarSelect = new Image.asset("assets/icons/calendar_2.png",width: 26.0, height: 26.0);
      calendarUnselect = new Image.asset("assets/icons/calendar_grey_2.png",width: 26.0, height: 26.0);

      invoiceSelect = new Image.asset("assets/icons/invoice.png",width: 30.0, height: 30.0);
      invoiceUnselect = new Image.asset("assets/icons/invoice_grey.png",width: 30.0, height: 30.0);

      addSelect = new Image.asset("assets/icons/add.png",width: 26.0, height: 26.0);
      addUnselect = new Image.asset("assets/icons/add_grey.png",width: 26.0, height: 26.0);

      chatSelect = new Image.asset("assets/icons/chat.png",width: 26.0, height: 26.0);
      chatUnselect = new Image.asset("assets/icons/chat_grey.png",width: 26.0, height: 26.0);

      settingsSelect = new Image.asset("assets/icons/settings.png",width: 26.0, height: 26.0);
      settingsUnselect = new Image.asset("assets/icons/settings_grey.png",width: 26.0, height: 26.0);

    _tabcontroller = new TabController(length: 5, vsync: this);
    _tabcontroller.addListener((){
      setState(() {
        _tabIndex = _tabcontroller.index;
      });
    });
  }
    @override
    void didChangeDependencies() async {
      super.didChangeDependencies();
      await precacheImage(calendarSelect.image,context);
      await precacheImage(calendarUnselect.image,context);

      await precacheImage(invoiceSelect.image,context);
      await precacheImage(invoiceUnselect.image,context);

      await precacheImage(addSelect.image,context);
      await precacheImage(addUnselect.image,context);

      await precacheImage(chatSelect.image,context);
      await precacheImage(chatUnselect.image,context);

      await precacheImage(settingsSelect.image,context);
      await precacheImage(settingsUnselect.image,context);

    }
  @override
  void dispose() {
    // Dispose of the Tab Controller
    _tabcontroller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new TabBarView(
        controller: _tabcontroller,
        children: _tabListBody,
      ),
      bottomNavigationBar: new TabBar(
        controller: _tabcontroller,
        tabs: <Widget>[
          Tab(
            //icon: new Icon(Icons.calendar_today, color: _tabIndex == 0 ? Colors.green : Colors.grey),
            icon: _tabIndex == 0 
                  ? calendarSelect
                  : calendarUnselect
            //text:"Home",      
          ),
          Tab(
            //icon: new Icon(Icons.search, color: _tabIndex == 1 ? Colors.green : Colors.grey),
            icon: _tabIndex == 1 
                  ? invoiceSelect
                  : invoiceUnselect
            //text: "Busca"
          ),
          Tab(
            //icon: new Icon(Icons.add_box, color: _tabIndex == 2 ? Colors.green : Colors.grey),
            icon: _tabIndex == 2 
                  ? addSelect
                  : addUnselect
            //text: "Add"
          ),
          Tab(
            //icon: new Icon(Icons.message, color: _tabIndex == 3 ? Colors.green : Colors.grey),
            icon: _tabIndex == 3 
                  ? chatSelect
                  : chatUnselect
            //text: "Favotiros"
          ),
          Tab(
            //icon: new Icon(Icons.more_vert, color: _tabIndex == 4 ? Colors.green : Colors.grey),
            icon: _tabIndex == 4 
                  ? settingsSelect
                  : settingsUnselect
            //text: "More"
          ),
        ],
      ),
    );
  }
}

Answer 1

在Flutter上，这种行为是“正常”。

在didChangeDependencies方法之后调用build方法。因此，预缓存发生在渲染屏幕之后。更进一步，ImageProvider类已经可以处理预缓存了，这就是为什么看不到差异的原因。另外，您无法在构建之前调用预缓存，因为它需要initState()上没有的上下文。而且，如果您在build方法上调用它（是的，每次状态更新时都会调用它，但是您可以使用布尔值来知道是否执行过一次，但是无论如何都不应该这样做），预编译将在构建完成后结束，因为它会返回Future，并且您无法等待build。

您似乎将图像用作图标，因此建议您使用Material或Cupertino图标库。如果这不能满足您的需求，您可以看看FontAwesome库。

font_awesome_flutter

无论如何，如果您需要有关此主题的更多信息，在Flutter存储库上有一个与此相关的未解决问题，您甚至可以在其中找到骇客程序（涉及将图像加载为base64）here。

希望对您有所帮助！

预缓存方法映像不缓存

1 个答案: