Flutter - RangeError(index)

I get an error while I'm building a ListView. In this flutter app I try to count for each column some points when a button is clicked. But I'm getting always the same error.


══╡ EXCEPTION CAUGHT BY GESTURE

I/flutter (28729): The following RangeError was thrown while handling
a gesture: I/flutter (28729): RangeError (index): Invalid value: Valid
value range is empty: 0


This is my code and I hope somebody is able to help me fixing the error:

import 'package:flutter/material.dart';


class Punktezaehler extends StatefulWidget{

final List<String> spieler_namen;
Punktezaehler(this.spieler_namen);

@override
State<StatefulWidget> createState() => new _Punktezaehler(this.spieler_namen);
}


class _Punktezaehler extends State<Punktezaehler>{

final List<String> spieler_namen;
_Punktezaehler(this.spieler_namen);

List<int> punkteanzahl_teamEins = [];
List<int> punkteanzahl_teamZwei = [];

int team1_hinzugezaehlt = 0;
int team2_hinzugezaehlt = 0;

@override
Widget build(BuildContext context) {


var spieler1 = spieler_namen[0].substring(0,3);
var spieler2 = spieler_namen[1].substring(0,3);
var spieler3 = spieler_namen[2].substring(0,3);
var spieler4 = spieler_namen[3].substring(0,3);

return new Scaffold(
appBar: new AppBar(
automaticallyImplyLeading: false,
title: new Text("$spieler1 & $spieler2 vs" +" $spieler3 & $spieler4"),
actions: <Widget>[

],
),
body: Container(
child: new Row(
children: <Widget>[
new Column(
children: <Widget>[
new IconButton(
icon: Icon(Icons.exposure_plus_2),
onPressed: () => punkte_hinzuzaehlen(1, 2)
)
],
),
new Padding(padding: EdgeInsets.only(left: 100.0)),
new Expanded(
child: ListView.builder(
itemCount: punkteanzahl_teamEins.length, //--> Error is thrown here
itemBuilder: (context, index){
return Text(punkteanzahl_teamEins[index].toString());
}
),
),
new Expanded(
child: ListView.builder(
itemCount: punkteanzahl_teamZwei.length, //--> Error is thrown here
itemBuilder: (context, index){
return Text(punkteanzahl_teamZwei[index].toString());
}
),
),
new Column(
children: <Widget>[
new IconButton(
icon: Icon(Icons.exposure_plus_2),
onPressed: () => punkte_hinzuzaehlen(2, 2)
)],
)
],
)
),
);
}

void punkte_hinzuzaehlen(int team, int nummer){
if (team == 1){
setState(() {
punkteanzahl_teamEins[team1_hinzugezaehlt] = nummer;
team1_hinzugezaehlt++;
});
}
else if(team == 2){
setState(() {
punkteanzahl_teamZwei[team2_hinzugezaehlt] = nummer;
team2_hinzugezaehlt++;
});
}
}
}


the problem that when you click a button you are calling this line

punkteanzahl_teamEins[team1_hinzugezaehlt]


and team1_hinzugezaehlt have an initial value of 0 but every time the user click the button this value will increase by one
so let's say your punkteanzahl_teamEins list contains 2 items in the fourth click the value team1_hinzugezaehlt will be 4 witch will cause this error . so the solution is to check whether the value is in the range or not

if (team1_hinzugezaehlt<punkteanzahl_teamEins.length){
setState(() {
punkteanzahl_teamEins[team1_hinzugezaehlt] = nummer;
team1_hinzugezaehlt++;
});
}


and do the same for the second function