React native layout fixed width and stretch remaining space

How can I make something like this in react-native ?

In the right I want a component that has a fixed width, and in the left taking all the remaining space another component.

enter image description here

How do you use gap in React Native?

Using flexbox's gap in React Native Below, let's set the container's gap property to 1rem to add spacing of 1rem between items horizontally and vertically: import React, { useState } from "react"; import { StyleSheet, View } from "react-native"; export default function App() { return ( <> <View style={styles.

Try this:

  <View style={{flex: 1, flexDirection: 'row'}}>
    <View style={{
      backgroundColor: 'blue',
      flexGrow: 1,
    }}>
      <Text>Fluid</Text>
    </View>
    <View style={{
      backgroundColor: 'red',
      width: 100,
    }}>
      <Text>Fixed</Text>        
    </View>
  </View>