Set empty view position to center of page

[iamautomaton]

Hi, i have an issue about empty view, i have no idea how to set empty view position to center of the page. I want to show an image and text to tell user there is no any result return.

below is my code

  renderEmptyView = () => {
    return (
      <View style={{justifyContent: 'center',alignItems: 'center',}}>
      <Thumbnail square source={require("../assets/emptyPage.png")} style={{width:300,height:200}}/>
      <Text style={{color:'#b8b8b8'}}>Un oh, no records found.</Text>
      </View>
    )
  }

        <UltimateListView
          ref={ref => this.listView = ref}
          key={this.state.layout} // this is important to distinguish different FlatList, default is numColumns
          onFetch={this.onFetch}
          keyExtractor={(item, index) => `${index} - ${item}`} // this is required when you are using FlatList
          refreshableMode="advanced" // basic or advanced

          item={this.renderItem} // this takes three params (item, index, separator)
          numColumns={this.state.layout === 'list' ? 1 : 3} // to use grid layout, simply set gridColumn > 1

          // ----Extra Config----
          displayDate
          header={this.renderHeader}
          paginationFetchingView={this.renderPaginationFetchingView}
          emptyView={this.renderEmptyView}

          // new props on v3.2.0
          arrowImageStyle={{ width: 20, height: 20, resizeMode: 'contain' }}
          dateStyle={{ color: 'lightgray' }}
          refreshViewStyle={Platform.OS === 'ios' ? { height: 80, top: -80 } : { height: 80 }}
          refreshViewHeight={80}
        />

Thanks

[mudasar]

Same issue, The empty view is flex 1 but not taking the all the available space.