Q:

Rect native exactly same header on ios and android?

I'm working on a reactnative project and i have to make 2 apps with exactly same topbar on ios and android 
Is it possible ? Even if it's not a native header
Or maybe i have to custom android topbar so that seems same than ios ?
Thanks in advance! 
Maxime

A:

Try making a custom header like this :
import React, {Fragment, Component} from 'react';
import {View, Text, TouchableOpacity, Image, SafeAreaView} from 'react-native';
import {
  widthPercentageToDP as wp,
  heightPercentageToDP as hp,
} from 'react-native-responsive-screen';
import {headerStyles} from '../style/headerStyles';

export default class Header extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    return (
      <View
        style={{
          flexDirection: 'row',
          paddingBottom: hp('3.125%'),
          justifyContent: 'space-between',
          alignItems: 'center',
        }}>
        <View style={{opacity: 0}}>
          <Image source={require('../assets/images/crossIcon.png')} />
        </View>
        <View style={{flexShrink: 1}}>
          <Text style={headerStyles.headerText}>{this.props.title}</Text>
        </View>
        <View style={{left: -20, paddingLeft: 10, marginLeft: 10}}>
          <TouchableOpacity
            style={headerStyles.imageView}
            onPress={() => this.props.navigation.goBack()}>
            <Image
              style={{height: 15, width: 15}}
              source={require('../assets/images/crossIcon.png')}
            />
          </TouchableOpacity>
        </View>
      </View>
    );
  }
}

and disable your navigation default header. 
Now import this header at top in your code, wherever you want. It will be exactly the same. 
Hope it helps. feel free for doubts

