SafeAreaView is a React Native component which helps you avoid challenging display edges, like the iPhone X notch.
Questions tagged [safeareaview]
48 questions
2
votes
1 answer
React Native FlatList ListHeaderComponent wrapped in SafeAreaView doesn't respect the boundaries of SafeAreaView
Description
Hello, I'm pretty new to React Native and I was trying to render a FlatList inside a ScrollView and I got an error mentioning this application of FlatList inside ScrollView is not proper and it may cause some scroll disorientations. So,…
M. Çağlar TUFAN
- 626
- 1
- 7
- 21
2
votes
1 answer
UNITY: How to get the coordinates of the SafeArea rect?
I am working on a project in Unity for Android Portrait mode. I will constantly be modifying the textures of two RawImages, the catch is that the images must be the same width and height(1080x1080, 800x800) 1080x1079 is wrong. Because a lot of…
Jasper Howard
- 167
- 1
- 7
1
vote
0 answers
SafeAreaView No overload matches this call react native
SafeAreaView showing error in tsx file .
No overload matches this call.
Overload 1 of 2, '(props: ViewProps | Readonly): SafeAreaView', gave the following error.
Type '{ children: Element; style: { flex: number; }; }' is not assignable to type…
D.S
- 11
- 1
1
vote
2 answers
Why SafeAreaView Background Not Working in React Native?
In my app SafeareaView Not Working. And I can to change Background Color
Check This Image
1
vote
3 answers
Why is the Safe Area in React PWA is always 0px?
Hi I'am building a PWA with react and I've been trying to add a padding to my Footer to avoid the safe area, but for some reason it's always 0px;
I have these tags in HTML:
Hiimdjango
- 431
- 5
- 21
1
vote
1 answer
SafeAreaView implementation on iPhone 11
I'm trying to add a SafeAreaView so my icons don't get squished together like shown in the image.
But it seems the SafeAreaView just pushes the contents up instead.
This is how I've currently Implemented it/
const BottomTabs = () => (
…
user14200771
1
vote
1 answer
Remove, or change color of the safe area at the bottom of the View in SwiftUI
Here is the screen shot:
The code to the view is as follows:
struct ViewDetails: View {
@EnvironmentObject var displayDetails: DisplayDetails
var body: some View {
ScrollView {
GeometryReader { geometry in
…
Learn2Code
- 1,974
- 5
- 24
- 46
1
vote
0 answers
iOS version of React Native app has empty bar at the bottom with the exception of iPhone X series
iPhone X and iPhon XS Max are displaying correctly. But iPhone 6s and iPhone 7 Plus have empty bars at the bottom.
I’m using for iOS React Native app for iPhones.
I had previously had hand-made image files as launch screens before I knew better.…
L.U.
- 501
- 5
- 20
1
vote
0 answers
Dynamic backgroundColor in SafeAreaView react native
I am using SafeAreaView provided by react-navigation and inside that, I am having my navigation controller.
What I want is the dynamic color for header i.e. notch in iOS and android. I want different notch background for different screens.
This is…
Ravi
- 34,851
- 21
- 122
- 183
0
votes
0 answers
SafeAreaContext error on Expo Dev Client Build
I am looking to add a simple SafeAreaView in my react native application using the 'react-native-safe-area-context'. I am on a windows PC, using expo dev client. My goal is simply to use the safe area context properly.
Here is the current…
Owen
- 21
- 2
0
votes
1 answer
Bottom Margin between Keyboard and TextInput Gifted Chat
I've tried every solution to get rid of the space between the keyboard and input field in gifted chat but nothing works. Weirdly bottomOffset does not do anything either, at all. It's probably related to safeAreaView, and looks as it's supposed to…
elijaveto
- 31
- 2
0
votes
0 answers
How to make the SafeAreaView unaffected by keyboard React Native
I want to ignore the soft navbar on android and I am using safeareview for this. SafeAreaView also changes its size because of the keyboard which I dont need. Please help me for this and if have any other ways to only exclude the softnavbar. I am…
shafin kothia
- 11
- 1
0
votes
0 answers
React Native SaveAreaView has large "margin" below the notch on iPhone X+, but small margin on classic iPhone and none on Android?
I have a component, placed inside a which is positioned absolutely in the top. I've also added some colored boxes for testing.
Of course I want the component to be shown outside the notch and outside the top bar of classic iPhones.
However, it…
Esben von Buchwald
- 2,772
- 1
- 29
- 37
0
votes
1 answer
how I can ignoring safe area on CollectionViewCell
hello I have a problem with UICollectionView
I added one UICollectionView on my storyboard for image slider.
but I couldn't ignore safe area.
how can I do?
ü
I tried to fix it with constraints but didn't work
ibrahim erdogan
- 11
- 3
