如何在Expo 50的Expo Router中设置Tab页面头部背景色？

在Expo Router的Tabs.Screen配置中，你可以通过options里的headerStyle属性设置头部背景色，还能配合headerTintColor调整标题、返回按钮的颜色，避免和背景色冲突。

修改你的代码如下：

<Tabs.Screen
    name="two"
    options={{
      title: 'Tab Two',
      tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
      // 设置头部背景色
      headerStyle: {
        backgroundColor: '#2196F3', // 替换为你需要的颜色值，比如十六进制、RGB值
      },
      // 可选：调整标题和按钮的颜色，保证可读性
      headerTintColor: '#ffffff',
    }}
/>

如果要给不同Tab页面设置不同背景色，只需在对应Tabs.Screen的options中单独配置headerStyle即可。

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