リアクションネイティブ - AndroidとiOSの異なる画像サイズ

Question

iOSとandroid &のコードは同じです。しかし、私は2つのプラットフォーム間で見た目が異なることを発見しました、特に画像サイズ（以下に示す）。

私は尋ねたい：

1. を、私は2つのプラットフォームに一貫性になるにするためにコンフィギュレーションを設定するにはどうすればよいですか？
2. androidを設定するには& iOSスタイルシートの設定を同じコードで行いますか？

ありがとう!!

---

<MenuButton onPress={() => this.toggle()} style={styles.menuButton}> 
     <Image source={require('../images/menu.png')} style={styles.menuButtonImage}/> 
</MenuButton> 

StyleSheet setting

Android & iOS output

Answer 1

私はまた、画像が他のプラットフォームでは異なるレンダリングさに気づきました。私が正しく覚えていれば、静的なサイズを設定するのに十分であるはずです。

# Use a ternary statement in the function that gets your style object: 

getImage() { 
    const getStyle =() => ({height:(Platform.OS === 'ios' ? 36 : 48)}) 

    # then call it where you set the propery: 

    return <Image source={require('../images/menu.png')} style={getStyle()} /> 
} 

それはそれぞれの親の再レンダリングに呼び出されます。この方法は：あなたは、各プラットフォーム用のスタイルを微調整する必要がある場合は、私は次のことを行うだろう。

実際、このようにすべてのスタイルが定義されています。これは、プロパティに依存する可能性がある動的スタイルの魅力のように機能します。また、コンポーネントをできるだけ自己完結型に戻すコンポーネントでは、コンポーネントと関数を保持するのが良いパターンです。