ネイティブ反応する：テキストの間にスペースを増やし、

Question

私が続いているスタイルを強調する方法：

const styles = StyleSheet.create({ 
    title: { 
     textDecorationLine: 'underline', 
     textDecorationStyle: 'solid', 
     textDecorationColor: '#000' 
    } 
}); 

をし、それはいくつかのテキストコンポーネントに私のコンテンツの下線を作成します。しかし、この下線はそれで飾られたテキストに近すぎるようです。

この距離をいくつかの方法で増やすことはできますか？

ありがとうございました！

Answer 1

1. borderBottomWidth: 1またはものは何でも厚さになりたいを含むスタイルを持っていますViewであなたのTextを包みます。

2. TextにはlineHeightに境界線とコンテンツの間隔を調整します。複数行のテキストがある場合は、paddingBottomを使用しても動作します。

本当に単純です。 Viewの境界線が伸びて、View自体に余白が入ることに注意してください。

Answer 2

現在のところ、React Nativeではこれができません。これは、Webアプリケーション（Css）でもサポートされていないためです。

リンクhere

しかし、周りのこれまでの仕事があります。

あなたは下線を調整したいテキストオーバービューラッパーを反応させる作成します。そしてborderBottomWidthを追加して、テキストpaddingBottomの下線の距離を表示して調整します。

const styles = StyleSheet.create({ 

    viewStyle : { 
     borderBottomWidth: 10, // whatever width you want of underline 
    } 
    title: { 
     paddingBottom: 4, // Adjust the distance from your text view. 
    } 
}); 

あなたparentViewにViewStyleプロパティを追加します。

希望に役立ちます！