Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

onVisible和onInvisible没有被调用 #26

Open
fulibo opened this issue Sep 2, 2024 · 8 comments
Open

onVisible和onInvisible没有被调用 #26

fulibo opened this issue Sep 2, 2024 · 8 comments
Assignees
Labels
bug Something isn't working platform:web

Comments

@fulibo
Copy link

fulibo commented Sep 2, 2024

当网页随着浏览器退到后台时,插件的生命周期失效了

@chenenyu
Copy link
Owner

chenenyu commented Sep 2, 2024

方便提供一下简化的widget测试代码吗?

@fulibo
Copy link
Author

fulibo commented Sep 2, 2024

import 'package:flutter/material.dart';
import 'package:lifecycle/lifecycle.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorObservers: [defaultLifecycleObserver],
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}
class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text('生命周期测试(Web)'),
      ),
      body: LifecycleWrapper(
        onLifecycleEvent: (LifecycleEvent event) {
          switch(event) {
            case LifecycleEvent.visible:
              debugPrint('页面可见');
              break;

            case LifecycleEvent.invisible:
              debugPrint('页面不可见');
              break;

            default:
              break;
          }
        },
        child: Center(
          child: Text('生命周期测试'),
        ),
      ),
    );
  }
}

运行时添加的参数: -d chrome --web-browser-flag "--disable-web-security" --web-renderer canvaskit --web-hostname=xyz.com

模拟器或真机上访问对应网址,当浏览器退到后台,相应的日志并没有被打印

@chenenyu
Copy link
Owner

chenenyu commented Sep 3, 2024

好的,我看下,之前没怎么在web平台测试过。

@chenenyu
Copy link
Owner

chenenyu commented Sep 4, 2024

Try 0.9.0

@chenenyu chenenyu added bug Something isn't working platform:web labels Sep 4, 2024
@chenenyu chenenyu self-assigned this Sep 4, 2024
@fulibo
Copy link
Author

fulibo commented Sep 5, 2024

尝试0.9.0

并没有得到解决,我这边是依靠如下方案获得切到后台和切到前台的事件

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

    listen = document.onVisibilityChange.listen((event) {
      if (document.visibilityState == 'hidden') {
        debugPrint('页面变为不可见');
      } else if (document.visibilityState == 'visible') {
        debugPrint('页面变为可见');
      }
    });

    // 初始状态检查
    if (document.visibilityState == 'hidden') {
      debugPrint('页面初始状态为不可见');
    } else if (document.visibilityState == 'visible') {
      debugPrint('页面初始状态为可见');
    }
  }

  @override
  void dispose() {
    listen?.cancel();
    listen = null;

    super.dispose();
  }

@chenenyu
Copy link
Owner

chenenyu commented Sep 6, 2024

import 'package:flutter/material.dart';
import 'package:lifecycle/lifecycle.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      navigatorObservers: [defaultLifecycleObserver],
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}
class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text('生命周期测试(Web)'),
      ),
      body: LifecycleWrapper(
        onLifecycleEvent: (LifecycleEvent event) {
          switch(event) {
            case LifecycleEvent.visible:
              debugPrint('页面可见');
              break;

            case LifecycleEvent.invisible:
              debugPrint('页面不可见');
              break;

            default:
              break;
          }
        },
        child: Center(
          child: Text('生命周期测试'),
        ),
      ),
    );
  }
}

运行时添加的参数: -d chrome --web-browser-flag "--disable-web-security" --web-renderer canvaskit --web-hostname=xyz.com

模拟器或真机上访问对应网址,当浏览器退到后台,相应的日志并没有被打印

我用你的demo测试是可以的,回调正常。
image

@fulibo
Copy link
Author

fulibo commented Sep 6, 2024

我用你的demo测试是可以的回调,正常

你那边的测试case也是将浏览器置于后台?
我这边就第一次加载页面打印了可见,后面网页随浏览器退到后台和切回前台就没有其他打印了
image

@chenenyu
Copy link
Owner

chenenyu commented Sep 7, 2024

可以把所有Event的回调都打印看看

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working platform:web
Projects
None yet
Development

No branches or pull requests

2 participants