react-native - 迁移到 v5 后图像大小调整不起作用

Question

当前行为

在反应导航 v4 中，我使用了这段代码并且工作得很好。它确实调整了我的徽标图像 (300x80) 以完美适合并缩放到我的 80 像素标题中。

现在迁移到 v5 后，它不再扩展。就像“resizeMode”停止工作一样。

const navigationOptions = { headerTitle: <Image style={{height: 45}} resizeMode="contain" source={require('../assets/images/encabezado-1.png')}/>, headerStyle: { backgroundColor: 'white', shadowColor: 'none', }, headerTitleAlign: 'center', headerTitleStyle: { fontWeight: 'normal', fontFamily: 'Montserrat-SemiBold', }, }

预期行为

我希望我的图像能够正确包含和缩放。就像在 v4 中一样：

如何重现

将图像添加到 headerTitle 并尝试 resizeMode。

你的环境

• 安卓 9
  • @react-navigation/native 5.2.2
  • @反应导航/堆栈 5.2.3
  • 反应原生手势处理程序 1.6.1
  • react-native-safe-area-context 0.7.3
  • 反应原生屏幕 2.4.0
  • 反应原生 0.61.5
  • 节点 12.6.1

Answer 1

resizeMode 仍在工作。你可以在 Stack.Screen -> options -> title prop 中使用。

代码示例：

<TakeSendStack.Navigator initialRouteName={"TakeSend"}>
      <TakeSendStack.Screen name="TakeSend" options={{ title: <Image style={{height: 45}} source={require('../assets/logo/logo.png')}/> }} component={TakeSend} />
</TakeSendStack.Navigator>

添加调整大小模式

<TakeSendStack.Navigator initialRouteName={"TakeSend"}>
      <TakeSendStack.Screen name="TakeSend" options={{ title: <Image style={{height: 45}} resizeMode="contain" source={require('../assets/logo/logo.png')}/> }} component={TakeSend} />
</TakeSendStack.Navigator>