Visualize pattern on UITextField
up vote
0
down vote
favorite
My goal is to create a text field that matches this picture:
Core idea is that:
- User can't edit pattern symbols (i.e. place cursor there)
- Pattern symbols get replaced and disappear as the user types
- There are static pattern symbols (i.e. '-')
Is there a drop-in solution for such things? I've searched over GitHub and there are a lot of libs that do UITextField formatting, but they usually just add symbols and it doesn't actually feel like a placeholder that guides user how to type.
Any suggestions?
ios uitextfield uikit
add a comment |
up vote
0
down vote
favorite
My goal is to create a text field that matches this picture:
Core idea is that:
- User can't edit pattern symbols (i.e. place cursor there)
- Pattern symbols get replaced and disappear as the user types
- There are static pattern symbols (i.e. '-')
Is there a drop-in solution for such things? I've searched over GitHub and there are a lot of libs that do UITextField formatting, but they usually just add symbols and it doesn't actually feel like a placeholder that guides user how to type.
Any suggestions?
ios uitextfield uikit
What have you tried so far?
– Carpsen90
Nov 10 at 20:15
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
My goal is to create a text field that matches this picture:
Core idea is that:
- User can't edit pattern symbols (i.e. place cursor there)
- Pattern symbols get replaced and disappear as the user types
- There are static pattern symbols (i.e. '-')
Is there a drop-in solution for such things? I've searched over GitHub and there are a lot of libs that do UITextField formatting, but they usually just add symbols and it doesn't actually feel like a placeholder that guides user how to type.
Any suggestions?
ios uitextfield uikit
My goal is to create a text field that matches this picture:
Core idea is that:
- User can't edit pattern symbols (i.e. place cursor there)
- Pattern symbols get replaced and disappear as the user types
- There are static pattern symbols (i.e. '-')
Is there a drop-in solution for such things? I've searched over GitHub and there are a lot of libs that do UITextField formatting, but they usually just add symbols and it doesn't actually feel like a placeholder that guides user how to type.
Any suggestions?
ios uitextfield uikit
ios uitextfield uikit
edited Nov 10 at 20:52
rmaddy
237k27308374
237k27308374
asked Nov 10 at 19:49
s1ddok
3,65611022
3,65611022
What have you tried so far?
– Carpsen90
Nov 10 at 20:15
add a comment |
What have you tried so far?
– Carpsen90
Nov 10 at 20:15
What have you tried so far?
– Carpsen90
Nov 10 at 20:15
What have you tried so far?
– Carpsen90
Nov 10 at 20:15
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
If you want Xs to disappear and be replaced by digits one by one (and not by whole four-digit groups), you should add not four (as Robert Dresler suggests), but sixteen UITextField
s with X placeholder in each of them.
Make the cursor jump to the next field once the current one is filled, and also make it jump to the first field that’s not filled when the user taps on any of the fields (to prevent inputting digits in random positions).
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use thetextField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.
– Yakov M.
Nov 11 at 12:01
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',
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%2f53242793%2fvisualize-pattern-on-uitextfield%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
up vote
0
down vote
If you want Xs to disappear and be replaced by digits one by one (and not by whole four-digit groups), you should add not four (as Robert Dresler suggests), but sixteen UITextField
s with X placeholder in each of them.
Make the cursor jump to the next field once the current one is filled, and also make it jump to the first field that’s not filled when the user taps on any of the fields (to prevent inputting digits in random positions).
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use thetextField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.
– Yakov M.
Nov 11 at 12:01
add a comment |
up vote
0
down vote
If you want Xs to disappear and be replaced by digits one by one (and not by whole four-digit groups), you should add not four (as Robert Dresler suggests), but sixteen UITextField
s with X placeholder in each of them.
Make the cursor jump to the next field once the current one is filled, and also make it jump to the first field that’s not filled when the user taps on any of the fields (to prevent inputting digits in random positions).
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use thetextField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.
– Yakov M.
Nov 11 at 12:01
add a comment |
up vote
0
down vote
up vote
0
down vote
If you want Xs to disappear and be replaced by digits one by one (and not by whole four-digit groups), you should add not four (as Robert Dresler suggests), but sixteen UITextField
s with X placeholder in each of them.
Make the cursor jump to the next field once the current one is filled, and also make it jump to the first field that’s not filled when the user taps on any of the fields (to prevent inputting digits in random positions).
If you want Xs to disappear and be replaced by digits one by one (and not by whole four-digit groups), you should add not four (as Robert Dresler suggests), but sixteen UITextField
s with X placeholder in each of them.
Make the cursor jump to the next field once the current one is filled, and also make it jump to the first field that’s not filled when the user taps on any of the fields (to prevent inputting digits in random positions).
edited Nov 10 at 22:15
answered Nov 10 at 22:09
Yakov M.
185
185
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use thetextField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.
– Yakov M.
Nov 11 at 12:01
add a comment |
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use thetextField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.
– Yakov M.
Nov 11 at 12:01
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Oh, and what do I do when user removes character? I hove to kinda move everything from next text fields?
– s1ddok
Nov 11 at 7:46
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use the
textField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.– Yakov M.
Nov 11 at 12:01
Yes, when the user deletes a character, you should move the cursor to the previous text field. I believe you can use the
textField(_:shouldChangeCharactersIn:replacementString:)
delegate method for detecting when the user types or deletes characters.– Yakov M.
Nov 11 at 12:01
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.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- 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%2f53242793%2fvisualize-pattern-on-uitextfield%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
What have you tried so far?
– Carpsen90
Nov 10 at 20:15