Здравствуйте, я пытался сделать что-то вроде Instagram Stories, но когда я использую более 6 картинок, Flutter Performance из Android Studio сходит с ума, также мой P c. И мне было интересно, есть ли что-то, чтобы это предотвратить.
Главный виджет
class Story extends StatelessWidget {
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: <Widget>[
AddStory(),
PeopleStories(),
],
),
);
}
}
Второй виджет
class PeopleStories extends StatelessWidget {
final List<String> storiesPic = [
'https://images.unsplash.com/photo-1536896407451-6e3dd976edd1?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
'https://images.unsplash.com/photo-1553457055-88e354f1257c?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
'https://images.unsplash.com/photo-1545064189-2d901f702a28?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
'https://images.unsplash.com/photo-1501943416256-08140ba03763?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1436&q=80',
'https://images.unsplash.com/photo-1572151510493-38eb612d23be?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1268&q=80',
'https://images.unsplash.com/photo-1548536154-b47a70d27d8e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1234&q=80',
// 'https://images.unsplash.com/photo-1582129617595-c657a072c9b9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=3662&q=80',
// 'https://images.unsplash.com/photo-1559870904-406aeea0a89c?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80'
];
@override
Widget build(BuildContext context) {
return Row(
children: _buildStoriesList(),
);
}
List<StoryDesign> _buildStoriesList() {
List<StoryDesign> widgets = [];
int i = 0;
storiesPic.forEach((pic) {
++i;
widgets.add(StoryDesign(pic));
});
return widgets;
}
}
Дизайн виджета, если есть что-то, что он мог бы сделать многократным рендерингом.
class StoryDesign extends StatelessWidget {
StoryDesign(this.profilePic);
final String profilePic;
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.only(
left: kMediumSeparation / 2,
top: kCommonSeparation,
right: kMediumSeparation / 2,
bottom: kHugeSeparation),
child: InkWell(
onTap: () => print('profile bubble tapped'),
borderRadius: BorderRadius.all(Radius.circular(35.0)),
child: CircleAvatar(
backgroundImage: NetworkImage(profilePic),
radius: 35.0,
backgroundColor: kDefaultColorLoading,
),
),
);
}
}