Как отобразить изображение внутри ListView.separated во флаттере - PullRequest
0 голосов
/ 12 апреля 2020

сейчас у меня есть экран, который содержит статическое c изображение, но я хочу отобразить свое изображение внутри ListView.separated, чтобы оно отображало другое изображение на моем экране. В основном, ресурс, который я всегда читал, использует свойство children для отображения изображения, но внутри ListView.separated нет свойства children, есть ли способ отобразить мое изображение? а это мой код

Container(
                child: new ListView.separated(
                    separatorBuilder: (BuildContext context, int index) {
                      return SizedBox(
                        width: 10,
                      );
                    },
                    scrollDirection: Axis.horizontal,
                    shrinkWrap: true,
                    physics: const ClampingScrollPhysics(),
                    itemCount: 3,
                    itemBuilder: (BuildContext context, int index) {
                      return myImage(index);
                    }))

Widget myImage(int index) {
    return Container(
        height: MediaQuery.of(context).size.width / 2,
        width: MediaQuery.of(context).size.width / 1.4,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(12)),
          image: DecorationImage(image: images[index].image,fit: BoxFit.cover),
        ),
      );
  }

  List<Image> images = [
  Image.asset("assets/images/logo1.png"),
  Image.asset("assets/images/logo2.png"),
  Image.asset("assets/images/logo3.png"),
  ];

1 Ответ

2 голосов
/ 12 апреля 2020

ListView.seperated работает аналогично ListView.builder, потому что вы получаете флаттер индекса, который выполняет сопоставление для вас, просто предоставив виджет, которому вы хотите, чтобы он отображался, как это.

List<Image> images = [
    Image.asset("assets/images/logo.png"),
    Image.asset("assets/images/logo.png"),
    Image.asset("assets/images/logo.png"),
  ];
  Widget myImage(int index) {
    return Container(
      height: MediaQuery.of(context).size.width / 2,
      width: MediaQuery.of(context).size.width / 1.4,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(12)),
        image: DecorationImage(image: images[index].image, fit: BoxFit.cover),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: new ListView.separated(
          separatorBuilder: (BuildContext context, int index) {
            return SizedBox(
              width: 10,
            );
          },
          scrollDirection: Axis.horizontal,
          shrinkWrap: true,
          physics: const ClampingScrollPhysics(),
          itemCount: 3,
          itemBuilder: (BuildContext context, int index) {
            return myImage(index);
          },
        ),
      ),
    );
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...