Wondering what‚Äôs next for npm?Check out our public roadmap! ¬Ľ

    react-native-firebaseui

    0.3.0¬†‚Äʬ†Public¬†‚Äʬ†Published

    react-native-firebaseui

    Requirements

    We assume you already have firebase sdk installed and configured. We're using this great library: react-native-firebase

    Getting started

    $ npm install react-native-firebaseui --save

    Mostly automatic installation

    $ react-native link react-native-firebaseui

    For iOS add the following pod to your podfile:

    pod 'SDWebImage', '~> 4.0'

    and run pod install.

    Android Additional step for PhotoView Library

    Add this in your root build.gradle file (usually under android/build.gradle):

    allprojects {
      repositories {
        ...
        maven { url "https://jitpack.io" }
      }
    }

    Manual installation

    iOS

    1. In XCode, in the project navigator, right click Libraries ‚ěú Add Files to [your project's name]
    2. Go to node_modules ‚ěú react-native-firebase-ui and add RNFirebaseUi.xcodeproj
    3. In XCode, in the project navigator, select your project. Add libRNFirebaseUi.a to your project's Build Phases ‚ěú Link Binary With Libraries
    4. Run your project (Cmd+R)<

    Android

    1. Open up android/app/src/main/java/[...]/MainApplication.java
    • Add import io.rumors.reactnativefirebaseui.RNFirebaseUiPackage; to the imports at the top of the file
    • Add new RNFirebaseUiPackage() to the list returned by the getPackages() method
    1. Append the following lines to android/settings.gradle:
    include ':react-native-firebase-ui'
    project(':react-native-firebase-ui').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firebase-ui/android')
    1. Insert the following lines inside the dependencies block in android/app/build.gradle:
      compile project(':react-native-firebase-ui')

    Usage

    import { ImageView, PhotoView } from 'react-native-firebaseui';
     
    //no zoom support
    export class MyFirebaseImageView extends Component<void, void, void> {
      constructor(props) {
        super(props);
      }
     
      render() {
        let imageProps = this.props;
     
        return (
          <ImageView
            {...imageProps}
            path="firebase/storage/path"
            defaultSource={require('./placeholder.png')} // optional, show placeholder until image is loaded
            timestamp={0} //optional, can be used to specify last modified time for same storage path
            resizeMode="cover" //'cover', 'contain', 'stretch', 'center'
          />
        );
      }
    }
     
    //zoom support (android only). On iOS just wrap the ImageView with a scroll view
    export class MyFirebasePhotoView extends Component<void, void, void> {
      constructor(props) {
        super(props);
      }
     
      render() {
        let imageProps = this.props;
     
        return (
          <PhotoView
            {...imageProps}
            path="firebase/storage/path"
            defaultSource={require('./placeholder.png')} // optional, show placeholder until image is loaded
            timestamp={0} //optional, can be used to specify last modified time for same storage path
            resizeMode="cover" //'cover', 'contain', 'stretch', 'center'
          />
        );
      }
    }

    Note: On Android, the defaultSource prop is ignored on debug builds.

    Keywords

    Install

    npm i react-native-firebaseui

    DownloadsWeekly Downloads

    2

    Version

    0.3.0

    License

    MIT

    Unpacked Size

    117 kB

    Total Files

    34

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar