UDACODING

Posts

Cara sort data json bercabang berdasarkan value tertentu pada Flutter

Bismillah, pada tips kali ini kita akan membahas tentang cara mengurutkan sebuah data json berdasarkan value tertentu yang berada didalamnya

Anggap kita punya sebuah data json dan kita menampilkannya seperti berikut :

import 'package:flutter/material.dart';
import 'package:passing_navigator_pop/pilih_warna.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  var siswa = [
    {
      "id": 2,
      "nama": "Rizal",
      "sudah_lulus": true
    },
    {
      "id": 4,
      "nama": "Endi",
      "sudah_lulus": false
    },
    {
      "id": 1,
      "nama": "Tika",
      "sudah_lulus": true
    },
    {
      "id": 3,
      "nama": "Fairuz",
      "sudah_lulus": false
    }
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Daftar Siswa"),
      ),
      body: ListView.builder(
        itemCount: siswa.length,
        itemBuilder: (context, index) {
          return Card(
            child: ListTile(
              leading: Text(siswa[index]['id'].toString()),
              title: Text(siswa[index]['nama']),
              trailing: siswa[index]['sudah_lulus']
                  ? Icon(Icons.check_circle, color: Colors.green,)
                  : Icon(Icons.school, color: Colors.blue),
            ),
          );
        }
      )
    );
  }
}
image-2 Cara sort data json bercabang berdasarkan value tertentu pada Flutter

Lalu bagaimana mengurutkannya? baik berdasarkan nama, id, atau lulusnya?

Caranya sangat mudah, kita bisa gunakan method sort seperti berikut :

untuk nama kita sort seperti berikut :

@override
  Widget build(BuildContext context) {
    // urutkan berdasarkan nama
    siswa.sort((siswa1, siswa2) {
      return siswa2['nama'].toString().compareTo(siswa1['nama'].toString());
    });

    return Scaffold(
      appBar: AppBar(
        title: Text("Daftar Siswa"),
      ),
      body: ListView.builder(
        itemCount: siswa.length,
        itemBuilder: (context, index) {
          return Card(
            child: ListTile(
              leading: Text(siswa[index]['id'].toString()),
              title: Text(siswa[index]['nama']),
              trailing: siswa[index]['sudah_lulus']
                  ? Icon(Icons.check_circle, color: Colors.green,)
                  : Icon(Icons.school, color: Colors.blue),
            ),
          );
        }
      )
    );
  }
image-4 Cara sort data json bercabang berdasarkan value tertentu pada Flutter

Untuk yang lainnya seperti id, atau sudah luluspun sama, kita tinggal mengganti valuenya

// urutkan berdasarkan id
siswa.sort((siswa1, siswa2) {
 return siswa1['id'].toString().compareTo(siswa2['id'].toString());
});
    
image-3 Cara sort data json bercabang berdasarkan value tertentu pada Flutter
// urutkan berdasarkan sudah lulus
    siswa.sort((siswa1, siswa2) {
      return siswa1['sudah_lulus'].toString().compareTo(siswa2['sudah_lulus'].toString());
    });
image-5 Cara sort data json bercabang berdasarkan value tertentu pada Flutter

Apabila kita ingin menyesuaikan mau pakai ascending atau descending, kita tinggal menyesuaikan saja penempatan comparenya sebagai contoh untuk descending nama yaitu seperti berikut :

siswa.sort((siswa1, siswa2) {
return siswa2['nama'].toString().compareTo(siswa1['nama'].toString());
});
image-6 Cara sort data json bercabang berdasarkan value tertentu pada Flutter

Leave a Reply :

* Your email address will not be published.