react-native-elements, help center input text within FormInput
I'm using forms from react-native-elements and would like to center the input text. I've tried, alignSelf: 'center'
as well as flex: 1, justifyContent: 'center', alignItems: 'center'
without any luck. All text continues to remain left aligned.
JFYI, I'm making adjustments to the inputStyle
prop.
<FormInput
...
inputStyle={styles.formInputText}
/>
react-native react-native-elements
add a comment |
I'm using forms from react-native-elements and would like to center the input text. I've tried, alignSelf: 'center'
as well as flex: 1, justifyContent: 'center', alignItems: 'center'
without any luck. All text continues to remain left aligned.
JFYI, I'm making adjustments to the inputStyle
prop.
<FormInput
...
inputStyle={styles.formInputText}
/>
react-native react-native-elements
add a comment |
I'm using forms from react-native-elements and would like to center the input text. I've tried, alignSelf: 'center'
as well as flex: 1, justifyContent: 'center', alignItems: 'center'
without any luck. All text continues to remain left aligned.
JFYI, I'm making adjustments to the inputStyle
prop.
<FormInput
...
inputStyle={styles.formInputText}
/>
react-native react-native-elements
I'm using forms from react-native-elements and would like to center the input text. I've tried, alignSelf: 'center'
as well as flex: 1, justifyContent: 'center', alignItems: 'center'
without any luck. All text continues to remain left aligned.
JFYI, I'm making adjustments to the inputStyle
prop.
<FormInput
...
inputStyle={styles.formInputText}
/>
react-native react-native-elements
react-native react-native-elements
asked Jan 2 at 0:10
Mix Master MikeMix Master Mike
147214
147214
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Try the textAlign
attribute
<FormInput
...
inputStyle={styles.formInputText}
textAlign={'center'}
/>
Also, you may want to upgrade your package as it looks like FormInput
has been deprecated according to the docs...
<FormInput />
is only available in v0.19.1 and below.<Input />
is only
available inv1.0.0-beta1
and higher.
Awesome. That did the trick! I also ended up usingalignSelf: 'center'
to get it truly in the center.
– Mix Master Mike
Jan 2 at 0:50
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53999950%2freact-native-elements-help-center-input-text-within-forminput%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Try the textAlign
attribute
<FormInput
...
inputStyle={styles.formInputText}
textAlign={'center'}
/>
Also, you may want to upgrade your package as it looks like FormInput
has been deprecated according to the docs...
<FormInput />
is only available in v0.19.1 and below.<Input />
is only
available inv1.0.0-beta1
and higher.
Awesome. That did the trick! I also ended up usingalignSelf: 'center'
to get it truly in the center.
– Mix Master Mike
Jan 2 at 0:50
add a comment |
Try the textAlign
attribute
<FormInput
...
inputStyle={styles.formInputText}
textAlign={'center'}
/>
Also, you may want to upgrade your package as it looks like FormInput
has been deprecated according to the docs...
<FormInput />
is only available in v0.19.1 and below.<Input />
is only
available inv1.0.0-beta1
and higher.
Awesome. That did the trick! I also ended up usingalignSelf: 'center'
to get it truly in the center.
– Mix Master Mike
Jan 2 at 0:50
add a comment |
Try the textAlign
attribute
<FormInput
...
inputStyle={styles.formInputText}
textAlign={'center'}
/>
Also, you may want to upgrade your package as it looks like FormInput
has been deprecated according to the docs...
<FormInput />
is only available in v0.19.1 and below.<Input />
is only
available inv1.0.0-beta1
and higher.
Try the textAlign
attribute
<FormInput
...
inputStyle={styles.formInputText}
textAlign={'center'}
/>
Also, you may want to upgrade your package as it looks like FormInput
has been deprecated according to the docs...
<FormInput />
is only available in v0.19.1 and below.<Input />
is only
available inv1.0.0-beta1
and higher.
answered Jan 2 at 0:42
Chris GeirmanChris Geirman
6,94442455
6,94442455
Awesome. That did the trick! I also ended up usingalignSelf: 'center'
to get it truly in the center.
– Mix Master Mike
Jan 2 at 0:50
add a comment |
Awesome. That did the trick! I also ended up usingalignSelf: 'center'
to get it truly in the center.
– Mix Master Mike
Jan 2 at 0:50
Awesome. That did the trick! I also ended up using
alignSelf: 'center'
to get it truly in the center.– Mix Master Mike
Jan 2 at 0:50
Awesome. That did the trick! I also ended up using
alignSelf: 'center'
to get it truly in the center.– Mix Master Mike
Jan 2 at 0:50
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53999950%2freact-native-elements-help-center-input-text-within-forminput%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown