flutter 实现摇一摇功能

参考
参考

sensors_plus: ^1.3.2
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:sensors_plus/sensors_plus.dart';
import 'package:social_im/common/colors.dart';

//摇一摇小游戏
class ShakeGame extends StatefulWidget {
  const ShakeGame({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => ShakeGameState();
}

class ShakeGameState extends State<ShakeGame> {

  //是否已经显示摇一摇弹窗
  bool isShow = false;

  final _streamSubscriptions = <StreamSubscription<dynamic>>[];

  @override
  void initState() {
    //监听手机摇动
    shakeListen();
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
    //取消监听
    for (final subscription in _streamSubscriptions) {
      subscription.cancel();
    }
  }

  shakeListen() {
    _streamSubscriptions
        .add(userAccelerometerEvents.listen((UserAccelerometerEvent  event) {
      //不受重力的影响
      print("event的值${event}");
      int value = 4;
      if (event.x >= value ||
          event.x <= -value ||
          event.y >= value ||
          event.y <= -value ||
          event.z >= value ||
          event.z <= -value) {
        print("已摇了");
        if (isShow == false) {
          setState(() {
            isShow = true;
          });
          //延时两秒匹配到用户
          Future.delayed(const Duration(seconds: 2), () {
            print("跳出弹窗");
          });
        }
      }
    }));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      appBar: AppBar(
        title: const Text('摇一摇'),
        backgroundColor: CommonColors.getThemeColor(),
      ),
      body: Center(
          child: Padding(
              padding: const EdgeInsets.only(left: 5),
              child: Image(
                  image: isShow
                      ? const AssetImage('assets/images/icon_lan_match.png')
                      : const AssetImage(
                          'assets/images/conversion/icon_conversion_album.png'),
                  width: 6,
                  height: 11))),
    );
  }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值