├── LICENSE ├── P01 - Janta ├── code │ ├── App.js │ └── app.json └── images │ └── icon.png ├── P02 - Nome ├── code │ ├── App.js │ └── app.json └── images │ └── icon.png ├── P03 - AdivinhaNome ├── code │ ├── App.js │ └── app.json └── images │ └── icon.png ├── P04 - ContadorAgua ├── code │ ├── App.js │ └── app.json └── images │ ├── icon.png │ └── waterbg.png ├── P05 - BiscoitoDaSorte ├── code │ ├── App.js │ └── app.json └── images │ ├── cookie.png │ └── icon.png ├── P06 - Timer ├── code │ ├── App.js │ └── app.json └── images │ ├── icon.png │ └── relogio.png ├── P07 - Calculadora ├── code │ ├── App.js │ └── app.json └── images │ └── icon.png ├── P08 - ScrollView └── App.js ├── P09 - FlatList └── App.js ├── P10 - SectionList └── App.js ├── P11 - Picker (Autopeças José) └── App.js ├── P12 - Switch └── App.js ├── P13 - Slider └── App.js ├── P14 - Modal └── App.js ├── P15 - StatusBar └── App.js ├── P16 - AsyncStorage └── App.js ├── P17 - Navigation (React Navigation 3.0) ├── App.js └── src │ ├── Home.js │ ├── Tela1.js │ └── Tela2.js ├── P18 - Params ├── App.js └── src │ ├── Home.js │ ├── Tela1.js │ └── Tela2.js ├── P19 - Lista de Conversas ├── App.js └── src │ └── ListItem.js ├── P20 - Chat ├── assets │ └── bcg.jpg └── code │ ├── App.js │ └── src │ └── MsgItem.js ├── P21 - Tela de dados pessoais e financeiros ├── apk │ └── dados_1.apk ├── assets │ ├── bg.jpg │ ├── icon.png │ └── splash.png └── code │ ├── App.js │ └── app.json ├── P22 - Lista de tarefas ├── code │ ├── App.js │ ├── app.json │ └── src │ │ └── Item.js └── database.url ├── README.md └── READMEfiles └── topImage.png /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Danilo J. L. de Oliveira 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /P01 - Janta/code/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text, Image, StyleSheet } from 'react-native'; 3 | 4 | class Janta extends Component { 5 | 6 | constructor(props) { 7 | 8 | super(props); 9 | this.state = { comida: props.comida }; 10 | let comidas = ['Pizza', 'X-tudo', 'Banana', 'Miojo', 'Misto']; 11 | 12 | setInterval(() => { 13 | this.setState(previousState => { 14 | let n = Math.floor(Math.random() * comidas.length); 15 | return { comida: comidas[n] }; 16 | }); 17 | }, 1000); 18 | 19 | } 20 | 21 | render() { 22 | return ( 23 | 24 | Hoje você vai jantar: 25 | {this.state.comida} 26 | 27 | ); 28 | } 29 | } 30 | 31 | const styles = StyleSheet.create({ 32 | blueCenterBig: { 33 | paddingTop: 0, 34 | color: 'blue', 35 | fontWeight: 'bold', 36 | fontSize: 25, 37 | textAlign: 'center', 38 | }, 39 | aboveBlue: { 40 | color: 'black', 41 | fontWeight: 'bold', 42 | fontSize: 25, 43 | textAlign: 'center', 44 | }, 45 | }); 46 | 47 | export default class PrimeiroProjeto extends Component { 48 | 49 | render() { 50 | 51 | return ( 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | 63 | } 64 | 65 | } -------------------------------------------------------------------------------- /P01 - Janta/code/app.json: -------------------------------------------------------------------------------- 1 | { 2 | "expo": { 3 | "name": "Janta", 4 | "slug": "janta", 5 | "privacy": "public", 6 | "sdkVersion": "32.0.0", 7 | "android":{ 8 | "package":"com.DaniloJs.janta" 9 | }, 10 | "platforms": [ 11 | "ios", 12 | "android" 13 | ], 14 | "version": "1.0.0", 15 | "orientation": "portrait", 16 | "icon": "./assets/images/icon.png", 17 | "updates": { 18 | "fallbackToCacheTimeout": 0 19 | }, 20 | "assetBundlePatterns": [ 21 | "**/*" 22 | ], 23 | "ios": { 24 | "supportsTablet": true 25 | } 26 | } 27 | } -------------------------------------------------------------------------------- /P01 - Janta/images/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Danilo-Js/React-Native-My-First-Projects/8820f1f4ec478ba66f6b8449d440b1925b0f8694/P01 - Janta/images/icon.png -------------------------------------------------------------------------------- /P02 - Nome/code/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { View, Text, Image, StyleSheet, TextInput } from 'react-native'; 3 | 4 | export default class SegundoProjeto extends Component { 5 | 6 | constructor(props) { 7 | super(props); 8 | this.state = { texto: '' }; 9 | 10 | this.mudarTexto = this.mudarTexto.bind(this); 11 | 12 | } 13 | 14 | mudarTexto(t) { 15 | let s = this.state; 16 | if (t.length > 0) { 17 | s.texto = 'Olá, ' + t; 18 | } else { 19 | s.texto = ''; 20 | } 21 | this.setState(s); 22 | } 23 | 24 | render() { 25 | 26 | return ( 27 | 28 | 29 | 30 | 31 | 32 | {this.state.texto} 33 | 34 | 35 | 36 | ); 37 | 38 | } 39 | 40 | } 41 | 42 | const styles = StyleSheet.create({ 43 | input: { 44 | color: 'white', 45 | height: 40, 46 | borderWidth: 1, 47 | borderColor: 'white', 48 | margin: 10, 49 | padding: 10, 50 | }, 51 | texto: { 52 | fontSize: 20, 53 | color: 'white', 54 | textAlign: 'center' 55 | } 56 | }); -------------------------------------------------------------------------------- /P02 - Nome/code/app.json: -------------------------------------------------------------------------------- 1 | { 2 | "expo": { 3 | "name": "Nome", 4 | "slug": "nome", 5 | "privacy": "public", 6 | "sdkVersion": "32.0.0", 7 | "android":{ 8 | "package":"com.DaniloJs.nome" 9 | }, 10 | "platforms": [ 11 | "ios", 12 | "android" 13 | ], 14 | "version": "1.0.0", 15 | "orientation": "portrait", 16 | "icon": "./assets/images/icon.png", 17 | "updates": { 18 | "fallbackToCacheTimeout": 0 19 | }, 20 | "assetBundlePatterns": [ 21 | "**/*" 22 | ], 23 | "ios": { 24 | "supportsTablet": true 25 | } 26 | } 27 | } -------------------------------------------------------------------------------- /P02 - Nome/images/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Danilo-Js/React-Native-My-First-Projects/8820f1f4ec478ba66f6b8449d440b1925b0f8694/P02 - Nome/images/icon.png -------------------------------------------------------------------------------- /P03 - AdivinhaNome/code/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { Platform, StyleSheet, Text, View, Button, Alert, TextInput } from 'react-native'; 3 | 4 | export default class TerceiroProjeto extends Component { 5 | constructor(props) { 6 | super(props); 7 | this.state = { inputTexto: '', inputTexto2: '', texto: '', texto2: '' }; 8 | 9 | this.apertouBotao = this.apertouBotao.bind(this); 10 | this.apertouBotao2 = this.apertouBotao2.bind(this); 11 | } 12 | 13 | apertouBotao() { 14 | let s = this.state; 15 | s.texto = "Olá, " + s.inputTexto; 16 | this.setState(s); 17 | } 18 | 19 | apertouBotao2() { 20 | let ss = this.state; 21 | if (ss.inputTexto2 == '') { 22 | // code... 23 | } else { 24 | if (ss.inputTexto2 == ss.inputTexto) { 25 | ss.texto2 = "Você acertou!"; 26 | } else { 27 | ss.texto2 = "Você errou!"; 28 | } 29 | } 30 | this.setState(ss); 31 | } 32 | 33 | render() { 34 | return ( 35 | 36 | 37 | 38 | 39 | this.setState({ inputTexto })} /> 40 | 41 |