问题描述
我最近才开始在 android 中测试我的 expo 裸工作流应用程序。我遇到了这个问题，视频在 IOS 上正确定向，但不是 android。在下面的视频中，桌子应该是水平的，而不是垂直和拉伸的。这只发生在安卓系统上。
无论我做什么，例如将调整大小模式更改为覆盖、拉伸或包含，或者仔细检查是否存在并安装了正确的包，方向都是相同的。
这是我对整个视频框的代码：
{props.videoUrl
? (
<View style={{width: '100%',alignItems:'center'}}>
<TouchableOpacity
activeOpacity={.9}
onPress={() => setvideoPlaying(!videoPlaying)}
>
<Video
source={{ uri: props.videoUrl }}
onLoad={() => setvideoLoaded(true)}
ref={(video) => { setvideoRef(video) }}
rate={1.0}
volume={1.0}
isMuted={videoMuted}
resizeMode="cover"
shouldplay={videoPlaying}
isLooping={true}
style={[styles.video,{ width: 340,height: 280 }]}
/>
</TouchableOpacity>
{videoLoaded
? null
: <ActivityIndicator size='large' style={{position:'absolute',top: 120}}/>
}
{!videoPlaying && videoLoaded
? (
<TouchableOpacity style={{position:'absolute',top: 110}} onPress={() => setvideoPlaying(!videoPlaying)}>
<Icon name='play' type='material-community' color='#ffffff' style={styles.shadow} size={80}/>
</TouchableOpacity>
)
: null
}
{videoLoaded
? (
<View
style={{position:'absolute',top: 20,right: 15}}
>
<Text style={[styles.videoTime,styles.shadow]}>{videoTime}</Text>
</View>
)
: null
}
{videoLoaded
? (
<TouchableOpacity
style={{position:'absolute',bottom: 20,left: 15}}
activeOpacity={.9}
onPress={() => setvideoMuted(!videoMuted)}
hitSlop={{top: 7,bottom: 7,left: 7,right: 7}}
>
{videoMuted
? <Icon name='volume-off' type='material-community' color='#ffffff' style={styles.shadow} size={25}/>
: <Icon name='volume-high' type='material-community' color='#ffffff' style={styles.shadow} size={25}/>
}
</TouchableOpacity>
)
: null
}
{videoLoaded
? (
<TouchableOpacity
style={{position:'absolute',right: 15}}
activeOpacity={.9}
onPress={() => videoRef?.presentFullscreenPlayer()}
hitSlop={{top: 7,right: 7}}
>
<Icon name='fullscreen' type='material-community' color='#ffffff' style={styles.shadow} size={25}/>
</TouchableOpacity>
)
: null
}
{videoLoaded
? (
<View
style={{position:'absolute',bottom: 12,width: 315}}
>
<ProgressBar progress={progressBarPercentage} color={'#ffffff'} style={[styles.shadow,{backgroundColor:'#000000',borderRadius: 10}]}/>
</View>
)
: null
}
<View style={styles.topBottomBorder}/>
</View>
)
: null
}
这是我的 package.json：
"scripts": {
"start": "react-native start","android": "react-native run-android","ios": "react-native run-ios","web": "expo start --web","eject": "expo eject"
},"dependencies": {
"@groftware/lottie-flatlist": "^1.0.6","@material-ui/core": "^4.10.2","@react-native-async-storage/async-storage": "^1.13.3","@react-native-community/datetimepicker": "^2.4.3","@react-native-community/masked-view": "0.1.10","@react-navigation/bottom-tabs": "^5.6.1","@react-navigation/material-top-tabs": "^5.2.12","@react-navigation/native": "^5.6.1","@react-navigation/stack": "^5.6.2","@svanBoxel/visibility-sensor-react-native": "^1.0.2","axios": "^0.19.2","base-64": "^0.1.0","expo": "^38.0.0","expo-av": "~8.2.1","expo-blur": "~8.1.2","expo-camera": "~8.3.1","expo-crypto": "^8.2.1","expo-file-system": "^9.1.0","expo-haptics": "^8.2.1","expo-image-manipulator": "^8.2.1","expo-image-picker": "~8.3.0","expo-notifications": "~0.3.3","expo-permissions": "~9.0.1","expo-splash-screen": "^0.5.0","expo-status-bar": "^1.0.0","expo-updates": "~0.2.10","expo-video-thumbnails": "~4.2.1","expo-web-browser": "^8.5.0","firebase": "^7.22.0","firebase-admin": "^9.2.0","form-data": "^3.0.0","lottie-react-native": "~2.6.1","mobx": "^5.15.7","mobx-react": "^6.3.1","moment": "^2.27.0","react": "~16.11.0","react-dom": "16.11.0","react-native": "~0.62.2","react-native-appearance": "^0.3.4","react-native-datepicker": "^1.7.2","react-native-elements": "^2.0.4","react-native-expo-cached-image": "^1.2.1","react-native-gesture-handler": "~1.6.0","react-native-image-viewing": "^0.2.0","react-native-keyboard-aware-scroll-view": "^0.9.1","react-native-modal": "^11.5.6","react-native-paper": "^4.7.0","react-native-reanimated": "~1.9.0","react-native-safe-area-context": "~3.0.7","react-native-screens": "~2.9.0","react-native-svg": "12.1.0","react-native-tab-view": "^2.14.4","react-native-unimodules": "^0.10.1","react-native-vector-icons": "^6.6.0","react-native-web": "~0.11.7","react-navigation": "^4.3.9","react-navigation-stack": "^2.5.1"
},"devDependencies": {
"@babel/core": "^7.8.6","babel-jest": "~25.2.6","jest": "~25.2.6","react-test-renderer": "~16.11.0","@babel/plugin-proposal-decorators": "^7.10.4","@babel/plugin-Syntax-decorators": "^7.10.1","@types/react": "~16.9.41","@types/react-native": "~0.62.13","@types/react-native-datepicker": "^1.7.0","@types/react-native-vector-icons": "^6.4.5","babel-plugin-transform-decorators-legacy": "^1.3.5","babel-preset-expo": "^8.2.3","typescript": "~3.9.5"
},"private": true,"name": "myApp","version": "1.0.0"
}
我最近确实从世博会管理的工作流应用程序中弹出。不确定这是否会改变一些东西，但我什至不知道这是否适用于托管工作流程，因为我刚开始测试 android...我从错误中吸取教训，哈哈。非常感谢任何帮助！
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）