Home > Net >  GetX (Rx<Color>) Error when Widget setColor from main.dart
GetX (Rx<Color>) Error when Widget setColor from main.dart

Time:01-03

GetX: Color Model Error

I separate the Model and Controller classes.

model. dart:

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

class Model {    var name = "agus".obs;   var color = Colors.red[700].obs; }

controller. dart:

import 'package:get/get. dart';
import '../models/models. dart';
        
        class PersonController extends GetxController {
           var models = Models();
           void changeUpperCase() {
             models.name.value = "testing";
           }
        }

    

main.dart: var modelA = Get.put(OrangController());

      body: Center(
                   child: Obx(() => Text(
                         "My name is ${modelA. models.name}",
                         style: TextStyle(fontSize: 35, color: modelA.models.color),
                       ))),
               floatingActionButton: FloatingActionButton(onPressed: () {
                 modelA. changeUpperCase();
               })

In the VS Code IDE, I get an error at IDE:

The argument type 'Rx<Color?>' can't be assigned to the parameter type 'Color?'

CodePudding user response:

GetX is a package for Flutter that provides a set of powerful and easy-to-use tools for managing state in your Flutter app. It is inspired by the popular package called provider, but it takes a more reactive approach to state management.

In the context of GetX, the Model class is typically a plain Dart class that holds the data for your app, and the Controller class is a subclass of GetxController that manages the business logic for your app. The Model and Controller classes are typically used together to provide a separation of concerns in your app.

The Model class is responsible for holding the data and exposing it to the rest of the app, while the Controller class is responsible for handling user input, making API calls, and updating the Model as needed. This separation of concerns helps to make your app more organized and easier to maintain.

Here is a simple example of a Model and Controller pair in GetX:

 class UserModel {
  String name;
  int age;
}

class UserController extends GetxController {
  UserModel model;

  void updateName(String name) {
    model.name = name;
  }
}

In this example, the UserModel class holds the data for a user, and the UserController class has a method updateName that allows you to update the user's name.

CodePudding user response:

When you write this line :

 var color = Colors.red[700].obs;

This is not a just Color, it's an Rx<Color> observable that contains inside of it the Color value, it's equivalent to :

Rx<Color> color = Colors.red[700].obs;

So when you assign it directly to the color property like this:

// ...
style: TextStyle(fontSize: 35, color: modelA.models.color),

You're trying here to assign the wholeRx<Color> instead of only its value which is the Color, basically, you need to assign it like this:

// ...
style: TextStyle(fontSize: 35, color: modelA.models.color.value), // added .value here

Now the error should be gone and the code works normally.

  • Related