GithubHelp home page GithubHelp logo

pritishvaidya / react-native-flip-timer Goto Github PK

View Code? Open in Web Editor NEW
74.0 74.0 24.0 2.1 MB

A Flip Timer implementation in React Native

Home Page: https://medium.freecodecamp.org/how-to-build-a-flip-timer-in-react-native-e208e54baf58

License: MIT License

JavaScript 77.03% Java 4.39% Objective-C 12.14% Starlark 6.45%

react-native-flip-timer's Introduction

Hi there, I'm Pritish! ๐Ÿ‘‹

Pritish Vaidya | Twitter Pritish's Stackoverflow

Hi, I'm Pritish Vaidya, a FrontEnd Developer.

Languages and Tools:

Pritish's github stats

react-native-flip-timer's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

react-native-flip-timer's Issues

wrapperStyle

Again it's me, please tell me if I'm well implemented wrapperStyle property because it looks like this, I want the Timer to have less width.

<Timer wrapperStyle={{width:300}} time={0} play={this.state.play} />

whatsapp image 2019-03-05 at 4 29 24 pm

Initially it should be Paused

i want to make it initially paused then on click button play start the timer.
my code is look like this.

`constructor(props){
      super();
      this.state = {
        play: false,
      }
}

play = () => {
      this.setState(({ play }) => ({ play: !play }));
}

render(){
const { play } =this.state
return(
<View>
<Timer time={0} play={play} />
<TouchableOpacity style={styles.button} onPress={this.play}>
          <Text style={styles.text}>{play ? 'Pause' : 'Play'}</Text>
        </TouchableOpacity></View>
)}`

Change default start value for prop time={}

is it possible change default start value for property time after lock and unlock device?
for example: we have state seconds equal 50, and change state every second.

<Timer time={this.state.seconds} play={play} />

on mounting screen timer will start from 50 seconds. On locking device setState change value for state seconds. after 10 second and unlock devise state will equal 60, but timer will show 50 seconds.

Reset time?

Hi thank you for this component! Is there any way to reset the timer back to 00:00:00?
I've seen issue #13 where I can set the individual numbers, but a change of the <Timer time={time} time prop is not handled in a component update function. It seems that you only read props.time in the componentDidMount function.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.