字体超出省略号隐藏

ellipsizeMode

  1. 这个属性通常和下面的 numberOfLines 属性配合使用,表示当 Text 组件无法全部显示需要显示的字符串时如何用省略号进行修饰
  2. 该属性有如下 4 种取值:
    • head - 从文本内容头部截取显示省略号。例如: “…efg”
    • middle - 在文本内容中间截取显示省略号。例如: “ab…yz”
    • tail - 从文本内容尾部截取显示省略号。例如: “abcd…”
    • clip - 不显示省略号,直接从尾部截断。
  3. numberOfLines number类型表示从第几行开始出现
    // 从第二行出现省略号
    <Text numberOfLines={2} ellipsizeMode="tail" style={[styles.desc, { color: theme.otherColor.text }]}>{item.name}</Text>
    
    
  4. 如果想要View 下的子元素中的最后一个元素显示省略号,让最后一个元素设置flex:1 并且给Text 设置上方的属性
Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐