brandon.presley/Massive
brandon.presley
/
Massive
4
8
Fork 3
Code Issues 14 Pull Requests Activity

Share entire screen when sharing a Best graph 

Closes #20
This commit is contained in:
Brandon Presley 2022-09-18 20:24:05 +12:00
parent 6f98f03c8b
commit 1ad101f06c
1 changed files with 6 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
ViewBest.tsx
View File

@ -4,12 +4,13 @@ import {
useNavigation, useNavigation,
useRoute, useRoute,
} from '@react-navigation/native'; } from '@react-navigation/native';
import React, {useCallback, useEffect, useRef, useState} from 'react'; import React, {useCallback, useEffect, useState} from 'react';
import {View} from 'react-native';
import {FileSystem} from 'react-native-file-access'; import {FileSystem} from 'react-native-file-access';
import {IconButton} from 'react-native-paper'; import {IconButton} from 'react-native-paper';
import RNPickerSelect from 'react-native-picker-select'; import RNPickerSelect from 'react-native-picker-select';
import Share from 'react-native-share'; import Share from 'react-native-share';
import ViewShot from 'react-native-view-shot'; import {captureScreen} from 'react-native-view-shot';
import {getVolumes, getWeightsBy} from './best.service'; import {getVolumes, getWeightsBy} from './best.service';
import {BestPageParams} from './BestPage'; import {BestPageParams} from './BestPage';
import Chart from './Chart'; import Chart from './Chart';
@ -27,7 +28,6 @@ export default function ViewBest() {
const [metric, setMetric] = useState(Metrics.Weight); const [metric, setMetric] = useState(Metrics.Weight);
const [period, setPeriod] = useState(Periods.Monthly); const [period, setPeriod] = useState(Periods.Monthly);
const navigation = useNavigation(); const navigation = useNavigation();
const viewShot = useRef<ViewShot>(null);
useFocusEffect( useFocusEffect(
useCallback(() => { useCallback(() => {
@ -39,14 +39,12 @@ export default function ViewBest() {
headerRight: () => ( headerRight: () => (
<IconButton <IconButton
onPress={() => onPress={() =>
viewShot.current?.capture?.().then(async uri => { captureScreen().then(async uri => {
const base64 = await FileSystem.readFile(uri, 'base64'); const base64 = await FileSystem.readFile(uri, 'base64');
const url = `data:image/jpeg;base64,${base64}`; const url = `data:image/jpeg;base64,${base64}`;
Share.open({ Share.open({
message: params.best.name,
type: 'image/jpeg', type: 'image/jpeg',
url, url,
failOnCancel: false,
}); });
}) })
} }
@ -68,7 +66,7 @@ export default function ViewBest() {
}, [params.best.name, metric, period]); }, [params.best.name, metric, period]);
return ( return (
<ViewShot style={{padding: PADDING}} ref={viewShot}> <View style={{padding: PADDING}}>
<RNPickerSelect <RNPickerSelect
onValueChange={setMetric} onValueChange={setMetric}
items={[ items={[
@ -106,6 +104,6 @@ export default function ViewBest() {
xFormat={(_value, index) => formatMonth(weights[index].created!)} xFormat={(_value, index) => formatMonth(weights[index].created!)}
/> />
)} )}
</ViewShot> </View>
); );
} }