在Flutter中如何让每个_buildrow进入下一页？

um6iljoc 于 2022-12-30 发布在 Flutter

关注(0)|答案(2)|浏览(190)

当我不知道让每个buildrow进入每个页面时，我遇到了问题？这是buildDrawer的问题，你能帮我吗？
builderdrawer函数，用于配置文件屏幕。dart

_buildDrawer() {
    return ClipPath(
      clipper: OvalRightBorderClipper(),
      child: Drawer(
                  Container(
                    height: 90,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        gradient:
                            LinearGradient(colors: [Colors.pink, Colors.red])),
                    child: CircleAvatar(
                      radius: 40,
                      backgroundImage: NetworkImage(profile),
                    ),
                  ),
                  SizedBox(height: 5.0),
                  Text(
                    "Mohd Amin bin Yaakob",
                    style: TextStyle(color: Colors.white, fontSize: 18.0),
                  ),
                  Text(
                    "Pegawai",
                    style: TextStyle(color: active, fontSize: 16.0),
                  ),
                  SizedBox(height: 30.0),
                  _buildRow(Icons.home, "Home"),
                  _buildDivider(),
                  _buildRow(Icons.person_pin, "Your profile"),
                  _buildDivider(),
                  _buildRow(Icons.settings, "Settings"),
                  _buildDivider(),
                  _buildRow(Icons.email, "Contact us"),
                  _buildDivider(),
                  _buildRow(Icons.info_outline, "Help"),
                  _buildDivider(),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

如何使功能导航器成为每个buildRow

flutter

来源：https://stackoverflow.com/questions/74952410/how-to-make-each-buildrow-go-the-next-page-in-flutter

2条答案

按热度按时间

kknvjkwl1#

您需要使用listtile等可点击的小部件来创建行。
在您的_buildRow（）中尝试此操作

Widget _buildRow(IconData icon, String title) { 
   final TextStyle tStyle = TextStyle(color: active, fontSize: 16.0); 
   return ListTile(
         title: Text( title, style: tStyle, ),
         leading: Icon( icon, color: active, ),
         onTap: () {
          // Your navigation code here
         },
   ); 
}

您也可以移除容器并尝试在ListTile中使用contentPadding
抽屉文件https://docs.flutter.dev/cookbook/design/drawer对此进行了说明

赞(0）回复(0）举报 2022-12-30

zi8p0yeb2#

您可以在_buildRow方法中要求使用onTap函数。还可以将Container Package 在InkWell小部件中，并将此函数 Package 在onTap属性中。以下是修改后的代码：

Widget _buildRow(IconData icon, String title, VoidCallback onTap) {
  final TextStyle tStyle = TextStyle(color: active, fontSize: 16.0);
  return InkWell(
    child: Container(
      padding: const EdgeInsets.symmetric(vertical: 8.0),
      child: Row(
        children: [
          Icon(
            icon,
            color: active,
          ),
          SizedBox(width: 10.0),
          Text(
            title,
            style: tStyle,
          ),
        ],
      ),
    ),
    onTap: onTap,
  );
}

调用上述函数时，提供如下onTap回调：

_buildRow(Icons.home, "Home", () {
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) {
            return HomePage();
          },
        ),
      );
    });

赞(0）回复(0）举报 2022-12-30

我来回答

在Flutter中如何让每个_buildrow进入下一页？

2条答案

相关问题

热门标签

最新问答