按下按钮时颤动然后启动计时器

时间:2021-02-01 18:45:37

标签: flutter dart

目前,当我点击 onPress 时,我会切换它是否扫描设备,但我想要这样的功能,当我点击 onPressed 时,它只扫描我设置的时间。

扫描小部件

void onScanButtonPressed() {
    if (model.isScanning) {
      model.stopScan();
    } else {
      model.startScan();
    }
  }

onPressed 函数

ElevatedButton(
                onPressed: onScanButtonPressed,
                child: Text(model.scanButtonText),
              ),

定时器功能

Duration timer = new Duration(seconds: 5);

1 个答案:

答案 0 :(得分:0)

有很多不同的方式。

这是一种方法,使用 Flutter HooksRiverpod

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/all.dart';

void main() {
  runApp(
    MaterialApp(
      title: 'Scan with Time',
      home: Scaffold(
        body: MyWidget(),
      ),
    ),
  );
}

final modelProvider =
    StateNotifierProvider<MyModelNotifier>((ref) => MyModelNotifier());

class MyModelNotifier extends StateNotifier<bool> {
  MyModelNotifier(state) : super(false);

  Timer _timer;

  void stopScan() {
    state = false;
  }

  void startScan() {
    state = false;
    _timer?.cancel();
    _timer = Timer(Duration(seconds: 5), () => stopScan());
  }
}

class MyWidget extends HookWidget {
  @override
  Widget build(BuildContext context) {
    final scanning = useProvider(modelProvider.state);
    return Center(
      child: RaisedButton(
        onPressed: () => scanning
            ? context.read(modelProvider).stopScan()
            : context.read(modelProvider).startScan(),
        color: scanning ? Colors.red : Colors.green,
        child: Text(scanning ? 'STOP' : 'START'),
      ),
    );
  }
}