Você está aqui: React Native ::: React Native - Componentes Visuais ::: Button |
Como detectar um clique em um botão do React Native e exibir uma mensagem AlertQuantidade de visualizações: 1287 vezes |
Nesta dica mostrarei como detectar um evento onPress em um botão do React Native e exibir uma mensagem usando o método alert() do componente Alert. Note que o evento onPress é disparado quando o usuário pressiona o botão. Veja o código completo para o exemplo: ---------------------------------------------------------------------- Se precisar de ajuda para ajustar o código abaixo de acordo com as suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar) Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar a manter o site livre de anúncios. Ficaremos eternamente gratos ;-) Nosso PIX é: osmar@arquivodecodigos.com.br ---------------------------------------------------------------------- import React, {Component} from 'react'; import {View, Button, Alert} from 'react-native'; type Props = {}; export default class App extends Component<Props> { render() { return ( <View style={{backgroundColor: '#eeeeee', padding: 30}}> <Button onPress = {() => Alert.alert("Bem-vindo(a) ao React Native")} title="Clique" /> </View> ); } } Veja que este exemplo define o código a ser chamado quando o botão for clicado diretamente em sua declaração. Em outras dicas dessa seção você verá como clicar no botão e chamar uma função JavaScript residente fora da declaração do botão. |
![]() |
React Native ::: React Native - Componentes Visuais ::: Image |
Como exibir imagens e fotos em aplicações React Native usando o componente ImageQuantidade de visualizações: 1004 vezes |
O componente Image do React Native é usado quando queremos carregar imagens e exibí-las em nossas aplicações mobile. Este componente possibilita a exibição de diferentes tipos de imagens, incluindo imagens remotas (em um site, por exemplo), recursos estáticos, imagens em locais temporários e imagens a partir do armazenamento local, tais como imagens da câmera. Veja uma aplicação React Native completa que mostra como carregar uma imagem da internet e exibí-la em um componente Image. Note que a imagem a ser exibida é a logo do nosso site. Eis o código: ---------------------------------------------------------------------- Se precisar de ajuda para ajustar o código abaixo de acordo com as suas necessidades, chama a gente no WhatsApp +55 (62) 98553-6711 (Osmar) Ah, e se puder, faça uma DOAÇÃO de qualquer valor para nos ajudar a manter o site livre de anúncios. Ficaremos eternamente gratos ;-) Nosso PIX é: osmar@arquivodecodigos.com.br ---------------------------------------------------------------------- import React, {Component} from 'react'; import {Image, View} from 'react-native'; type Props = {}; export default class App extends Component<Props> { render() { return ( <View style={{padding: 10, flexDirection: 'column'}}> <Image style={{width: 237, height: 49}} source={{uri: 'https://www.arquivodecodigos.com.br/logo2.jpg'}} /> </View> ); } } É importante observar que, quando a imagem estiver sendo carregada de uma rede (internet, por exemplo) ou via propriedade data, temos que, manualmente, indicar as dimensões da imagem a ser exibida. |
Vamos testar seus conhecimentos em Ética e Legislação Profissional |
A responsabilidade moral O humano é um ser social e, para tal fim, estabelece valores e princípios como regras e normas de convivência para sua sobrevivência. Isso significa que: A) o homem possui, em sua essência, a necessidade de interação com os outros seres da mesma espécie. B) o ser humano precisa viver sozinho. C) os animais não podem viver com humanos. D) o ser humano não gosta de viver em sociedade. E) humanos e animais não têm instinto. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em |
Características do concreto armado Os domínios de deformação em concreto armado são categorias que descrevem diferentes estados de deformação do material em relação às tensões aplicadas. Cada domínio corresponde a um comportamento específico do material e pode ser usado para entender como o concreto e o aço de reforço interagem sob diferentes condições de carga. Nesse sentido, assinale a alternativa que traz o domínio no qual as peças de concreto armado devem ser projetadas de modo a melhor aproveitar as resistências dos materiais. A) Domínio 1. B) Domínio 2. C) Domínio 3. D) Domínio 4. E) Domínio 5. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Engenharia Civil - Construção Civil |
Fases de uma obra Em relação à parte gráfica de um projeto, a Planta de Locação/Localização serve, comumente: A) Como ponto de partida para a marcação da construção no terreno. B) Para estabelecer a posição em relação às divisas do terreno e ao alinhamento das vias públicas. C) Como projeção vertical, obtida por planos verticais que interceptam as paredes, portas e janelas, fornecendo maiores informações para a execução da obra. D) Como projeções verticais das fachadas ou faces externas dos edifícios. E) Como projeção horizontal da seção reta, passando acima do peitoril das janelas, para que fiquem representados todos os vãos. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em AutoCAD Civil 3D |
Conjuntos de Description Key no AutoCAD Civil 3D Quando estamos usando conjuntos de Description Key, qual parâmetro nos permite controlar automaticamente os parâmetros de alguns pontos? A) Location description (Descrição de localização) B) Marker style (Estilo de marcador) C) Raw description (Descrição crua) D) Full description (Descrição completa) Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em JavaScript |
Analise o seguinte código JavaScriptdocument.write(typeof typeof 1); Qual é o resultado de sua execução? A) number B) NaN C) string D) true E) 1 Verificar Resposta Estudar Cards Todas as Questões |
Veja mais Dicas e truques de React Native |
Dicas e truques de outras linguagens |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
1º lugar: Java |