React Native fixed footer

Question

I try to create react native app that looks like existing web app. I have a fixed footer at bottom of window. Do anyone have idea how this can be achieved with react native?

Answer 1

Below is code to set footer and elements above.

import React, { Component } from 'react';
import { StyleSheet, View, Text, ScrollView } from 'react-native';
export default class App extends Component {
    render() {
      return (
      
        
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
           Main Content Here
        
        
          Bottom View
        
      
    );
  }
}
const styles = StyleSheet.create({
  containerMain: {
    flex: 1,
    alignItems: 'center',
  },
  bottomView: {
    width: '100%',
    height: 50,
    backgroundColor: '#EE5407',
    justifyContent: 'center',
    alignItems: 'center',
    position: 'absolute',
    bottom: 0,
  },
  textStyle: {
    color: '#fff',
    fontSize: 18,
  },
});