How to show Custom View on the top of the keyboard in react-native
I am developing sample app, where I need a separate over which should be placed on the keyboard that appears when click on textInput.
I tried giving absolute position, zIndex everything but it is not worked.
So can anyone tell me how to do that.
I am doing this for custom keyboard some modules did not gave me correct once so I preferred this.
react-native keyboard textinput
edited Nov 14 '18 at 9:17
Lavaraju
8811725
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
add a comment |
I am developing sample app, where I need a separate over which should be placed on the keyboard that appears when click on textInput.
I tried giving absolute position, zIndex everything but it is not worked.
So can anyone tell me how to do that.
I am doing this for custom keyboard some modules did not gave me correct once so I preferred this.
react-native keyboard textinput
edited Nov 14 '18 at 9:17
Lavaraju
8811725
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
add a comment |
I am developing sample app, where I need a separate over which should be placed on the keyboard that appears when click on textInput.
I tried giving absolute position, zIndex everything but it is not worked.
So can anyone tell me how to do that.
I am doing this for custom keyboard some modules did not gave me correct once so I preferred this.
react-native keyboard textinput
edited Nov 14 '18 at 9:17
Lavaraju
8811725
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
I am developing sample app, where I need a separate over which should be placed on the keyboard that appears when click on textInput.
I tried giving absolute position, zIndex everything but it is not worked.
So can anyone tell me how to do that.
I am doing this for custom keyboard some modules did not gave me correct once so I preferred this.
react-native keyboard textinput
react-native keyboard textinput
edited Nov 14 '18 at 9:17
Lavaraju
8811725
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
edited Nov 14 '18 at 9:17
Lavaraju
8811725
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
edited Nov 14 '18 at 9:17
Lavaraju
8811725
edited Nov 14 '18 at 9:17
Lavaraju
8811725
edited Nov 14 '18 at 9:17
Lavaraju
8811725
8811725
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
asked Nov 14 '18 at 9:11
krishna swaroopa Ikrishna swaroopa I
8619
8619
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Each platform - iOS / android - has its very specific APIs regarding Keyboard display, and customization.
The amount of customization you can do on existing keyboard is limited (ex: suggestion fields on top of the keyboard on iOS...), if you really want something specific, you might want to develop your own keyboard (look at https://github.com/reactnativecn/react-native-custom-keyboard the repo is 2 years old but might give you good inspiration, this other one is more recent : https://github.com/wix/react-native-keyboard-input)
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
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%2f53296543%2fhow-to-show-custom-view-on-the-top-of-the-keyboard-in-react-native%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
Each platform - iOS / android - has its very specific APIs regarding Keyboard display, and customization.
The amount of customization you can do on existing keyboard is limited (ex: suggestion fields on top of the keyboard on iOS...), if you really want something specific, you might want to develop your own keyboard (look at https://github.com/reactnativecn/react-native-custom-keyboard the repo is 2 years old but might give you good inspiration, this other one is more recent : https://github.com/wix/react-native-keyboard-input)
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
add a comment |
Each platform - iOS / android - has its very specific APIs regarding Keyboard display, and customization.
The amount of customization you can do on existing keyboard is limited (ex: suggestion fields on top of the keyboard on iOS...), if you really want something specific, you might want to develop your own keyboard (look at https://github.com/reactnativecn/react-native-custom-keyboard the repo is 2 years old but might give you good inspiration, this other one is more recent : https://github.com/wix/react-native-keyboard-input)
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
add a comment |
Each platform - iOS / android - has its very specific APIs regarding Keyboard display, and customization.
The amount of customization you can do on existing keyboard is limited (ex: suggestion fields on top of the keyboard on iOS...), if you really want something specific, you might want to develop your own keyboard (look at https://github.com/reactnativecn/react-native-custom-keyboard the repo is 2 years old but might give you good inspiration, this other one is more recent : https://github.com/wix/react-native-keyboard-input)
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
Each platform - iOS / android - has its very specific APIs regarding Keyboard display, and customization.
The amount of customization you can do on existing keyboard is limited (ex: suggestion fields on top of the keyboard on iOS...), if you really want something specific, you might want to develop your own keyboard (look at https://github.com/reactnativecn/react-native-custom-keyboard the repo is 2 years old but might give you good inspiration, this other one is more recent : https://github.com/wix/react-native-keyboard-input)
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
answered Nov 14 '18 at 9:30
VinzzzVinzzz
10.5k42938
10.5k42938
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
add a comment |
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
Yes I have those module I don't want any default keyboard coming up but when using them for first time I am getting custom keyboard but when again focusing then the default keyboard is appearing.
– krishna swaroopa I
Nov 14 '18 at 10:24
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
github.com/reactnativecn/react-native-custom-keyboard this repo is not at all working and its throwing build erros in ios and android
– krishna swaroopa I
Nov 15 '18 at 4:33
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%2f53296543%2fhow-to-show-custom-view-on-the-top-of-the-keyboard-in-react-native%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
