talalmajali / react-native-countdown-component

React Native CountDown
MIT License
272 stars 236 forks source link

Display order of minutes and seconds #71

Open zsj1396 opened 4 years ago

zsj1396 commented 4 years ago

hi my code is; <CountDown

                 timeToShow={['M', 'S']}
                 timeLabels={{ m: '', s: '' }}
                 digitStyle={{ backgroundColor: 'transparent' }}
                  showSeparator={true}
                 until={this.state.until}
                  size={moderateScale(20)}
               />

My problem is that it shows seconds first, then minutes!!! there isn't any styles. why?????!!! fdf9e2b1-fde6-4a03-ad85-8971f8c9a9d6

talalmajali commented 4 years ago

@zsj1396 are you using react-native rtl?

zsj1396 commented 4 years ago

@zsj1396 are you using react-native rtl?

I noticed that this problem exists when mobile language is Farsi and when the mobile language is English.The problem is solved when the mobile language becomes English. So what to do when Farsi is a mobile language?

akhlopyk commented 4 years ago

I have the same issue. Any updates on how to use it in RTL?

akhlopyk commented 4 years ago

My solution is just change order inside this library. Very simple.

armata99 commented 3 years ago

It's a little bit tricky but here it is for anyone who looks for it:

{timeToShow.includes('S')
          ? this.renderDoubleDigits(timeLabels.d, newTime[3])
          : null}
        {showSeparator && timeToShow.includes('S') && timeToShow.includes('M')
          ? this.renderSeparator()
          : null}
        {timeToShow.includes('M')
          ? this.renderDoubleDigits(timeLabels.h, newTime[2])
          : null}
        {showSeparator && timeToShow.includes('M') && timeToShow.includes('H')
          ? this.renderSeparator()
          : null}
        {timeToShow.includes('H')
          ? this.renderDoubleDigits(timeLabels.m, newTime[1])
          : null}
        {showSeparator && timeToShow.includes('H') && timeToShow.includes('D')
          ? this.renderSeparator()
          : null}
        {timeToShow.includes('D')
          ? this.renderDoubleDigits(timeLabels.s, newTime[0])
          : null}

paste this portion inside the return of renderCountDown function in the index file. NOTE: keep in mind if you change the index file of this library it will reset itself every time you add/remove packages. so make a copy of it and do what you do in that.

Parmodkumar11 commented 2 years ago

My solution is just change order inside this library. Very simple. 👍