expo camera 2 whitebalance

auto

sunny

cloudy

shadow

fluorescent

incandescent

//app.js

import React, { useState, useEffect } from 'react';
import { Camera } from 'expo-camera';
import * as MediaLibrary from 'expo-media-library';
import {
  Container, Header, Title, Content, Footer,
  FooterTab, Button, Left, Right, Body, Icon, Text,
  Accordion, Card, CardItem, Thumbnail, ListItem,
  CheckBox, DatePicker, DeckSwiper, Fab, View,
  Badge, Form, Item, Input, Label, Picker, Textarea,
  Switch, Radio, Spinner, Tab, Tabs, TabHeading,
  ScrollableTab, H1, H2, H3, Drawer,
} from 'native-base';
import {
  Ionicons, MaterialIcons, Foundation,
  MaterialCommunityIcons, Octicons
} from '@expo/vector-icons';

export default function App() {
  const [cameraPermission, setcameraPermission] = useState('denied');
  const [storagePermission, setstoragePermission] = useState('denied')
  const [cameraDirection, setcameraDirection] = useState(Camera.Constants.Type.back);
  const [autoFocus, setautoFocus] = useState('on')
  const [wb, setwb] = useState(0)

  const wbOrder = [
    'sunny',
    'cloudy',
    'shadow',
    'fluorescent',
    'incandescent',
    'auto',
  ]

  const wbIcons = [
    'wb-auto',
    'wb-sunny',
    'wb-cloudy',
    'beach-access',
    'wb-iridescent',
    'wb-incandescent',
  ]

  useEffect(() => {
    (async () => {
      const grantCamera = await Camera.requestPermissionsAsync();
      setcameraPermission(grantCamera.status)

      const grantStorage = await MediaLibrary.requestPermissionsAsync()
      setstoragePermission(grantStorage.status)
    })();
  }, []);

  takePicture = async () => {

    if (this.camera) {
      //some camera does not support auto focus,
      //disable autofocus before taking a picture and reenable after
      await setautoFocus('off')
      const { uri } = await this.camera.takePictureAsync();
      await setautoFocus('on')
      console.log('uri', uri);

      await MediaLibrary.saveToLibraryAsync(uri)
        .then(() => {
          alert('image saved!')
        })
        .catch(error => {
          alert('An Error Occurred!')
        });
    }
  }

  toggleWb = () => {
    wb < 5 ? setwb(wb + 1) : setwb(0)
  }


  if (cameraPermission !== 'granted' || storagePermission !== 'granted') {
    return <Text style={{ marginTop: 25 }}>App uses camera and storage</Text>;
  }


  return (
    <View style={{ flex: 1 }}>
      <Camera style={{ flex: 1 }}
        type={cameraDirection}
        autoFocus={autoFocus}
        whiteBalance={wbOrder[wb]}
        ref={ref => { this.camera = ref }}>

        <View style={{
          flex: 1,
          backgroundColor: 'transparent',
          alignItems: 'center',
          justifyContent: 'space-between',
          flexDirection: 'column',
        }}>
          <Button rounded transparent style={{ marginTop: 25, height: 50 }}
            onPress={() => toggleWb()}>
            <MaterialIcons name={wbIcons[wb]} size={40} color="white" />
          </Button>
          <Button rounded transparent style={{ marginBottom: 50, height: 80 }}
            onPress={() => takePicture()}>
            <Icon name='camera' style={{ fontSize: 60, color: 'white' }} ></Icon>
          </Button>
        </View>

      </Camera>
    </View>
  );
}

reference:
https://snack.expo.io/@charliecruzan/camerja