Reactive State manager

 import "package:flutter/material.dart";

import "package:get/get.dart";

///If we want that every time the value of variable changes then all the widgets which uses the variable must update itself then
///the variable must be reactive or observable and to make it Reactive(Rx) .obs is used with variable value.
///To update the widget which uses Rx variable must be placed inside Obx(() => Your widget which uses Rx)
///The widget will only update if and only if the Rx variable value changes.
///
/// Other ways of making the variable Rx
/// 1 - The first is using Rx{ Type }.
/// ================================================
/// initial value is recommended, but not mandatory
/// final name = RxString(" ");
/// final isLogged = RxBool(false);
/// final count = RxInt(0);
/// final balance = RxDouble(0.0);
/// final items = RxList<String>( [ ] );
/// final myMap = RxMap<String, int>( { } );
///
/// 2 - use Darts Generics, Rx<Type>
/// ================================================
/// final name = Rx<String>(" ");
/// final isLogged = Rx<Bool>(false);
/// final count = Rx<Int>(0);
/// final balance = Rx<Double>(0.0);
/// final number = Rx<Num>(0);
/// final items = Rx<List<String>>( [ ] );
/// final myMap = Rx<Map<String, int>>( { } );
///   Custom classes - it can be any class, literally
///   final user = Rx<User>();



void main() {
  runApp(ReactDemo(),);
}
class ReactDemo extends StatelessWidget {
  ReactDemo({super.key}) : super();

  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      debugShowCheckedModeBanner: false,
      title: "Reactive State manager",
      theme: ThemeData(
        primarySwatch: Colors.teal,
      ),
      home: ActiveDemo1(),
    );
  }
}
class ActiveDemo1 extends StatelessWidget {
  ActiveDemo1({super.key}) : super();

  var count = 0.obs;
  void increment() {
    count++;
  }
  void decrement() {
    count--;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Reactive State manager"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() {
              return Text("Count value is $count", style: TextStyle(fontSize: 25.0,),);
            },),
            SizedBox(height: 100.0,),
            ElevatedButton(
              onPressed: () {
                increment();
              },
              child: Text("Increment"),
            ),
            SizedBox(height: 100.0,),
            ElevatedButton(
              onPressed: () {
                decrement();
              },
              child: Text("Decrement"),
            ),
          ],
        ),
      ),
    );
  }
}