如何使用卡片小部件中的命名路由进行导航？给我错误：未定义的名称“上下文”

Question

在这种特殊情况下，如何使导航正常工作，打开新的命名路线？ 现在，如下所示，它给了我错误：未定义的名称“上下文”。 考虑到 BuildContext 上下文小部件位于下方（参见代码底部），如何使用卡片小部件中的命名路由进行导航？ 以下是主页的完整代码：

    import 'package:flutter/material.dart';
    import 'package:projectname/theme/light_color.dart';

    class HomePage extends StatelessWidget {
      HomePage({Key key}) : super(key: key);

      double width;

      Widget _categoryRow(
        String title,
        Color primary,
        Color textColor,
      ) {
        return Container(
          margin: EdgeInsets.symmetric(horizontal: 20),
          height: 30,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Text(
                title,
                style: TextStyle(
                    color: LightColor.titleTextColor, fontWeight: FontWeight.bold),
              ),
            ],
          ),
        );
      }

    /////////////////////////////////////////////////
      Widget _featuredRowA() {
        return SingleChildScrollView(
          scrollDirection: Axis.horizontal,
          child: Container(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.end,
              children: <Widget>[
                InkResponse(
                  onTap: () {
                    Navigator.pushNamed(context, '/HomePage');
                  },
                  child: _card(
                      primary: LightColor.seeBlue,
                      chipColor: LightColor.seeBlue,


                backWidget: _decorationContainerD(
                      LightColor.darkseeBlue, -100, -65,
                      secondary: LightColor.lightseeBlue,
                      secondaryAccent: LightColor.seeBlue),
                  chipText1: "For the second page",
                  chipText2: "TAP HERE",
                  isPrimaryCard: true,
                  imgPath: ""),
            ),
          ],
        ),
      ),
    );
  }

////////////////////////////////////////////
  Widget _card(
      {Color primary = Colors.redAccent,
      String imgPath,
      String chipText1 = '',
      String chipText2 = '',
      Widget backWidget,
      Color chipColor = LightColor.orange,
      bool isPrimaryCard = false}) {
    return Container(
        height: isPrimaryCard ? 190 : 190,
        width: isPrimaryCard ? width * .40 : width * .40,
        margin: EdgeInsets.symmetric(horizontal: 10, vertical: 20),
        decoration: BoxDecoration(
            color: primary.withAlpha(200),
            borderRadius: BorderRadius.all(Radius.circular(20)),
            boxShadow: <BoxShadow>[
              BoxShadow(
                  offset: Offset(0, 5),
                  blurRadius: 10,
                  color: LightColor.lightpurple.withAlpha(20))
            ]),
        child: ClipRRect(
          borderRadius: BorderRadius.all(Radius.circular(20)),
          child: Container(
            child: Stack(
              children: <Widget>[
                backWidget,
                Positioned(
                    top: 20,
                    left: 10,
                    child: CircleAvatar(
                      backgroundColor: Colors.transparent,
                      backgroundImage: NetworkImage(imgPath),
                    )),
                Positioned(
                  bottom: 10,
                  left: 10,
                  child: _cardInfo(chipText1, chipText2,
                      LightColor.titleTextColor, chipColor,
                      isPrimaryCard: isPrimaryCard),
                )
              ],
            ),
          ),
        ));
  }

  Widget _cardInfo(String title, String courses, Color textColor, Color primary,
      {bool isPrimaryCard = false}) {
    return Align(
      alignment: Alignment.bottomLeft,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
            padding: EdgeInsets.only(right: 10),
            width: width * .32,
            alignment: Alignment.topCenter,
            child: Text(
              title,
              style: TextStyle(
                  fontSize: 20,
                  fontWeight: FontWeight.bold,
                  color: isPrimaryCard ? Colors.white : textColor),
            ),
          ),
          SizedBox(height: 14),
          _chip(courses, primary, height: 5, isPrimaryCard: isPrimaryCard)
        ],
      ),
    );
  }

  Widget _chip(String text, Color textColor,
      {double height = 0, bool isPrimaryCard = false}) {
    return Container(
      alignment: Alignment.center,
      padding: EdgeInsets.symmetric(horizontal: 10, vertical: height),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(15)),
        color: textColor.withAlpha(isPrimaryCard ? 200 : 50),
      ),
      child: Text(
        text,
        style: TextStyle(
            color: isPrimaryCard ? Colors.white : textColor, fontSize: 26),
      ),
    );
  }

  Widget _decorationContainerA(Color primary, double top, double left) {
    return Stack(
      children: <Widget>[
        Positioned(
          top: top,
          left: left,
          child: CircleAvatar(
            radius: 100,
            backgroundColor: primary.withAlpha(255),
          ),
        ),
        _smallContainer(primary, 20, 40),
      ],
    );
  }

  Widget _decorationContainerD(Color primary, double top, double left,
      {Color secondary, Color secondaryAccent}) {
    return Stack(
      children: <Widget>[
        _smallContainer(LightColor.yellow, 18, 35, radius: 12),
      ],
    );
  }

  Positioned _smallContainer(Color primary, double top, double left,
      {double radius = 0}) {
    return Positioned(
        top: left,
        left: left,
        child: CircleAvatar(
          radius: radius,
          backgroundColor: primary.withAlpha(255),
        ));
  }

  @override
  Widget build(BuildContext context) {
    width = MediaQuery.of(context).size.width;
    return Scaffold(
      body: SingleChildScrollView(
        child: Container(
          child: Column(
            children: <Widget>[
              SizedBox(height: 20),
              _categoryRow("", LightColor.orange, LightColor.orange),
              _featuredRowA(),
            ],
          ),
        ),
      ),
    );
  }
}

Answer 1

您应该将上下文传递给您的小部件；

Widget _featuredRowA(BuildContext context) {
      return SingleChildScrollView(
        scrollDirection: Axis.horizontal,
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.end,
            children: <Widget>[
              InkResponse(
                onTap: () {
                  Navigator.pushNamed(context, '/HomePage');
                },
                child: _card(
                    primary: LightColor.seeBlue,
                    chipColor: LightColor.seeBlue,


              backWidget: _decorationContainerD(
                    LightColor.darkseeBlue, -100, -65,
                    secondary: LightColor.lightseeBlue,
                    secondaryAccent: LightColor.seeBlue),
                chipText1: "For the second page",
                chipText2: "TAP HERE",
                isPrimaryCard: true,
                imgPath: ""),
          ),
        ],
      ),
    ),
  );
}

这里；

@override
  Widget build(BuildContext context) {
    width = MediaQuery.of(context).size.width;
    return Scaffold(
      body: SingleChildScrollView(
        child: Container(
          child: Column(
            children: <Widget>[
              SizedBox(height: 20),
              _categoryRow("", LightColor.orange, LightColor.orange),
              _featuredRowA(context),
            ],
          ),
        ),
      ),
    );
  }