Create an iOS stopwatch on React-Native (subtitles)

Original author: React Native Academy
  • Transfer
  • Tutorial

Hello, Habr! Subtitles for a very simple React Native tutorial are ready, in which the development of the Stopwatch application will be considered. The stopwatch on iOS was taken as the basis.



This video does not need subtitles as much as it does not need audio. Everything is extremely simple, clear and slow on the screen. Not surprisingly, a tutorial for beginners.


However, if you want to understand the author’s comments, subtitles will come in handy.



Abstract


06:16 Styles in RN


14:20 Create a round button


21:21 work with scroll ( ScrollView )


30:49 conditions in styles


34:59 Finished work on the "static" version of the application


39:07 Make the button transparent when pressed ( TouchableOpacity )


43:21 We found out that there are two problems: inscriptions jump (layout), 0 is not displayed in front in numbers up to 10.


47:20 Draw other buttons when the timer is on.


54:10 Solving the problem of resetting the main timer. Summing time with reduce


01:01:27 JavaScript Purification interval when unmounting ( unmount ) component


01:02:03 Running on Android