android - 通过从 firebase 实时数据库获取开/关值来更新切换按钮的状态

Question

我试图通过从 firebase 数据库中获取值来控制我的开关。每当更改时，它都会监听该值，但我不明白如何使用该值来切换按钮。这基本上是一个应用程序，您可以在其中通过应用程序和应用程序通过硬件控制硬件开关，firebase 作为它们之间的桥梁。

child: LiteRollingSwitch(
    value: state,
    textOn: 'active',
    textOff: 'inactive',
    colorOn: Colors.lightGreen,
    colorOff: Colors.deepOrange,
    iconOn: Icons.lightbulb_outline,
    iconOff: Icons.power_settings_new,
    onChanged: (bool value) async{
      print('turned ${(value) ? 'on' : 'off'}');
      final databasereference2 = FirebaseDatabase.instance.reference();
      final FirebaseAuth _auth=FirebaseAuth.instance;
      final FirebaseUser user = await _auth.currentUser();
      final uid = user.uid;
      final username=user.email;
      var currDt = DateTime.now();
      if(value==true)
      {
        databasereference2.child('users').child(uid).child('Activity log').child('2020').child(currDt.month.toString()).child('day'+currDt.day.toString()).push().set({'state': 'on','switch id':'bed bulb','time':currDt.hour.toString()+':'+currDt.minute.toString()+':'+currDt.second.toString()});
        databasereference2.child('users').child(uid).child('Live Status').child('bedroom').child('bedbulb').set('on');
      }
      else{databasereference2.child('users').child(uid).child('Activity log').child('2020').child(currDt.month.toString()).child('day'+currDt.day.toString()).push().set({'state': 'on','switch id':'bed bulb','time':currDt.hour.toString()+':'+currDt.minute.toString()+':'+currDt.second.toString()});
      databasereference2.child('users').child(uid).child('Live Status').child('bedroom').child('bedbulb').set('off');}

我正在听的部分是：

databasereference2.child('users').child(uid).child('Live Status').child('bedroom').onValue.listen((event) {
        var snapshot = event.snapshot;
        var x = snapshot.value['bedbulb'];
        print(x);
        if (x == 'on') {setState(() {
          value=true;
          print(value);
          state=value;
          print(state);


        });
        }
        else{
          setState(() {
            value=false;
            print(value);
            state=value;
            print(state);
          });
        }
      }
      );
    },
  ),

请帮助我使用监听的值来切换按钮。这个切换开关来自颤振库 LiteRollingSwitch，它的代码在这里：

library lite_rolling_switch;

import 'package:flutter/material.dart';
import 'dart:ui';
import 'dart:math';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';
import 'package:flutter/widgets.dart';

class LiteRollingSwitch extends StatefulWidget {
  @required
  final bool value;
  @required
  final Function(bool) onChanged;
  final String textOff;
  final String textOn;
  final Color colorOn;
  final Color colorOff;
  final double textSize;
  final Duration animationDuration;
  final IconData iconOn;
  final IconData iconOff;
  final Function onTap;
  final Function onDoubleTap;
  final Function onSwipe;
  final Function toggleswitch;

  LiteRollingSwitch(
      {this.value = false,
      this.textOff = "Off",
      this.textOn = "On",
      this.textSize = 14.0,
      this.colorOn = Colors.green,
      this.colorOff = Colors.red,
      this.iconOff = Icons.flag,
      this.iconOn = Icons.check,
      this.animationDuration = const Duration(milliseconds: 600),
      this.onTap,
      this.onDoubleTap,
      this.onSwipe, this.toggleswitch,
      this.onChanged});

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

class _RollingSwitchState extends State<LiteRollingSwitch>
    with SingleTickerProviderStateMixin {
  AnimationController animationController;
  Animation<double> animation;
  double value = 0.0;
  final databasereference2 = FirebaseDatabase.instance.reference();

  bool turnState;




  @override
  void dispose() {
    animationController.dispose();
    super.dispose();
  }

  @override
  void initState() {
    super.initState();
    animationController = AnimationController(
        vsync: this,
        lowerBound: 0.0,
        upperBound: 1.0,
        duration: widget.animationDuration);
    animation =
        CurvedAnimation(parent: animationController, curve: Curves.easeInOut);
    animationController.addListener(() {
      setState(() {
        value = animation.value;
      });
    });
    turnState = widget.value;
    _determine();
  }

  @override
  Widget build(BuildContext context) {
    Color transitionColor = Color.lerp(widget.colorOff, widget.colorOn, value);

    return GestureDetector(
      onDoubleTap: () {
        _action();
        if (widget.onDoubleTap != null) widget.onDoubleTap();
      },
      onTap: () {
        _action();
        if (widget.onTap != null) widget.onTap();
      },
      onPanEnd: (details) {
        _action();
        if (widget.onSwipe != null) widget.onSwipe();
        //widget.onSwipe();
      },
      child: Container(
        padding: EdgeInsets.all(5),
        width: 130,
        decoration: BoxDecoration(
            color: transitionColor, borderRadius: BorderRadius.circular(50)),
        child: Stack(
          children: <Widget>[
            Transform.translate(
              offset: Offset(10 * value, 0), //original
              child: Opacity(
                opacity: (1 - value).clamp(0.0, 1.0),
                child: Container(
                  padding: EdgeInsets.only(right: 10),
                  alignment: Alignment.centerRight,
                  height: 40,
                  child: Text(
                    widget.textOff,
                    style: TextStyle(
                        color: Colors.white,
                        fontWeight: FontWeight.bold,
                        fontSize: widget.textSize),
                  ),
                ),
              ),
            ),
            Transform.translate(
              offset: Offset(10 * (1 - value), 0), //original
              child: Opacity(
                opacity: value.clamp(0.0, 1.0),
                child: Container(
                  padding: EdgeInsets.only(/*top: 10,*/ left: 5),
                  alignment: Alignment.centerLeft,
                  height: 40,
                  child: Text(
                    widget.textOn,
                    style: TextStyle(
                        color: Colors.white,
                        fontWeight: FontWeight.bold,
                        fontSize: widget.textSize),
                  ),
                ),
              ),
            ),
            Transform.translate(
              offset: Offset(80 * value, 0),
              child: Transform.rotate(
                angle: lerpDouble(0, 2 * pi, value),
                child: Container(
                  height: 40,
                  width: 40,
                  alignment: Alignment.center,
                  decoration: BoxDecoration(
                      shape: BoxShape.circle, color: Colors.white),
                  child: Stack(
                    children: <Widget>[
                      Center(
                        child: Opacity(
                          opacity: (1 - value).clamp(0.0, 1.0),
                          child: Icon(
                            widget.iconOff,
                            size: 25,
                            color: transitionColor,
                          ),
                        ),
                      ),
                      Center(
                          child: Opacity(
                              opacity: value.clamp(0.0, 1.0),
                              child: Icon(
                                widget.iconOn,
                                size: 21,
                                color: transitionColor,
                              ))),
                    ],
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  _action() {
    _determine(changeState: true);
  }

  _determine({bool changeState = false}) {
    setState(() {
      if (changeState) turnState = !turnState;
      (turnState)
          ? animationController.forward()
          : animationController.reverse();

      widget.onChanged(turnState);
    });
  }
}

标签： androidfirebaseflutterfirebase-realtime-database