Icon.ToolbarAndroid内のテキストボックスの幅を広げる

Question

Icon.ToolbarAndroidコンポーネント内に検索ボックスを作成しようとしています。しかし、テキストボックスの幅を変更して、メッセージアイコンまですべての領域を占めることはできません。誰かがここで私を助けることができる？

後私が使用したコードです。 （私もminWidthを入れてみました）

  <Icon.ToolbarAndroid 
      actions={[ 
       { title: 'Chat', iconName: 'chat', iconSize: 24, show: 'always' }, 
       { title: 'Alert', iconName: 'notifications', iconSize: 24, show: 'always' } 
      ]} 
      navIconName="menu" 
      title="" 
      style={styles.toolbar} 
      onActionSelected={this.onActionSelected} 
      onIconClicked={this.onIconClicked.bind(this)} 
     > 
      <TextInput style={styles.searchBox} minWidth={40}>Testing</TextInput> 
     </Icon.ToolbarAndroid> 

私が使ったスタイリングは次のとおりです。

const styles = StyleSheet.create({ 
    toolbar: { 
     backgroundColor: '#2D4571', 
     height: 48, 
    }, 
    searchBox: { 
     backgroundColor: '#4D648D', 
     color: '#eeeeee', 
     width: 40 
    } 
}); 

Answer 1

私は、テキスト入力をビューにラップすることで結果を達成できました。しかし、backgroundColorが与えられている場合にのみ機能します。私は色を削除する場合、それは上記の画像にサイズを戻します。

  <View style={{ flex: 1, backgroundColor: '#ffaabb', flexDirection: 'row' }}> 
       <TextInput style={styles.searchBox} >Testing </TextInput> 
      </View>