React native <；图像/>；在Appbar.content中，上面有空白

我正在使用以下代码创建带有

react原生纸张

和

react导航

的标题：

return (
        <Appbar.Header theme={{ colors: { primary: "white" } }}>

            {previous ? (
                <Appbar.BackAction onPress={navigation.pop} color={theme.colors.primary} />
            ) : (
                <TouchableOpacity onPress={()=>{navigation.openDrawer();}}>
                    <Avatar.Image
                        size={40}
                        source={{uri: "https://i.imgur.com/2tTU7q1.jpg"}}
                    />
                </TouchableOpacity>
            )}
            <Appbar.Content
                title={
                   <Image source={require("../../assets/images/icon.png")}
                            style={{
                                width: 40,
                                height: 40,
                            }}
                    />
                   }
                titleStyle={{backgroundColor: "red",}}
                style={{alignItems: "center"}}
            />
        </Appbar.Header>
    );

返回(

该空间不存在于.jpg中，实际上与任何图片一起显示。如果我使用MaterialCommunityIcons（来自
@expo/vector icons
）而不是图像，则不会显示该空间

你知道是什么原因导致了这个问题，以及如何消除它吗？
我认为这是不可能的，因为它无法在图像中呈现内容。如果你解决了这个问题，请发布答案。问题解决了吗？我也面临着同样的问题thing@phaniindra不幸的是，我刚刚放弃使用该组件OK@RyanPergent你能推荐其他组件吗为他工作的人you@phaniindra我恢复了react导航的默认标题组件。我不再试图显示图像而不是标题。但是，我相信这是可行的。