リアクトネイティブの水平ルールを描く

Question

私はreact-native-hrパッケージを試しました。私にとってもAndroidではなく、iOSでも動作しません。それはあなたが単に下の境界と、空のビューを使用することができ、エンド

<Text numberOfLines={1}}>    
    ______________________________________________________________ 
</Text> 

Answer 1

にある3個のドットをレンダリングするため

次のコードも適していません。

<View 
    style={{ 
    borderBottomColor: 'black', 
    borderBottomWidth: 1, 
    }} 
/> 

Answer 2

なぜこのようなことをしないのですか？

<View 
    style={{ 
    borderBottomWidth: 1, 
    borderBottomColor: 'black', 
    width: 400, 
    }} 
/> 

Answer 3

import { View, Dimensions } from 'react-native' 

var { width, height } = Dimensions.get('window') 

// Create Component 

<View style={{ 
    borderBottomColor: 'black', 
    borderBottomWidth: 0.5, 
    width: width - 20,}}> 
</View> 

Answer 4

たぶん、あなたが反応するネイティブ-時間をこのような何か使用して試してみてください：ドキュメント

<Hr lineColor='#b3b3b3'/> 

を：https://www.npmjs.com/package/react-native-hr

Answer 5

一つはAの幅を変更するためにマージンを使用することができますそれを中央に置きます。

<View style = {styles.lineStyle} /> 

lineStyle:{ 
     borderWidth: 0.5, 
     borderColor:'black', 
     margin:10, 
    } 

余裕を動的に与えたい場合は、寸法幅を使用できます。