#flutter #dart #flutter-layout
#flutter #dart #flutter-макет
Вопрос:
Я выполняю цикл по элементам списка в ListView.builder
List _rBoxes = new List();//declare
данные, которые я хочу зациклить, выглядят примерно так:
{
"box_content": {
"box_1": [
{
"id": "9",
"name": "abc"
},
{
"id": "10",
"name": "xyz"
}
],
"box_2": [
{
"id": "8",
"name": "acc"
}
],
"box_3": [
{
"id": "1",
"name": "abc"
}
],
"box_4": [
{
"id": "4",
"name": "amno"
},
{
"id": "6",
"name": "jkl"
}
],
"box_5": [
{
"id": "7",
"name": "xre"
}
]
}
}
затем я добавляю эти элементы в список
_rBoxes.addAll(data['box_content']);//it gives error - Unhandled Exception: type '_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Iterable<dynamic>'
//дизайн виджета
ListView.builder(
physics: NeverScrollableScrollPhysics(),
itemCount: _rBoxItems.length,
itemBuilder: (BuildContext context, int index) {
return Text("${_rBoxItems[index]}",
style: TextStyle(fontSize: 20.0));
})
Ошибка :
//здесь я хочу зациклить индекс box_1 (только) в представлении списка, как этого добиться, если я выдал
_rBoxItems['box_1'].length
сообщение об ошибке. фактически я застрял в этом сценарии, помогите мне решить эту проблему.
Комментарии:
1.
_rBoxes.addAll(data['box_content']);
Вы хотите добавить все кrBoxes
?
Ответ №1:
Сначала вам нужно создать Data
модель для преобразования ваших данных json в модель, Data
класс должен выглядеть следующим образом,
class Data {
BoxContent boxContent;
Data({this.boxContent});
Data.fromJson(Map<String, dynamic> json) {
boxContent = json['box_content'] != null
? new BoxContent.fromJson(json['box_content'])
: null;
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
if (this.boxContent != null) {
data['box_content'] = this.boxContent.toJson();
}
return data;
}
}
class BoxContent {
List<Box> box;
BoxContent({this.box});
BoxContent.fromJson(Map<String, dynamic> json) {
if (json['box'] != null) {
box = new List<Box>();
json['box'].forEach((v) {
box.add(new Box.fromJson(v));
});
}
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
if (this.box != null) {
data['box'] = this.box.map((v) => v.toJson()).toList();
}
return data;
}
}
class Box {
String id;
String name;
Box({this.id, this.name});
Box.fromJson(Map<String, dynamic> json) {
id = json['id'];
name = json['name'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['id'] = this.id;
data['name'] = this.name;
return data;
}
}
Затем проанализируйте данные json в вашей Data
модели, например,
import 'dart:convert'; // import this
String jsonData = "{ ... }" // your json as string
Data _data= Data.fromJson(jsonDecode(jsonData));
Наконец, вы можете достичь того, что вам требовалось,
ListView.builder(
physics: NeverScrollableScrollPhysics(),
itemCount: _rBoxItems.length,
itemBuilder: (BuildContext context, int index) {
return Text(_data.boxContent.box[index].length.toString(),
style: TextStyle(fontSize: 20.0),
);
}),
Примечание: вы можете просто сгенерировать модели для анализа из данных json здесь
Ответ №2:
Я думаю, вы хотите повторить контекст окна. Если вы извлекаете данные из API, сначала вы должны создать свои модели данных, и для этого вы можете использовать app.quicktype.io это работает очень хорошо для dart. Когда я добавляю туда содержимое вашего Box_1, оно дает мне такой объект.
После создания ваших моделей данных. Вы можете использовать эту функцию для получения объекта из строки json и преобразования их в список. Box.fromJson(String str) => Box.fromMap(json.decode(str));
Ответ №3:
потому что вы data['box_content']
— это карта, но _rBoxes.addAll нужен список, поэтому он сообщит об ошибке:
Unhandled Exception: type '_InternalLinkedHashMap<String, dynamic>' is not a subtype of type 'Iterable<dynamic>
вы должны преобразовать data['box_content']
в список, например:
_rBoxes.addAll(data['box_content'].entries.map((entry) => { entry.key, entry.value }).toList());
надеюсь, полезно ^_^
Комментарии:
1. да, ошибка устранена, но я хочу зациклить только объект box_1 в построителе представления списка, в настоящее время он зацикливает полный объект внутри box_content. @hysunny
2. хорошо ~ На самом деле, это легко получить
box_1
после преобразования карты в список , вы можете использоватьList[0]
.3. вы имеете в виду следующее: ListView.builder(ItemCount: _rBoxItems[0].длина,itemBuilder: (BuildContext context, int index) { возвращаемый текст(_rBoxItems[0][index].toString()); })