Блог

Я новичок в Flutter и Dart и пытаюсь создать класс контейнера с возможностью просмотра, основанный на классе GestureDetector. Мой код для моего контейнера показан ниже:

 class CustomWidget extends GestureDetector
{
   final aTitle;

   CustomWidget(this.aTitle)
   {
     onTap() {
       print("$aTitle was pressed!");
     }

     child: new Container(
       padding: const EdgeInsets.all(8),
       child: Text(aTitle),
       color: Colors.blueGrey[200],
     );
   }
}
  

Я пытаюсь отобразить этот виджет на главном экране моего приложения, используя следующий код в теле виджета моего приложения:

   body: CustomScrollView(
    primary: false,
    slivers: <Widget>[
      SliverPadding(
        padding: const EdgeInsets.all(20),
        sliver: SliverGrid.count(
          crossAxisSpacing: 10,
          mainAxisSpacing: 10,
          crossAxisCount: 2,
          children: <Widget>[
            CustomWidget('Test Display'),
          ],
        ),
      ),
    ],
  ),
  

Кажется, у меня две проблемы: (1) моя среда разработки сообщает мне, что мой метод onTap () «не используется», что указывает на то,
что он не будет захватывать события касания, и (2) это, похоже, не имеет большого значения, потому что экземпляр CustomWidget, который я
создаю в виджете приложения, являетсяне отображается на моем экране.

Я явно что-то упускаю. Может кто-нибудь помочь мне исправить мой код, чтобы мой пользовательский виджет отображался и обрабатывал события onTap?

Вообще говоря, CustomWidget — хорошая идея, но наследование — неправильная реализация. Flutter сильно предпочитает композицию наследованию.

Ваш пользовательский виджет, использующий композицию:

 class CustomWidget extends StatelessWidget {
  final String title;
  
  const CustomWidget(this.title);
  
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
       print("$title was pressed!");
      },
     child: new Container(
       padding: const EdgeInsets.all(8),
       child: Text(title),
       color: Colors.blueGrey[200],
     ));
  }
}