JAVASCRIPT

React Native Component with Random Hexa

import * as React from 'react';
import { Text, View, StyleSheet , TouchableOpacity, TextInput, Image, FlatList, Button} from 'react-native';
import Constants from 'expo-constants';

// You can import from local files

// or any pure javascript modules available in npm
import { Card } from 'react-native-paper';

export default function App() {

  const[cd,secd]=React.useState(0);
  const[back,setback]=React.useState("")

  function gethex(){
    var hexy= '#'+Math.floor(Math.random()*16777215).toString(16);
    setback(hexy);
  }

  return (
    <View style={{flex:1, justifyContent:'center', alignItems:'center',marginLeft:50, marginRight:50}}>

    <TouchableOpacity onPress={()=>{secd(cd+1); gethex();}} style={{}}>
      <Card style={{  paddingLeft:20, paddingRight:20, paddingTop:20, paddingBottom:20, borderWidth:1,
      borderColor:"black",
      overflow: 'hidden',
      shadowColor: '#59ffd3',
      shadowRadius: 10,
      shadowOpacity: 0.3,}}>
      <Text >
        Change code in the editor and watch it change on your phone! Save to get a shareable url.
      </Text>
      </Card>
    </TouchableOpacity>
     
    <View style={{marginTop:20, backgroundColor:back}}>
      <Text style={{color:'white', padding:20, borderRadius:10}}>Current Value of Hook is {cd} </Text>
    </View>
    
    </View>
  );
}