How to show page indicator top of the view

[ashanjayasundara]

how can i show page dot indicator on top of the parent view currently its show on bottom of the view

[beeglebug]

you can pass a style prop with overrides for the default styling (which is position: absolute, bottom: 10)

try something along the lines of bottom: null, top: 0

[skwidz]

@beeglebug's solution didnt work for me, and caused the pager not to render.

What did work for me was passing flexDirection:'column-reverse' in as a prop

it looked like this;

<IndicatorViewPager style={{flexDirection: 'column-reverse', flex:1}} indicator={this._renderTitleIndicator()} >

[it16madhavanadkat]

for

<IndicatorViewPager horizontalScroll={true} style={{flex: 1}} indicator={this._renderTabIndicator()} pagerStyle={{marginTop: 50}} onPageSelected={this.onPageSelected} trackScroll={true} ></IndicatorViewPager>

where

_renderTabIndicator() { return ( <PagerTitleIndicator style={ { flex: 1, height: 50, position: 'absolute', top: 0, left: 0, right: 0, backgroundColor: 'white' } } itemTextStyle={stylesd.indicatorText} selectedItemTextStyle={stylesd.indicatorSelectedText} titles={tabTitle} /> ); }

this will 100% show tab on top make sure you use

style={{flex: 1}} indicator={this._renderTabIndicator()}