Реагировать на собственный плоский список 2 элемента в строке, ширина не равна

Я создаю собственное приложение для реагирования и пытаюсь сделать 2 элемента в строке одинаковой ширины в flatList. то, что я получаю, это 2 элемента в строке, но не одинаковой ширины.

const itemProduct = props => {
return (
    <Button style = {style.container} onPress = {props.onPress}>
        <View style = {style.imageContainer}>
            <LoadingImage resizeMode='contain' resizeMethod='resize' source = {props.Image ? { uri: 'https://www.saramashkim.co.il/'+props.Image } : require('../../assets/images/default_no_image.png')} style = {style.image} />
        </View>
        <View style = {style.textContainer}>
            <Text style = {style.productName}>vodka</Text>
            <View style = {style.specialOffer}>
                {props.inPromotion ? <Text>special offer</Text> : null}
            </View>

            <View style = {style.bottomLine}>
                <Text style = {style.costText}>lorem ipos</Text><View style = {style.bottomLine}>{props.discount ? <Text style = {style.Price}>lorem ipos{parseFloat(Math.round(props.price_per_case * 100) / 100).toFixed(2)}</Text> : null}<Text style = {style.discountPrice}>dollar{parseFloat(Math.round(props.price_per_case * ((100 - props.discount) / 100) * 100) / 100).toFixed(2)}</Text></View>
            </View>
        </View>
    </Button>
    )
}

стиль

const style = StyleSheet.create({
container : {
    backgroundColor: colors.dark_red,
    paddingTop:calcSize(10),
    margin:calcSize(10),
    minWidth:(width-15)/2,

},
imageContainer:{
    flex:1,  
    alignItems:'center'
},
textContainer:{
    flex:2,
    //backgroundColor:'red',
    paddingHorizontal:calcSize(30)
},
image:{ 
    width: calcSize(175), 
    height: calcSize(175) 
},
brandName:{
    color:'#7c7c7c',
    fontFamily:'Poppins-Light',
    fontSize:calcSize(25),
    marginBottom:calcSize(15)
},
productName:{
    color: colors.black,
    fontFamily:'Poppins-Regular',
    fontSize:calcSize(20),
    width:calcSize(300)

},

flatList

<View style = {style.list}>
   <FlatList
       refreshing = {this.state.refreshing}
       numColumns = {2}
       onRefresh = {this.onListRefresh}
       data = {products}
       keyExtractor = {(o, i) => i.toString()}
       renderItem = {this.renderProductListItem}
       ListFooterComponent = {() => {
          if ((this.state.products.length < this.state.totalFound || this.state.loading) && !this.state.refreshing)
             return <Spinner style = {style.loading} />
             return <View style = {style.loading} />
          }}

          ItemSeparatorComponent = {() => <View style = {style.separator} />} />
   </View>
</View>

стиль списка

list:{
    flex:1,
    flexDirection:'row',
    paddingHorizontal: calcSize(30),
}

Фото

Я хочу сделать 2 элемента в строке одинаковой ширины, также на фотографии, поскольку вы можете видеть, что текст слева не равен правому, поэтому это проблема.