Dingdong_client/screens/Order/Header.js

/* eslint-disable react/style-prop-object */
import * as React from 'react';
import { View } from 'react-native';
import { StatusBar } from 'expo-status-bar';
import { Appbar } from 'react-native-paper';
import { goBack } from '../../navigation/RootNavigation';

export default function Header({ title, noBack, bg }) {
  return (
    <>
      <StatusBar backgroundColor={bg || '#FFC21C'} style="light" translucent />

      <Appbar.Header
        dark
        style={{
          zIndex: 3,
          elevation: 0,
          shadowOffset: {
            width: 0,
            height: 0,
          },
          shadowOpacity: 0,
        }}
        theme={{ colors: { primary: bg || '#FFC21C' } }}
      >
        {!noBack && <Appbar.BackAction onPress={goBack} />}
        <Appbar.Content
          title={title || '我的订单'}
          titleStyle={{ textAlign: 'center', fontSize: 16 }}
        />
        {!noBack && (
          <Appbar.Action
            icon={() => <View style={{ width: 24, height: 24 }} />}
          />
        )}
      </Appbar.Header>
    </>
  );
}