1

estoy trabajando con esta api: https://api.jikan.moe/v4/anime lo que quiero es obtener tanto las peliculas(imagenes) como sus titulos. antes solo estaba mostrando las imagenes dentro de un listview.builder horizontal y todo iba de maravilla. pero al querer poner sus respectivos titulos debajo de cada imagen obtuve el error mencionado en el titulo. introducir la descripción de la imagen aquí

final list = data['data'] as List;
      //final list = data['data']["title"] as List;
      //return list.map((e) => DataApi(image: e)).toList();
      return list
          .map((e) => DataApi(
              image: e["images"]["jpg"]["image_url"],
              title: e["titles"]["title"]))
          .toList();

la forma en que pretendo mostrarlos.

if (snapshot.hasData) {
          final lista = snapshot.data!;
          return Padding(
            padding: const EdgeInsets.symmetric(vertical: 20),
            child: Container(
              width: double.infinity,
              height: 200,
              child: ListView.builder(
                scrollDirection: Axis.horizontal,
                itemCount: lista.length,
                itemBuilder: (BuildContext context, int index) {
                  return Column(
                    children: [
                      Image.network(
                        lista[index].image,
                      ),
                      Text(lista[index].title),
                    ],
                  );
                },
              ),

como dije lo que pretendo es poner cada nombre de la pelicula debajo de su imagen. porfavor les agradeceria mucho. gracias

1 respuesta 1

1

Revisé el API y en esta linea

title: e["titles"]["title"]))

estás accediendo de manera erronea al titulo. Estás accediendo a

e["titles"]["title"])) es un arreglo que contiene otros objetos con la siguiente estructura 
                {
                    "type": "Default",
                    "title": "Cowboy Bebop"
                },
Si deseas acceder a un titulo de esta lista debes usar el index  e["titles"][0]["title"]))

Por otro lado, creo que quieres acceder al titulo que se encuentra en un nivel anterior, lo harías de la siguiente manera.

class DataApi{
   String? image = '';
   String? title = ''; 
  DataApi(
    {this.image, this.title});
}
getData() async{
  final uri = Uri.parse('https://api.jikan.moe/v4/anime');
var response = await http.get(uri);
print('Response status: ${response.statusCode}');
print('Response body: ${response.body}');
 final decodedData = json.decode(response.body);
final list = decodedData['data'] as List;
  final newList = list.map(
  (e) => new DataApi(
     image: e["images"]["jpg"]["image_url"],
    title: e["title"]
  )
  ).toList();
  
  for(var element in newList){
    print(element.image);
    print(element.title);
  }
}

El for únicamente es para que revises que estas accediendo a los elementos de forma correcta.

3
  • 1
    te lo agradezco mucho gracias Commented el 2 sept. 2022 a las 21:51
  • no comprendo porque me muestra todos los nombres si al añadir [0] estaria accediendo solo a la pelicula de ese valor no? tengo dudas porfavor Commented el 3 sept. 2022 a las 21:05
  • En el último for hacemos un recorrido de todas las películas que devuelve el API en este caso 25, si quisieras imprimir solo la primera película lo harías con print(newList[0].title), cuando estás agregando el titulo con e["titles"][0]["title"], estas tomando el primer valor de la lista "titles" de cada película. (Pero igual se siguen agregando las mismas 25, solo que cada una tiene una lista de hasta 3 nombres diferentes.) Te sugiero utilizar POSTMAN para tener un preview de la respuesta de tu API de manera que puedas comprender mejor la estructura de la respuesta.
    – JuanFCVal
    Commented el 5 sept. 2022 a las 15:40

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.