android 文本在react-native中旋转,如下图所示

eagi6jfj  于 2023-05-27  发布在  Android
关注(0)|答案(1)|浏览(210)

The image that shows the turnicated off text
在这里,在上面的图像中,文本h被隐藏或被关闭,因为我想显示文本为英语.由于仅显示United,因此United states的情况也出现相同错误。下面是我的代码:

<TouchableOpacity style={styles.container} onPress={onPress}>
      <Image source={imageSource} style={styles.image} />
      <Text textBreakStrategy="simple" style={styles.title}>{title}</Text>
      <Text textBreakStrategy="simple" style={styles.subtitle}>{subtitle}</Text>
    </TouchableOpacity>

而css / stylesheet是:-

container: {
    display: "flex",
    flexDirection: "column",
    alignContent: "center",
    justifyContent: "center",
    alignItems: "center",
    textAlign: "center",
    width: 180,
    height: 136,
    Color: "#FFFFFF",
    border: "1px solid #00853E",
    borderColor: "#00853E",
    borderStyle: "solid",
    borderWidth: 1,
    boxShadow: "0px 4px 10px rgba(130, 130, 130, 0.25)",
    borderRadius: 3,
  },
  image: {
    width: 76.92,
    height: 54.94,
    resizeMode: "contain",
  },
  title: {
    marginTop: 7,
    fontStyle: "normal",
    fontWeight: 400,
    fontSize: 18,
    lineHeight: 23,
    color: "#00853E",
  },
  subtitle: {
    fontStyle: "normal",
    fontWeight: 400,
    fontSize: 14,
    lineHeight: 23,
    color: "#3F3F3F",
  },

我试过使用textBreakStrategy=“simple”,但它不起作用,也试过使用flex wrap,overflow:'scroll',alignSelf:'stretch',textAlign:“中心”,

oaxa6hgo

oaxa6hgo1#

你有没有试过给文本一个固定的宽度

title: {
marginTop: 7,
fontStyle: "normal",
fontWeight: 400,
fontSize: 18,
lineHeight: 23,
color: "#00853E",
width:180

},

相关问题