From 73c1dc3c2b2dc65219caf4eb8db373e2db9e94d1 Mon Sep 17 00:00:00 2001 From: Brandon Presley Date: Sun, 18 Dec 2022 19:55:56 +1300 Subject: [PATCH] Use buttons instead of swiping I had so much trouble with both react-native-swiper and the app slider intro libraries. I would like to be able to swipe between videos but will settle with this for now. --- App.tsx | 83 +++++++++++++++++++++++++++++++++++++--------------- Item.tsx | 42 +++++++++++++++----------- package.json | 2 ++ yarn.lock | 39 ++++++++++++++++++++++-- 4 files changed, 124 insertions(+), 42 deletions(-) diff --git a/App.tsx b/App.tsx index 6daeb5e..0469e3b 100644 --- a/App.tsx +++ b/App.tsx @@ -1,30 +1,37 @@ import {useState} from 'react' -import {Button, View} from 'react-native' -import AppIntroSlider from 'react-native-app-intro-slider' +import {Button, Dimensions, Pressable, Text, View} from 'react-native' import DocumentPicker, { DocumentPickerResponse, + types, } from 'react-native-document-picker' +import Video from 'react-native-video' import {backgroundColor} from './constants' -import Item from './Item' export default function App() { const [files, setFiles] = useState([]) - const [slide, setSlide] = useState(0) + const [selected, setSelected] = useState(0) + const [paused, setPaused] = useState(false) + const [width, setWidth] = useState(0) + + const height = Dimensions.get('screen').height const pick = async () => { - const picked = await DocumentPicker.pickMultiple() + const picked = await DocumentPicker.pickMultiple({type: types.video}) + setSelected(0) console.log(`Picked ${picked.length} files.`) setFiles(picked) } - const renderItem = ({ - item, - index, - }: { - item: DocumentPickerResponse - index: number - }) => { - return + const prev = () => { + if (selected <= 0) return + setSelected(selected - 1) + setPaused(false) + } + + const next = () => { + if (selected >= files.length - 1) return + setSelected(selected + 1) + setPaused(false) } return ( @@ -36,16 +43,46 @@ export default function App() { flexGrow: 1, padding: 10, }}> - - -