1.1.0 • Published 9 months ago

@sominaththore/react-native-custom-status-bar v1.1.0

Weekly downloads
-
License
MIT
Repository
github
Last release
9 months ago

@sominaththore/react-native-custom-status-bar

A customizable status bar component for React Native applications, supporting both Android and iOS platforms.

Features

  • Set status bar color for both Android and iOS
  • Customize status bar style (light-content, dark-content)
  • Supports auto adjustment to the device's status bar height

Installation

Using npm:

npm install @sominaththore/react-native-custom-status-bar

Using yarn:

yarn add @sominaththore/react-native-custom-status-bar

Usage

Import and use the CustomStatusBar component in your React Native app:

import React from 'react';
import { View, Text } from 'react-native';
import CustomStatusBar from '@sominaththore/react-native-custom-status-bar';

const App = () => {
  return (
    <View style={{ flex: 1, backgroundColor: '#f8f8f8' }}>
      {/* Customizable Status Bar */}
      <CustomStatusBar backgroundColor="#6200ea" barStyle="light-content" />
      
      <Text style={{ marginTop: 50, textAlign: 'center', fontSize: 20 }}>
        Hello, World!
      </Text>
    </View>
  );
};

export default App;

Props

Prop NameTypeDefaultDescription
backgroundColorstring#ffffffSets the status bar background color
barStyle"light-content" \| "dark-content""dark-content"Sets the status bar text/icon color
hiddenbooleanfalseHides or shows the status bar

This package helps you customize the status bar easily in Android and iOS 🚀

1.1.0

9 months ago

1.0.9

9 months ago

1.0.8

10 months ago

1.0.7

10 months ago

1.0.6

10 months ago

1.0.5

10 months ago

1.0.4

10 months ago

1.0.3

10 months ago

1.0.2

10 months ago

1.0.1

10 months ago

1.0.0

10 months ago