迁移到v5后，无法调整图像大小

Question

当前行为

在React Navigation v4中，我使用了这段代码，并且运行良好。它确实调整了我的徽标图像（300x80），使其完美适合并缩放到我的80px标头中。

现在，迁移到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。

您的环境

• Android 9
  • @ react-navigation / native 5.2.2
  • @ react-navigation / stack 5.2.3
  • native-gesture-handler 1.6.1
  • 本机安全区域上下文0.7.3
  • 本机屏幕2.4.0
  • 本机0.61.5
  • 节点12.6.1

Answer 1

resizeMode仍在工作。您可以在Stack.Screen->选项->标题属性中使用。

代码示例：

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

添加resizeMode

<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>