flutter flutter_screenutil Looking up a deactivated widget‘s ancestor is unsafe.

先强调一下,很多问题可以使用reStart更新试一下下!!!

使用flutter_screenutil 报错 Looking up a deactivated widget’s ancestor is unsafe.

The following assertion was thrown while dispatching notifications for SwiperController:
Looking up a deactivated widget’s ancestor is unsafe.
At this point the state of the widget’s element tree is no longer stable.
To safely refer to a widget’s ancestor in its dispose() method, save a reference to the ancestor
by
calling dependOnInheritedWidgetOfExactType() in the widget’s didChangeDependencies() method.

为SwipController发送通知时引发了以下断言:

查找停用小部件的祖先是不安全的。

此时,小部件元素树的状态不再稳定。

要在dispose()方法中安全地引用小部件的祖先,请保存对祖先的引用

通过

在小部件的didChangeDependencies()方法中调用dependOnInheritedWidgetOfExactType()。

初始代码,这个组件引用到了ListView里,开始报错

在这里插入图片描述
在这里插入图片描述

经过仔细阅读使用文档,核对版本号

新版本代码如下

首先要在lib/main.dart注册一下

在这里插入图片描述

import 'package:flutter/material.dart';
import 'pages/tabs/Tabs.dart';
// import 'routers/router.dart';
import 'pages/tabs/Tabs.dart';
import 'pages/test/Search.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

void main() {
  runApp(MyApp());
}

// 输入stf  有状态组件
// stss 无状态组件
class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final Map<String, WidgetBuilder> routes = {
    '/': (context) => Tabs(),
    '/search': (context) => SearchPage(),
  };

  Route<dynamic> _onGenerateRoute(RouteSettings settings) {
    //   return MaterialPageRoute(builder: (context) {
    // 如果访问的路由页需要登录,但当前未登录,则直接返回登录页路由,
    // 引导用户登录;其它情况则正常打开路由。
    // 统一处理
    // })
    final String? name = settings.name;
    final Function pageContentBuilder = routes[name] as Function;
    print('到1');
    if (settings.arguments != null) {
      print('到2');
      final Route route = MaterialPageRoute(
          builder: (context) =>
              pageContentBuilder(context, arguments: settings.arguments));
      return route;
    } else {
      print('到3');
      final Route route =
          MaterialPageRoute(builder: (context) => pageContentBuilder(context));
      return route;
    }
  }

  @override
  Widget build(BuildContext context) {
    // return MaterialApp(
    //   // home: Tabs()
    //   initialRoute: '/',
    //   onGenerateRoute: _onGenerateRoute,
    // );
    return ScreenUtilInit(
      designSize: Size(360, 690),
      builder: () => MaterialApp(
        // home: Tabs()
        initialRoute: '/',
        onGenerateRoute: _onGenerateRoute,
      ),
    );
  }
}

使用案例

Widget _titleWidget(value) {
    return Container(
      height: 32.h,
      margin: EdgeInsets.only(left: 20.w),
      padding: EdgeInsets.only(left: 20.w),
      decoration: BoxDecoration(
          border: Border(left: BorderSide(color: Colors.red, width: 10.w))),
      child: Text(value, style: TextStyle(color: Colors.pink)),
    );
  }

最需要注意的一点点!!!!使用reStart更新试一下下!!!

在这里插入图片描述

大功告成

在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
您好!对于封装一个flutter_screenutil,您可以按照以下步骤进行操作: 1. 首先,在项目的`pubspec.yaml`文件中添加`flutter_screenutil`依赖项。可以在`dependencies`部分添加以下代码: ```yaml dependencies: flutter_screenutil: ^5.0.0 ``` 2. 在您的项目中创建一个名为`screen_util.dart`的文件,用于封装`flutter_screenutil`。 3. 在`screen_util.dart`文件中导入必要的库: ```dart import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:flutter/material.dart'; ``` 4. 创建一个名为`ScreenUtil`的类,并添加以下静态方法: ```dart class ScreenUtil { static void init(BuildContext context) { FlutterScreenUtil.init(context); } static double setWidth(double width) { return FlutterScreenUtil().setWidth(width); } static double setHeight(double height) { return FlutterScreenUtil().setHeight(height); } static double setSp(double fontSize) { return FlutterScreenUtil().setSp(fontSize); } } ``` 5. 在您的项目中的`main.dart`文件中,使用`ScreenUtil.init(context)`初始化`ScreenUtil`,例如: ```dart void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { ScreenUtil.init(context); return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(), ); } } ``` 6. 现在,您可以在项目的任何地方使用`ScreenUtil.setWidth`、`ScreenUtil.setHeight`和`ScreenUtil.setSp`来设置宽度、高度和字体大小,例如: ```dart Container( width: ScreenUtil.setWidth(200), height: ScreenUtil.setHeight(100), child: Text( 'Hello', style: TextStyle(fontSize: ScreenUtil.setSp(20)), ), ), ``` 通过以上步骤,您可以封装一个简单的`flutter_screenutil`工具类,方便在项目中使用屏幕适配功能。希望对您有所帮助!如果您还有其他问题,请随时提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值