Я хочу перейти на другую страницу, когда я нажимаю на изображение во Flutter

Question

Я новичок во Flutter, и я пытаюсь создать страницу, чтобы пользователь мог выбрать тип пользователя. И я пытаюсь использовать метод onTap, чтобы при нажатии на изображение я переходил на страницу выбранного типа пользователя, но когда я использовал метод onTap, изображение типа пользователя исчезало. Я не знаю, использую ли я правильный метод или использую его неправильно. Но вот как выглядит мой код, возможно, вы сможете мне помочь :) спасибо

      import 'package:flutter/material.dart';

class ChooseUser extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        body: new Container(
          padding: const EdgeInsets.fromLTRB(0, 250, 0, 0),
          child: new Column(
            children: [
              new Container(
                alignment: Alignment(0.4, 0.2),
                child: new Text(
                  "فضلًا أختر نوع المستخدم",
                  style: TextStyle(
                      fontSize: 30,
                      fontFamily: 'Cairo',
                      color: Color(0xFF403E3E),
                      shadows: [
                        Shadow(
                            color: Color(0xFF403E3E),
                            offset: Offset(1, 1),
                            blurRadius: 1)
                      ]),
                ),
              ),
              new Container(
                  height: 300.0,
                  width: 300.0,
                  padding: const EdgeInsets.fromLTRB(15, 120, 0, 0),
                  child: new Row(children: [
                    new Column(
                      children: [
                        new Container(
                          margin: const EdgeInsets.only(right: 40.0),
                          height: 100.0,
                          width: 100.0,
                          decoration: new BoxDecoration(
                            image: DecorationImage(
                                image: new AssetImage(
                                    'assets/images/elderly-icon.png'),
                                fit: BoxFit.fill),
                          ),
                        ),
                        new Container(
                            margin: const EdgeInsets.only(right: 40.0, top: 10),
                            child: new Text(
                              "كبير سن",
                              style: TextStyle(
                                  fontSize: 20,
                                  fontFamily: 'Cairo',
                                  color: Color(0xFF403E3E),
                                  shadows: [
                                    Shadow(
                                        color: Color(0xFF403E3E),
                                        offset: Offset(1, 1),
                                        blurRadius: 1)
                                  ]),
                            )),
                      ],
                    ),
                    new Column(children: [
                      GestureDetector(
                        onTap: () {
                          Navigator.of(context).pushNamed('medical-choose');
                          new Container(
                            margin: const EdgeInsets.only(left: 20.0),
                            height: 100.0,
                            width: 100.0,
                            decoration: new BoxDecoration(
                              image: DecorationImage(
                                  image: new AssetImage(
                                      'assets/images/staff-icon.png'),
                                  fit: BoxFit.fill),
                            ),
                          );
                          new Container(
                            margin: const EdgeInsets.only(left: 10.0, top: 10),
                            child: new Text(
                              "طاقم طبي",
                              style: TextStyle(
                                  fontSize: 20,
                                  fontFamily: 'Cairo',
                                  color: Color(0xFF403E3E),
                                  shadows: [
                                    Shadow(
                                        color: Color(0xFF403E3E),
                                        offset: Offset(1, 1),
                                        blurRadius: 1)
                                  ]),
                            ),
                          );
                        },
                      ),
                    ]),
                  ])),
            ],
          ),
        ),
      ),
    );
  }
}

Answer 1

По методу обычно в функцию ничего не рендерится.

The GestureDetectorдолжен иметь образ ребенка и onTap()просто имел бы Navigator.pushNamed

Что-то вроде этого:

          GestureDetector(
      child: Container(
          decoration: BoxDecoration(
              image: DecorationImage(
                  image: AssetImage(
                          'assets/images/staff-icon.png'
                      ),
                      fit: BoxFit.fill
                  )
              )
          )
      ),
      onTap: (){
        Navigator.of(context).pushNamed('medical-choose');
      },
    );

Answer 2

в первую очередь newключевое слово необязательно, во-вторых, нет необходимости использовать GestureDetectorвместо этого используйте InkWellвиджет, который является основным из всех интерактивных виджетов.

      InkWell(
      child: Container(
          decoration: BoxDecoration(
              image: DecorationImage(
                  image: AssetImage(
                          'assets/images/staff-icon.png'
                      ),
                      fit: BoxFit.fill
                  )
              )
          )
      ),
      onTap: () {
        Navigator.of(context).pushNamed('medical-choose');
      },
    );