Is there an element in NativeBase3 that replaces the Content element in NativeBase2? Essentially a keyboard aware scrolling view.
I was also wondering if there is an easy way to un-focus an Input by tapping off of it (I think the Content element solved this as well).
Thanks!
Related
I have a Text component which I would like to make selectable. I provided the Text component the selectable prop, however it isn't working. I am pretty sure that it is because I have it nested in a ScrollView and my pressing it is only registering on the scrollview. Any way to get past this?
Can provide a code example if needed.
I've used keyframes to animate the entrance of some elements onto my page, however the elements are located at the bottom of the page, so the animation takes place before you see them.
Is there a way to stop the animation from happening until the user scrolls into view of the elements? Preferably not a jQuery solution since I am not familiar with it.
Note: I know there is a library called wow.js that solves this issue, but it uses animate.css for it's animations. This is a problem for me because I was using animate.css originally but it was overwriting/conflicting with some other css I had. That is why I switched to using keyframes for the animations, and in order to have all the properties of elements working correctly I believe I have to stay with keyframes rather than animate.css
I found my own answer! Wow.js still works because you don't have to necessarily use animate.css animations, you can still use your own custom animations.
I'm building a React Native app using some of Native Base components. Its footer and header are good and easy to understand, but I'm having 2 issues about <Content> size and position.
Issue 1:
When I scroll down, then click, for example, "First Element" in the TimeTable section, which is a <Accordion> (kind of drop down list for one who doesn't know), then the size of content gets longer, but the screen doesn't update to fit the whole content.
My code is not special, I don't give any style for <Container> and <Content> so I think this is its default. I once tried copy-pasting ~50 lines of <Text> to see if it's my fault, but it only displays a very few number of line. I can't find any document that says clearly about this so hope someone has faced this before.
Issue 2:
When I switch tab using Footer, if the previous tab position is bottom, the new tab position is also bottom, not "auto scroll" to the top. Can somebody show me how to get new tab to top?
A lot of thanks!
My mistake! I somehow made another <Content> inside a <Content>, replacing it by a <View> makes the first issue go away.
But the position one is still driving me crazy :(
I watched this presentation and there's a section on how to build an IOS Maps like UI. When dragging from the bottom to top, it drags to the top, and after it reaches the top, it continues scrolling up. Also, when scrolling down, when it reached the top content of the ScrollView, it continues to drag down.
It is suggested that it can be done using ScrollView by adding an empty transparent cell as the first element on the ScrollView. I have tried implementing the same which can be found in this snack. In my case, instead of Maps, I am using another ScrollView.
But the problem is that the first element (transparent element) does not allow to interact with the First ScrollView elements. I have tried with pointerEvents inside the first transparent view and even in its parent ScrollView. But this does not help. Has anyone tried implementing this kind of use case with react-native? All I found was this library, but I think it's not maintained properly.
you need to set the z-index of the transparent view to send it under/behind the interactive content, here is a good resource:
https://philipwalton.com/articles/what-no-one-told-you-about-z-index/
Edit: Actually I could not accomplish it, it seems like everything inside a scrollview will always be behind or in front of other elements, it seems like you can't have part of the scrollview behind something else and another part in front of something else.
Why does my navbar jump a little to the right when a drop-down is selected? Looks like some padding is missing on :hover perhaps. Any help would be appreciated. Thanks
http://www.85widening.com/default.html
It has to do with Bootstrap hiding the vertical scrollbar on body when the modal opens. It occurs only when you have a fixed navbar and body/modal content that require vertical scrolling.
Based on what I recall and found, it's a bug with Bootstrap 3 that I don't believe was ever resolved based on this GitHub issue.
Most workarounds seem to involve JS to add padding-right (like 15px) to the navbar when the modal opens or to override the overflow: hidden property the modal-open class that Bootstrap adds to body when you open a modal. The downside of this is you will have two vertical scroll bars (ugly). Either add the workaround or remove the fixed navbar. I haven't moved on to Bootstrap 4 yet but maybe they've addressed this.