How to detect phone shakes in Flutter

Question

Just started with Flutter this weekend and am making great progress. I have an app that simply changes the image on screen when the image is tapped, or, if the phone is shaken. The first part was simple, and on tap, my images change. Struggling with the shake part. Been looking at the Sensors package, but am not having much luck (possibly because i don't fully understand what i'm looking for!). Do I just want the app to listen for when a certain accelerometer change happens, and if so, run my change image function? If so, what is the best way to do this? Any other ideas welcome! Thanks all :)

Update: This is what I have so far, pretty much exactly what I read from the Shake documentation. But nothing is happening on shake.

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

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

String mytext = "Martini?";

class DemoPage extends StatefulWidget {
  @override
  _DemoPageState createState() => _DemoPageState();
}

class _DemoPageState extends State<DemoPage> {
  @override
  void initState() {
    super.initState();
    ShakeDetector detector = ShakeDetector.waitForStart(onPhoneShake: () {
      mytext = "Shaken, not stirred";
      print("hello");
    });

    detector.startListening();
    // To close: detector.stopListening();
    // ShakeDetector.waitForStart() waits for user to call detector.startListening();
  }



  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Container(
                child: Padding(padding: const EdgeInsets.all(50),child: 
                Text(
      mytext,
      textAlign: TextAlign.center,
      style: TextStyle(
        fontSize: 25,
      ),
    )))));
  }
}

Answer 1

Use this package for identifying a shake event and for performing some action.

To listen to phone shake:

ShakeDetector detector = ShakeDetector.autoStart(
    onPhoneShake: () {
        // Do stuff on phone shake
    }
);

OR

ShakeDetector detector = ShakeDetector.waitForStart(
    onPhoneShake: () {
        // Do stuff on phone shake
    }
);

detector.startListening();

To stop listening:

detector.stopListening();

In order to install this package in your pubspec.yaml file, follow this link.

Samples can be found on this link.

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

class DemoPage extends StatefulWidget {
  @override
  _DemoPageState createState() => _DemoPageState();
}

class _DemoPageState extends State<DemoPage> {
  @override
  void initState() {
    super.initState();
    ShakeDetector detector = ShakeDetector.autoStart(onPhoneShake: () {
      // Do stuff on phone shake
    });
    // To close: detector.stopListening();
    // ShakeDetector.waitForStart() waits for user to call detector.startListening();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold();
  }
}

Answer 2

I was making a similar app like yours. You just want to change an image or do something else when we shake our phone, right?

The package 'package:shake/shake.dart' is right for this work. This package has some pre-defined functions which uses accelerometer reading from our phone and detect when we have shaked our phone and when we have stopped.

Instead of using:

ShakeDetector detector = ShakeDetector.waitForStart(onPhoneShake: () {
  mytext = "Shaken, not stirred";
  print("hello");
});

I have used:

 ShakeDetector detector = ShakeDetector.autoStart(onPhoneShake: () {
      setState(() {
        //Code for changing image or something else.
      });
 });

This solved the problem and when I shook my phone and stopped, the image changes just after I stopped shaking.

I don't know about other functions given in this package like waitForStart() and stopListening() function. Just the above autoStart() function did what I wanted.

Answer 3

As per the document of Shake Plugin it depends upon Sensors Plugin

You will have to add sensors plugin in your dependencies list in pubspec.yaml.

This will make your shake plugin detect shakes.

P.S. Happy Coding ! Stay Safe.