#node.js #flutter #api #android-listview #flutter-futurebuilder
Вопрос:
Я извлекаю данные api и отображаю их в списке с помощью ListView builder , он правильно работает на эмуляторе, но когда я запускаю приложение на своем телефоне Android, он отображает пустой экран, вот он выглядит.
под меткой «Оставить историю» я отображаю данные из api, но сейчас это выглядит так.
Это выглядит так на эмуляторе
Вот код:
Извлечение данных api и вставка их в список
List<leaveHistory> historyList = [];
var loader = 0;
Future<List<leaveHistory>> _getRecord() async {
Dio dio = new Dio();
var data = {
'username': getname,
'token': getaccesstoken,
};
return dio
.post(localhostUrlLeaveHistoryON, data: json.encode(data))
.then((onResponse) async {
Map<String, dynamic> map = onResponse.data;
List<dynamic> data = map["data"];
for (var historyData in data) {
leaveHistory history = leaveHistory(
historyData["Date"],
historyData["description"],
historyData["type"],
historyData['fromdate'],
historyData["todate"],
historyData["noofleavedays"],
historyData["leave"]);
historyList.add(history);
loader = 0;
}
if (historyList.length == 0) {
loader = 1;
}
return historyList;
}).catchError((onerror) {
loader = 1;
print(onerror.toString());
});
}
display the data using ListView.builder
Widget build(BuildContext context) {
return Scaffold(
appBar: new MyAppBar(
title: Text("Leaves Tracker"),
onpressed: () {
Navigator.push(
context, MaterialPageRoute(builder: (context) => Profile()));
}),
drawer: NavigationDrawerWidget(),
body: Stack(overflow: Overflow.visible, children: <Widget>[
Container(
padding: EdgeInsets.fromLTRB(20, 10, 0, 0),
child: Text(
"Leave History",
style: TextStyle(fontSize: 30, fontFamily: 'RaleWay'),
),
),
Container(
padding: EdgeInsets.fromLTRB(10, 30, 0, 0),
child: FutureBuilder(
future: _getRecord(),
builder: (BuildContext context,
AsyncSnapshot<List<leaveHistory>> snapshot) {
if (snapshot.hasData) {
if (historyList.length != 0) {
return Container(
padding: EdgeInsets.fromLTRB(0, 30, 0, 0),
child: Expanded(
child: ListView.builder(
itemCount: snapshot.data.length,
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
Color c = Colors.red;
//changing the avatar color
if (i == 0)
i ;
else if (i == 1) {
c = Colors.blue;
i ;
} else if (i == 2) {
c = Color(int.parse(annualboxcolor));
i = 0;
}
Color c1 = Colors.green;
if (snapshot.data[index].Status == "Approved") {
c1 = Colors.green;
} else if (snapshot.data[index].Status ==
"Not Approved") {
c1 = Colors.red;
} else if (snapshot.data[index].Status ==
"Pending") {
c1 = Color(int.parse(pendingrequestcolor));
}
return SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Column(
children: [
ListTile(
leading: CircleAvatar(
radius: 25,
backgroundColor: c,
child: Container(
padding: EdgeInsets.fromLTRB(
0, 10, 0, 0),
child:
Column(children: <Widget>[
Text(
snapshot
.data[index].noofdays
.toString(),
style: TextStyle(
fontSize: 15.0,
fontWeight:
FontWeight.bold,
color: Colors.white),
),
Text(
int.parse(snapshot
.data[index]
.noofdays) >
1
? "Days"
: "Day",
style: TextStyle(
fontSize: 10.0,
color: Colors.white),
)
]),
)),
title:
Text(snapshot.data[index].type),
isThreeLine: true,
subtitle: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
snapshot.data[index].fromdate
" To "
snapshot.data[index].todate,
),
Text(snapshot.data[index].Status,
style: TextStyle(
color: c1,
fontWeight:
FontWeight.bold)),
Text(
snapshot
.data[index].description,
)
],
)),
Divider(
color: Colors.grey,
height: 10,
),
],
));
},
)));
}
}
if (loader == 1) {
print("run");
return Nodatafound();
} else {
return Center(
child: CircularProgressIndicator(
color: Colors.blue[500],
));
}
}),
),
]));
}
}
урок истории
class leaveHistory {
final String date;
final String fromdate;
final String todate;
final String description;
final String type;
final String Status;
final String noofdays;
leaveHistory(this.date, this.description, this.type, this.fromdate,
this.todate, this.noofdays, this.Status);
}
Когда я перенаправляю на этот экран из ящика, он сначала отображает эту ошибку
DioError [DioErrorType.response]: Http status error [300]
на этой catchError этой линии print(onerror.toString());
Обновить:
Когда я подключаю свой телефон к ноутбуку с помощью datacable, он работает нормально, но при установке apk возникает проблема.
Пожалуйста, помогите, где я поступаю неправильно.
Комментарии:
1. вы установили разрешение на доступ в Интернет в файле Android?
2. @RavindraS.Patil да
Ответ №1:
Если @Huthaifa не был тем ответом, который вы ищете, вы пытались обновить значение: localhostUrlLeaveHistoryON ?
Если вы используете что-то вроде: http://localhost
Пожалуйста, попробуйте изменить это на IP-адрес вашего компьютера.
Комментарии:
1. Я сомневаюсь, что это проблема с Интернетом или связана с API. Это также отображается в сборках выпуска, потому что именно так ошибки отображаются в выпуске в виде серых областей вместо обычного красного экрана.
2. да, вот почему я сначала сделал оговорку. Но, скорее всего, это из-за обнаруженной ошибки в dio.
3. На самом деле может быть и то, и другое.
4. епип, давай подождем его драгоценного ответа, ха-ха.
5. ха-ха, оба ответа мне не помогают! я получаю данные ответа api на своем экране, я тоже получаю ошибку 300, я думаю, что сначала, когда я перенаправляю на экран, он отправляет мне ошибку 300 и тоже справляюсь с этим, я отображаю циклический загрузчик, который отображается, когда я перенаправляю этот экран, а затем через несколько секунд он отображает мои данные
Ответ №2:
Ваша ошибка вызвана неправильным использованием виджета родительских данных. И это из-за использования расширенного внутреннего контейнера. Уберите свои Expanded отсюда:
return Container(
padding: EdgeInsets.fromLTRB(0, 30, 0, 0),
child: Expanded(
child: ListView.builder(
Вы также заметите, что ошибка в консоли исчезла. Всегда читайте ошибки и разбирайтесь в них. Ошибка будет на 100% означать, incorrect use of parent widget . Просто удалите расширенное.
Комментарии:
1. я все еще
incorrect use of parent widgetполучаю ошибку и ошибку dio 300 на эмуляторе тоже,2. Пожалуйста, проверьте мою часть обновления после публикации