Comments (49)
π I need this for <TextInput />
from react-native.
There is no pain guys - all will work with <View>
wrapping any <Text>, <TextInput>, <Touchable...>
from react-native.
π for TextInput
:)
from react-native.
<View>
wrapping is painful. It makes styling a pain. Especially with error states. 1 field = 4 independent styles.
from react-native.
It's not yet working for me (on 0.4.0)
from react-native.
Argh, nevermind, Apparently it is not activated for <Text />
nodes and I'm now wrapping a <View />
around them.
from react-native.
+1 for Text
from react-native.
Should be working now
from react-native.
Guys, make sure that you're voting it up in here: https://productpains.com/post/react-native/add-borderwidth-left-right-top-bottom-to-textinput-/ instead of +1'ing.
from react-native.
A workaround is to wrap your TextInput
or Text
in a View
and apply the borders on the View
.
from react-native.
+1 for Textinput
from react-native.
Yup, you noticed! So, the story here is that borders on only one side are not natively supported by iOS, we did some bad hacks in our fb codebase to support it.
We want to rewrite it cleanly in OSS. Make sure it supports borderRadius, and does the same diagonal appearance when there are two adjacent borders with a different color/size.
from react-native.
Can confirm that this works in 0.8.0 for <View />
But is there a reason why it doesn't support <Text />
?
from react-native.
+1 for <Text />
support
from react-native.
+1 for <TextInput />
from react-native.
+1 for <Text />
from react-native.
Any news on support for <Text />
?
from react-native.
+1 for <TextInput />
as well
from react-native.
Can you add it to https://productpains.com/product/react-native/ so that we can figure out prioritization?
from react-native.
fyi: https://productpains.com/post/react-native/add-borderwidth-left-right-top-bottom-to-textinput-/
from react-native.
+1
from react-native.
@ide, you guys don't have labels for these types of issues?
from react-native.
Definitely need it for <TextInput />
from react-native.
+1 on <TextInput />
from react-native.
+1 <TextInput />
from react-native.
+1 <TextInput />
, Googling brought me to this issue.
from react-native.
Ugh, spent hours banging my head against the wall trying to figure this out before I found this... +1 gajillion to make this work everywhere the docs say it should, like TextInput...
from react-native.
+1 for TextInput
from react-native.
Also, this is not a controversial feature. A pull request would be much more impactful :)
from react-native.
π TextInput
:)
Up also here guys: https://productpains.com/post/react-native/add-borderwidth-left-right-top-bottom-to-textinput-/
from react-native.
Hi, although I can use <View>
to wrap the <TextInput>
and <Text>
to support borderLeft/Right
..., I still need them. I don't want to wrap too many <View>
s to hack.
My react-native version is 0.24.1
from react-native.
It seems still doesn't working properly, have a look at the first item:
return (
<View style={[styles.eventInRoom, { borderLeftColor: roomColor }, styles.feedEventContainer]}>
<View style={styles.feedEventContent}>
Which has the following styles:
feedEventContainer: {
margin: 10,
marginBottom: 5,
borderRadius: 2,
shadowColor: '#000',
shadowOffset: { width: 0, height: 0 },
shadowOpacity: .3,
shadowRadius: 1.3,
backgroundColor: '#ffe',
},
eventInRoom: {
borderLeftWidth: 3,
borderTopWidth: 0,
borderRightWidth: 0,
borderBottomWidth: 0,
},
feedEventContent: {
padding: 10,
flexDirection: 'row',
borderBottomColor: '#ddd',
borderBottomWidth: .5,
},
from react-native.
+1 for <TextInput />
, also upvoted in productpain (Y)
from react-native.
+1 for Text and TextInput
from react-native.
+1 for what? TextInput π
from react-native.
+1 for TextInput
from react-native.
+1 TextInput
from react-native.
+1 for TextInput
from react-native.
+1 Text
from react-native.
+1 for TextInput
from react-native.
+1 for TextInput support, sooo many views for layout already :(
from react-native.
+1 for Text
from react-native.
+1 for TextInput (Pleeeeeease!)
from react-native.
+1 for TextInput, i need create text input group :(
from react-native.
+1 for TextInput
from react-native.
+1 for TextInput and View (RN 0.44)
from react-native.
i opened a request here https://react-native.canny.io/feature-requests/p/add-borderleft-right-top-bottomwidth-to-textinput--on-ios
please vote it =)
from react-native.
+1 for Text
from react-native.
There's way too many +1 comments in this thread, considering the issue was closed a long time ago. If you feel strongly about this being added to TextInput, please send a PR or upvote the entry on Canny: https://react-native.canny.io/feature-requests/p/add-borderwidth-left-right-top-bottom-to-textinput-
If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.
from react-native.
Related Issues (20)
- Sticky views have visual glitches while scrolling in ScrollView HOT 1
- targetSdkVersion 33 to 34 app crash HOT 7
- Error: package com.facebook.react.modules.storage does not exist import com.facebook.react.modules.storage HOT 4
- Heap snapshot throwing `RangeError: Invalid typed array length: -1` on latest chrome version HOT 8
- βοΈ Help us migrate Android tests to AssertJ HOT 23
- Accessibility issue - Android with TalkBack - accessibilityRole="link" is not available when user tries to navigate via links (TalkBack menu)
- App Crash when using ReactNativeFile in apollo upload client HOT 4
- createBundleReleaseJsAndAssets\index.android.bundle:1322:18: warning: the variable "DebuggerInternal" was not declared in function "__shouldPauseOnThrow" typeof DebuggerInternal !== 'undefined' HOT 7
- automaticallyAdjustKeyboardInsets doesn't work in the new arch HOT 2
- App Crashes - On upgrading to Android 14(SDK 34) for "react-native": "0.68.2", HOT 4
- No hot reloading when change font scale
- react-native 0.74.3 new project sync error HOT 3
- Codegen: Int32 generate double on Java HOT 2
- Issue with Top Padding in Text Component on Android (includeFontPadding : false not workingπ₯Ή) HOT 5
- RTL Layout Direction Not Updating after app reload with New React Native Architecture HOT 10
- Unable to handle hardware back press in Brownfield Setup with BackHandler HOT 5
- App could not Build when trying upgrade sdk 33 to 34 HOT 4
- App could not Build when trying upgrade sdk 33 to 34 (Unexpected error during link, AAPT2 aapt2-4.2.2-7147631-linux Daemon) HOT 4
- react native android crashed in the real device when target API level is changed from 33 to 34. HOT 7
- Upgrade pretty-format to 29 HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native.