На протяжении всей жизни я не могу понять, как удалить эти белые полосы, выемки (или набившись) в верхней и нижней части экрана. But if I change the background color of the container to say "red", it changes.
What I've Tried:
[*]Setting the width and height of the Lottie animation using Dimensions.get('window')
[*]Using position: 'absolute' on both the container and animation
Заменить представление с помощью SafeareaView < /li>
Использование Statusbar с прозрачным и FounderColor = "Transparent" < /li>
Пробовал удалить сет /> < /ul>
Соответствующие файлы: < /strong>
App.js
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import Home from './screens/Home'
const Stack = createStackNavigator()
export default function App() {
return (
);
}
< /code>
home.js
import React from 'react';
import LottieView from 'lottie-react-native';
import { View, Text, TouchableOpacity, StyleSheet, Dimensions } from 'react-native';
export default function Home({ navigation }) {
return (
Welcome to Vitola
Find the best cigars for every moment.
navigation.navigate('MainApp')}>
Get Started
navigation.navigate('Login')}>
Already have an account? Log in
);
}
const { width, height } = Dimensions.get('window');
const styles = StyleSheet.create({
container: {
flex: 1,
},
background: {
width,
height,
position: 'absolute',
},
overlay: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 30,
},
title: {
fontSize: 28,
fontWeight: 'bold',
color: '#fff',
marginBottom: 10,
},
subtitle: {
fontSize: 16,
color: '#ddd',
marginBottom: 40,
textAlign: 'center',
},
button: {
backgroundColor: '#fff',
paddingVertical: 12,
paddingHorizontal: 40,
borderRadius: 25,
marginBottom: 20,
},
buttonText: {
color: '#000',
fontWeight: 'bold',
fontSize: 16,
},
loginText: {
color: '#fff',
textDecorationLine: 'underline',
},
});
< /code>
Как сделать анимацию Lottie по-настоящему заполнить экран к краю до белых полос вверху или внизу-независимо от устройства или ОС? Есть ли конкретный способ правильно учесть строку статуса и безопасную область?>
Подробнее здесь: https://stackoverflow.com/questions/796 ... ative-apps
Как избежать выемки с контекстом области просмотра в нативных приложениях React ⇐ Javascript
Форум по Javascript
1749174393
Anonymous
На протяжении всей жизни я не могу понять, как удалить эти белые полосы, выемки (или набившись) в верхней и нижней части экрана. But if I change the background color of the container to say "red", it changes.
[b]What I've Tried:[/b]
[*]Setting the width and height of the Lottie animation using Dimensions.get('window')
[*]Using position: 'absolute' on both the container and animation
Заменить представление с помощью SafeareaView < /li>
Использование Statusbar с прозрачным и FounderColor = "Transparent" < /li>
Пробовал удалить сет /> < /ul>
Соответствующие файлы: < /strong>
App.js
import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import Home from './screens/Home'
const Stack = createStackNavigator()
export default function App() {
return (
);
}
< /code>
home.js
import React from 'react';
import LottieView from 'lottie-react-native';
import { View, Text, TouchableOpacity, StyleSheet, Dimensions } from 'react-native';
export default function Home({ navigation }) {
return (
Welcome to Vitola
Find the best cigars for every moment.
navigation.navigate('MainApp')}>
Get Started
navigation.navigate('Login')}>
Already have an account? Log in
);
}
const { width, height } = Dimensions.get('window');
const styles = StyleSheet.create({
container: {
flex: 1,
},
background: {
width,
height,
position: 'absolute',
},
overlay: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 30,
},
title: {
fontSize: 28,
fontWeight: 'bold',
color: '#fff',
marginBottom: 10,
},
subtitle: {
fontSize: 16,
color: '#ddd',
marginBottom: 40,
textAlign: 'center',
},
button: {
backgroundColor: '#fff',
paddingVertical: 12,
paddingHorizontal: 40,
borderRadius: 25,
marginBottom: 20,
},
buttonText: {
color: '#000',
fontWeight: 'bold',
fontSize: 16,
},
loginText: {
color: '#fff',
textDecorationLine: 'underline',
},
});
< /code>
Как сделать анимацию Lottie по-настоящему заполнить экран к краю до белых полос вверху или внизу-независимо от устройства или ОС? Есть ли конкретный способ правильно учесть строку статуса и безопасную область?>
Подробнее здесь: [url]https://stackoverflow.com/questions/79655334/how-to-avoid-notches-with-view-area-context-in-react-native-apps[/url]
Ответить
1 сообщение
• Страница 1 из 1
Перейти
- Кемерово-IT
- ↳ Javascript
- ↳ C#
- ↳ JAVA
- ↳ Elasticsearch aggregation
- ↳ Python
- ↳ Php
- ↳ Android
- ↳ Html
- ↳ Jquery
- ↳ C++
- ↳ IOS
- ↳ CSS
- ↳ Excel
- ↳ Linux
- ↳ Apache
- ↳ MySql
- Детский мир
- Для души
- ↳ Музыкальные инструменты даром
- ↳ Печатная продукция даром
- Внешняя красота и здоровье
- ↳ Одежда и обувь для взрослых даром
- ↳ Товары для здоровья
- ↳ Физкультура и спорт
- Техника - даром!
- ↳ Автомобилистам
- ↳ Компьютерная техника
- ↳ Плиты: газовые и электрические
- ↳ Холодильники
- ↳ Стиральные машины
- ↳ Телевизоры
- ↳ Телефоны, смартфоны, плашеты
- ↳ Швейные машинки
- ↳ Прочая электроника и техника
- ↳ Фототехника
- Ремонт и интерьер
- ↳ Стройматериалы, инструмент
- ↳ Мебель и предметы интерьера даром
- ↳ Cантехника
- Другие темы
- ↳ Разное даром
- ↳ Давай меняться!
- ↳ Отдам\возьму за копеечку
- ↳ Работа и подработка в Кемерове
- ↳ Давай с тобой поговорим...
Мобильная версия