仅编辑Flutter应用首页（索引为0）的代码位置咨询

你的首页（索引0的页面）对应代码中_widgetOptions列表的第一个元素，也就是当前的Text('Index 0: Home', style: optionStyle,)。你可以通过以下两种方式修改首页内容：

方式一：直接替换列表元素 #

直接将该Text组件替换为你需要的页面内容，比如包含多个组件的Column、可滚动的ListView等。示例如下：

static const List<Widget> _widgetOptions = <Widget>[
  // 这里替换成你的首页内容
  Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      Text(
        '这是我的首页',
        style: optionStyle,
      ),
      SizedBox(height: 20),
      Text('欢迎来到首页！', style: TextStyle(fontSize: 18)),
    ],
  ),
  Text(
    'Index 1: Business',
    style: optionStyle,
  ),
  Text(
    'Index 2: School',
    style: optionStyle,
  ),
];

方式二：抽离为独立Widget（推荐） #

如果首页内容复杂，建议将其抽离成单独的Widget，代码结构更清晰，便于后续维护。步骤如下：

1. 在_MyStatefulWidgetState类外部定义首页Widget：

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

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            '自定义首页',
            style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
          ),
          // 可添加更多组件，比如图片、按钮等
          ElevatedButton(
            onPressed: () {
              // 按钮点击逻辑
            },
            child: Text('首页操作按钮'),
          ),
        ],
      ),
    );
  }
}

2. 在_widgetOptions列表中引用这个Widget：

static const List<Widget> _widgetOptions = <Widget>[
  HomePage(), // 替换原来的Text组件
  Text(
    'Index 1: Business',
    style: optionStyle,
  ),
  Text(
    'Index 2: School',
    style: optionStyle,
  ),
];

修改完成后，底部导航选中首页（索引0）时，页面会自动显示你自定义的内容。

内容的提问来源于stack exchange，提问作者Lexy Morse