Sorting Columns in Flutters Data Table - flutter

Question

I'm trying to sort the data in the Flutter Data Table, but no matter what I try, either it does nothing or it returns this error: The method 'sort' was called on null. Receiver: null Tried calling: sort(Closure: (VehicleData, VehicleData) => int). I've tried many options I read online, but none of them seems to work, so it's got to be somewhere in my code. Here it is:
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'models/vehicle.dart';
import 'screens/vehicle_details_screen.dart';
import 'services/vehicle_api.dart';
import 'screens/edit_screen.dart';
import 'models/vehicle_data_provider.dart';
import 'package:http/http.dart' as http;
class VehicleList extends StatefulWidget {
#override
_VehicleList createState() => _VehicleList();
}
class _VehicleList extends State<VehicleList> {
bool _sortNameAsc = true;
bool _sortAsc = false;
int _sortColumnIndex;
List<VehicleData> _persons;
_getPosts() async {
HomePageProvider provider =
Provider.of<HomePageProvider>(context, listen: false);
var postsResponse = await fetchVehicles();
if (postsResponse.isSuccessful) {
provider.setPostsList(postsResponse.data, notify: false);
} else {
provider.mergePostsList(postsResponse.data, notify: false);
}
provider.setIsHomePageProcessing(false);
}
#override
void initState() {
_getPosts();
super.initState();
}
#override
Widget build(BuildContext context) {
return Column(
children: [
Consumer<HomePageProvider>(
builder: (context, vehicleData, child) {
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
SizedBox(
height: 12.0,
),
Container(
decoration: BoxDecoration(
color: Colors.grey[300],
borderRadius: BorderRadius.all(
Radius.circular(12.0),
),
),
child: SingleChildScrollView(
child: DataTable(
sortColumnIndex: _sortColumnIndex,
sortAscending: _sortAsc,
columnSpacing: 30,
columns: <DataColumn>[
DataColumn(
numeric: false,
onSort: (columnIndex, sortAscending) {
setState(() {
if (columnIndex == _sortColumnIndex) {
_sortAsc = _sortNameAsc = sortAscending;
} else {
_sortColumnIndex = columnIndex;
_sortAsc = _sortNameAsc;
}
_persons.sort((a, b) =>
a.friendlyName.compareTo(b.friendlyName));
if (!sortAscending) {
_persons = _persons.toList();
}
});
},
label: Text(
'Friendly Name',
style: TextStyle(fontStyle: FontStyle.italic),
),
),
DataColumn(
label: Text(
'Licence Plate',
style: TextStyle(fontStyle: FontStyle.italic),
),
),
DataColumn(
label: Text(
'Delete',
style: TextStyle(fontStyle: FontStyle.italic),
),
),
],
rows: List.generate(
vehicleData.postsList.length,
(index) {
VehicleData post = vehicleData.getPostByIndex(index);
return DataRow(
cells: <DataCell>[
DataCell(
Text('${post.friendlyName}'),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
VehicleDetailsScreen(
color: post.color,
friendlyName:
post.friendlyName,
licencePlate:
post.licencePlate,
)));
},
),
DataCell(
Text('${post.licencePlate}'),
),
DataCell(
IconButton(
icon: Icon(Icons.delete),
onPressed: () {
vehicleData.deletePost(post);
},
),
),
],
);
},
),
),
),
),
],
);
},
),
],
);
}
}
I've tried putting the _sortASc in the initState and set it as false, but doesn't seem to do the trick. Any help is appreciated!

Answer 1

Your _persons list is null. You can initialize it. And check if null before sorting.
List<VehicleData> _persons = List<VehicleData>();
// ...
if(_persons != null) {
_persons.sort((a, b) =>
a.friendlyName.compareTo(b.friendlyName));
if (!sortAscending) {
_persons = _persons.toList();
}
}