onPressed of an Image Я хочу поместить это изображение в контейнер другой страницы во флаттере. Как я могу этого добиться?

Question

У меня есть домашняя страница для веб-сайта электронной коммерции, и я показываю каждый продукт в формате изображения по щелчку каждого продукта (изображения). Я хочу, чтобы это изображение было заполнено на следующем экране, который представляет собой информационный экран продукта, который также содержит продукт ( изображение) и некоторые другие связанные с этим вещи. Я хочу создать информационную страницу только один раз и просто изменить изображение продукта и другие материалы в соответствии с выбранным изображением (продуктом). Как я могу этого добиться? Я новичок в трепетании и не знаю этой логики. Я наткнулся на valuelistenablebuilder, но не понимаю, как я могу этого добиться, пожалуйста, помогите. Спасибо,

Answer 1

По умолчанию Flutter предоставляет эту поддержку с помощью Heroвиджет. Найдите фрагменты кода ниже.

      import 'package:flutter/material.dart';

void main() => runApp(HeroApp());

class HeroApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Transition Demo',
      home: MainScreen(),
    );
  }
}

class MainScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Main Screen'),
      ),
      body: GestureDetector(
        child: Hero(
          tag: 'imageHero',
          child: Image.network(
            'https://picsum.photos/250?image=9',
          ),
        ),
        onTap: () {
          Navigator.push(context, MaterialPageRoute(builder: (_) {
            return DetailScreen();
          }));
        },
      ),
    );
  }
}

class DetailScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GestureDetector(
        child: Center(
          child: Hero(
            tag: 'imageHero',
            child: Image.network(
              'https://picsum.photos/250?image=9',
            ),
          ),
        ),
        onTap: () {
          Navigator.pop(context);
        },
      ),
    );
  }
}

Убедитесь, что Hero.tag свойство должно быть одинаковым для обеих страниц.

Перейдите по ссылке для получения более подробной информации