EN VI

error when trying to load data from json to DropDownButton Flutter dart?

2024-03-17 08:00:08
error when trying to load data from json to DropDownButton Flutter dart

I am trying to upload data from a json file to a DropDownButton and it gives me the following error When I run my application it gives me the following message: Exception has occurred. LateError (LateInitializationError: Field '_values@24401662' has not been initialized.)

I am new developing in flutter, I copy the codes I created:

deporte.json

[ { "nombre": "Fútbol", "icono": "sports_soccer" }, { "nombre": "Baloncesto", "icono": "sports_basketball" }, { "nombre": "Tenis", "icono": "sports_tennis" } ]

carga_deportes.dart


import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:flutter/services.dart';

class Valor {
  final String nombre;
  final IconData icono;

  Valor({required this.nombre, required this.icono});

  factory Valor.fromJson(Map<String, dynamic> json) {
    return Valor(
      nombre: json['nombre'] ?? '',
      icono: _getIconDataFromString(json['icono'] ?? ''),
    );
  }

  static IconData _getIconDataFromString(String iconoString) {
    switch (iconoString) {
      case 'arrow_back':
        return Icons.arrow_back;
      case 'search':
        return Icons.search;
      case 'add':
        return Icons.add;
      // Agrega más casos según los iconos que necesites manejar
      default:
        return Icons.error; // Icono por defecto en caso de que no se encuentre el icono
    }
  }
}

 // Importa la clase Valor

Future<List<Valor>> cargarValores() async {
  String data = await rootBundle.loadString('assets/deportes.json');
  List<dynamic> jsonList = json.decode(data);
  List<Valor> valores = [];
  for (var item in jsonList) {
    valores.add(Valor.fromJson(item));
  }
  return valores;
}

main.dart

import 'package:flutter/material.dart';
import 'package:sports_community/funciones/carga_deportes.dart';
// Importa la función cargarValores


void main() => runApp(const SelectorValores());


class SelectorValores extends StatefulWidget {
  const SelectorValores({super.key});

  @override
  // ignore: library_private_types_in_public_api
  _SelectorValoresState createState() => _SelectorValoresState();
}

class _SelectorValoresState extends State<SelectorValores> {
  late List<Valor> _valores;
  late Valor _valorSeleccionado = Valor(nombre: 'Selecciona un valor', icono: Icons.error); // Inicializa _valorSeleccionado

  @override
  void initState() {
    super.initState();
    cargarValores().then((listaValores) {
      setState(() {
        _valores = listaValores;
        _valorSeleccionado = _valores.first; // Puedes establecer el valor predeterminado aquí
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Selecciona un Valor'),
      ),
      body: Center(
        child: DropdownButton<Valor>(
          value: _valorSeleccionado,
          onChanged: (Valor? newValue) {
            setState(() {
              _valorSeleccionado = newValue!;
            });
          },
          items: _valores.map<DropdownMenuItem<Valor>>((Valor value) {
            return DropdownMenuItem<Valor>(
              value: value,
              child: Row(
                children: [
                  Icon(value.icono),
                  SizedBox(width: 10),
                  Text(value.nombre),
                ],
              ),
            );
          }).toList(),
        ),
      ),
    );
  }
}

I would greatly appreciate your guidance so I can advance with my learning!

I hope you can guide me with a solution

Solution:

1. Change the name of your assets from

deporte.json 

to

deportes.json

this is giving you this error

[ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: Unable to load asset: "assets/deportes.json".

2. From your project's root directory run.

flutter pub get

Then copy the whole code I am providing you and paste it inside your main.dart I fixed the code and its working without any errors

 import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:flutter/services.dart';

void main() => runApp(const MaterialApp(
      home: SelectorValores(),
    ));

class SelectorValores extends StatefulWidget {
  const SelectorValores({super.key});

  @override
  // ignore: library_private_types_in_public_api
  _SelectorValoresState createState() => _SelectorValoresState();
}

class _SelectorValoresState extends State<SelectorValores> {
  List<Valor> _valores = [];
  Valor _valorSeleccionado = Valor(
      nombre: 'Selecciona un valor',
      icono: Icons.error); // Inicializa _valorSeleccionado

  @override
  void initState() {
    super.initState();
    initializingLateVariables();
  }

  void initializingLateVariables() async {
    _valores = await cargarValores();
    _valorSeleccionado = _valores.first;
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Selecciona un Valor'),
      ),
      body: Center(
        child: DropdownButton<Valor>(
          value: _valorSeleccionado,
          onChanged: (Valor? newValue) {
            setState(() {
              _valorSeleccionado = newValue!;
            });
          },
          items: _valores.map<DropdownMenuItem<Valor>>((Valor value) {
            return DropdownMenuItem<Valor>(
              value: value,
              child: Row(
                children: [
                  Icon(value.icono),
                  SizedBox(width: 10),
                  Text(value.nombre),
                ],
              ),
            );
          }).toList(),
        ),
      ),
    );
  }
}

class Valor {
  final String nombre;
  final IconData icono;

  Valor({required this.nombre, required this.icono});

  factory Valor.fromJson(Map<String, dynamic> json) {
    return Valor(
      nombre: json['nombre'] ?? '',
      icono: _getIconDataFromString(json['icono'] ?? ''),
    );
  }

  static IconData _getIconDataFromString(String iconoString) {
    switch (iconoString) {
      case 'arrow_back':
        return Icons.arrow_back;
      case 'search':
        return Icons.search;
      case 'add':
        return Icons.add;
      // Agrega más casos según los iconos que necesites manejar
      default:
        return Icons
            .error; // Icono por defecto en caso de que no se encuentre el icono
    }
  }
}

// Importa la clase Valor

Future<List<Valor>> cargarValores() async {
  String data = await rootBundle.loadString('assets/deportes.json');

  List<dynamic> jsonList = json.decode(data);

  List<Valor> valores = [];
  for (var item in jsonList) {
    valores.add(Valor.fromJson(item));
  }
  return valores;
}

enter image description here

Answer

Login


Forgot Your Password?

Create Account


Lost your password? Please enter your email address. You will receive a link to create a new password.

Reset Password

Back to login