表示幅に合わせて列と行を整列する

Question

フレックスを使用して列と行を使用して表のようなレイアウトを作成しようとしています。

私は画面の右側にボタンを押し込む方法を理解できません...彼らはちょうど中間にそこにとどまるのです。

以下

<View style={{ flex: 1, flexDirection: 'column', justifyContent: 'space-between' }}> 
         <View style={{ flex: 1, flexDirection: 'row', justifyContent: 'space-between', maxHeight: 40 }}> 
          <View> 
           <Image source={character.Avatar} /> 
          </View> 
          <View style={{ width: 100, height: 50, marginTop: 5}}> 
           <Button /> 
          </View> 
         </View> 
       </View> 

は、それが画面上に次のようになります。

は、ここでは、行のいずれかの私のコード+スタイル（それらはすべて同じスタイルを使用）です。右のボタンを画面の右側に並べるにはどうしたらいいですか？

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

Answer 1

それは簡単です！ だけで、Buttonのあなたの親にalignItems: 'flex-end'を追加し、次のように：

<View style={{width: 100, height: 50, marginTop: 5, alignItems: 'flex-end'}}> <Button /> </View>

私はエミュレータでこれをテストし、それはあなた

の作品を期待