The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.

Question

前提

FlutterのUI構築の仕方を勉強するにあたり、Youtubeの動画を真似して勉強しています。

実現したいこと

• The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.を解消し、画面遷移を実現させる。

発生している問題・エラーメッセージ

The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.

該当のソースコード

import 'package:flutter/material.dart';
import 'package:furniture_app/models/product.dart';

import '../../../constants.dart';

class ProductCard extends StatelessWidget {
  const ProductCard({
    Key? key,
    required this.itemIndex,
    required this.product,
    required this.press,
  }) : super(key: key);

  final int itemIndex;
  final Product product;
  final Function press;

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Container(
      margin: EdgeInsets.symmetric(
        horizontal: kDefaultPadding,
        vertical: kDefaultPadding / 2,
      ),
      // color: Colors.blueAccent,
      height: 160,
      child: InkWell(
        onTap: press,
        child: Stack(
          alignment: Alignment.bottomCenter,
          children: <Widget>[
            Container(
              height: 136,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(22),
                color: itemIndex.isEven ? kBlueColor : kSecondaryColor,
                boxShadow: [kDefaultShadow],
              ),
              child: Container(
                margin: EdgeInsets.only(right: 10),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(22),
                ),
              ),
            ),
            Positioned(
              top: 0,
              right: 0,
              child: Hero(
                tag: '${product.id}',
                child: Container(
                  padding: EdgeInsets.symmetric(horizontal: kDefaultPadding),
                  height: 160,
                  width: 200,
                  child: Image.asset(
                    product.image,
                    fit: BoxFit.cover,
                  ),
                ),
              ),
            ),
            Positioned(
              bottom: 0,
              left: 0,
              child: SizedBox(
                height: 136,
                width: size.width - 200,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Spacer(),
                    Padding(
                      padding: const EdgeInsets.symmetric(
                          horizontal: kDefaultPadding),
                      child: Text(
                        product.title,
                        style: Theme.of(context).textTheme.button,
                      ),
                    ),
                    Spacer(),
                    Container(
                      padding: EdgeInsets.symmetric(
                        horizontal: kDefaultPadding * 1.5,
                        vertical: kDefaultPadding / 4,
                      ),
                      decoration: BoxDecoration(
                        color: kSecondaryColor,
                        borderRadius: BorderRadius.only(
                          bottomLeft: Radius.circular(22),
                          topRight: Radius.circular(22),
                        ),
                      ),
                      child: Text(
                        "\$${product.price}",
                        style: Theme.of(context).textTheme.button,
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

import 'package:flutter/material.dart';

const kBackgroundColor = Color(0xFFF1EFF1);
const kPrimaryColor = Color(0xFF035AA6);
const kSecondaryColor = Color(0xFFFFA41B);
const kTextColor = Color(0xFF000839);
const kTextLightColor = Color(0xFF747474);
const kBlueColor = Color(0xFF40BAD5);

const kDefaultPadding = 20.0;

const kDefaultShadow = BoxShadow(
  offset: Offset(0, 15),
  blurRadius: 27,
  color: Colors.black12,
);

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:furniture_app/constants.dart';
import 'package:furniture_app/models/product.dart';
import 'package:furniture_app/screens/details/details_screen.dart';
import 'package:furniture_app/screens/product/components/product_card.dart';

import '../../../components/search_box.dart';
import 'category_list.dart';

class Body extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      bottom: false,
      child: Column(
        children: <Widget>[
          SearchBox(
            onChanged: (value) {},
          ),
          Categorylist(),
          SizedBox(
            height: kDefaultPadding / 2,
          ),
          Expanded(
            child: Stack(
              children: <Widget>[
                Container(
                  margin: EdgeInsets.only(top: 70),
                  decoration: BoxDecoration(
                    color: kBackgroundColor,
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(40),
                      topRight: Radius.circular(40),
                    ),
                  ),
                ),
                ListView.builder(
                  itemCount: products.length,
                  itemBuilder: (context, index) => ProductCard(
                    itemIndex: index,
                    product: products[index],
                    press: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => DetailsScreen(
                            product: products[index],
                          ),
                        ),
                      );
                    },
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:furniture_app/constants.dart';
import 'package:furniture_app/models/product.dart';

import 'components/body.dart';

class DetailsScreen extends StatelessWidget {
  final Product product;

  const DetailsScreen({super.key, required this.product});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: kPrimaryColor,
      appBar: buildAppBar(context),
      body: Body(
        product: product,
      ),
    );
  }

  AppBar buildAppBar(BuildContext context) {
    return AppBar(
      backgroundColor: kBackgroundColor,
      elevation: 0,
      leading: IconButton(
        padding: EdgeInsets.only(left: kDefaultPadding),
        icon: SvgPicture.asset(
            "/Users/ookuboitsuki/Flutter/furniture_app/furniture_app/assets/icons/back.svg"),
        onPressed: () {
          Navigator.pop(context);
        },
      ),
      centerTitle: false,
      title: Text(
        "Back".toUpperCase(),
        style: Theme.of(context).textTheme.bodyText2,
      ),
      actions: <Widget>[
        IconButton(
          onPressed: () {},
          icon: SvgPicture.asset(
              "/Users/ookuboitsuki/Flutter/furniture_app/furniture_app/assets/icons/cart_with_item.svg"),
        ),
      ],
    );
  }
}

試したこと

The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.を翻訳したところ、引数型「Function」は、パラメータ型「void Function()?」に割り当てることができません。という意味だと判明。
The argument type 'Function' can't be assigned to the parameter type 'void Function()?'.でググると、
https://github.com/flutter/flutter/issues/111357にヒット。
予想としては、pressの処理がうまく書けていない（例えば、引数が書けているなど）だと思っていますが、Youtubeの動画とお手本のソースコードを15分見ても、解決に至らなかったので質問させていただくことにしました。

補足情報（FW/ツールのバージョンなど）

[✓] Flutter (Channel stable, 3.3.10, on macOS 13.0.1
22A400 darwin-x64, locale ja-JP)
[✓] Android toolchain - develop for Android devices
(Android SDK version 32.1.0-rc1)
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.2)
[✓] VS Code (version 1.74.3)
[✓] Connected device (3 available)
[✓] HTTP Host Availability

constants.dartはコンスタントに使うpaddingだったりColorをまとめているファイルです。
products_screen.dartが商品一覧画面、body.dartが商品詳細画面のファイルです。
product_card.dartは一商品の情報ファイル、
product.dartはモデルファイルとなっています。
search_box.dartは検索バー、details_screenは詳細画面のファイルです。
文字数制限に引っかかってしまているので、コメントに後の情報を書きたいと思います。
不足している情報などありましたら、質問よろしくお願いします。

学習に使用している動画
https://youtu.be/bkR7naR1efA
18分35秒あたりからが、onTap: pressの処理についてコードを書いている場所です。

お手本のGitHubのURL
https://github.com/abuanwar072/furniture_app_flutter

Comments

[Jedda]

```product.dart
class Product {
final int id, price;
final String title, description, image;

Product(
{required this.id,
required this.price,
required this.title,
required this.description,
required this.image});
}

// list of products
// for our demo
List<Product> products = [
Product(
id: 1,
price: 56,
title: "Classic Leather Arm Chair",
image: "assets/images/Item_1.png",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim",
),
Product(
id: 4,
price: 68,
title: "Poppy Plastic Tub Chair",
image: "assets/images/Item_2.png",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim",
),
Product(
id: 9,
price: 39,
title: "Bar Stool Chair",
image: "assets/images/Item_3.png",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim",
),
];

```

```category_list.dart
import 'package:flutter/material.dart';

import '../../../constants.dart';

class Categorylist extends StatefulWidget {
@override
_CategorylistState createState() => _CategorylistState();
}

class _CategorylistState extends State<Categorylist> {
int selectedIndex = 0;
List categories = ["All", "Sofa", "Park bench", "Armchair"];
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(vertical: kDefaultPadding / 2),
height: 30,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: categories.length,
itemBuilder: (context, index) => GestureDetector(
onTap: () {
setState(() {
selectedIndex = index;
});
},
child: Container(
alignment: Alignment.center,
margin: EdgeInsets.only(
left: kDefaultPadding,
right: index == categories.length - 1 ? kDefaultPadding : 0),
padding: EdgeInsets.symmetric(horizontal: kDefaultPadding),
decoration: BoxDecoration(
color: index == selectedIndex
? Colors.white.withOpacity(0.4)
: Colors.transparent,
borderRadius: BorderRadius.circular(6),
),
child: Text(
categories[index],
style: TextStyle(color: Colors.white),
),
),
),
),
);
}
}
```
```search_box.dart
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';

import '../constants.dart';

class SearchBox extends StatelessWidget {
const SearchBox({
Key? key,
required this.onChanged,
}) : super(key: key);

final ValueChanged onChanged;

@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.all(kDefaultPadding),
padding: EdgeInsets.symmetric(
horizontal: kDefaultPadding,
vertical: kDefaultPadding / 4,
),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.4),
borderRadius: BorderRadius.circular(20),
),
child: TextField(
onChanged: onChanged,
style: TextStyle(color: Colors.white),
decoration: InputDecoration(
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
icon: SvgPicture.asset(
"/Users/ookuboitsuki/Flutter/furniture_app/furniture_app/assets/icons/search.svg"),
hintText: "Search",
hintStyle: TextStyle(color: Colors.white),
),
),
);
}
}
```