Adding UITextField inline UILabel (Fill in the blanks)

Question

I am trying to achieve something like this for iOS in Objective C.

The fill in the blanks(UITextField) should be inline, and should be able to have its own inputType.

Also, each View is a type of cell.contentView of a UITableViewCell.

My current approach is to find the length of string and also calculate the wrapping content length to the next line. Calculate the x's and y's for UITextField and add another UILabel after the UTextField

Is there any other approach other than this?

Currently I am trying with Glyphs, TextView Containers and NSLayoutManagers.But have seen little success. Can anyone help? — Dheeraj Jami, Sep 22 '15 at 21:09
I think UIStackView would be perfect for this use case (for ios9). I think it is possible to add multiple labels and textview containers into a horizontal stack. When the width reaches a maximum length, then do move them to a vertical UIStackView for a new line. You can also keep an array for the textviews for reference. NOTE: This is just an idea, unproven concept — Francis Yeap, Sep 25 '15 at 10:14

score 3 · Answer 1 · answered Sep 25 '15 at 11:55

As EmilioPelaez says, this is not exactly an answer to your question, but a suggestion:

You can use a collection view with an horizontal flow for each "sequence" (i.e. UILabel-UItextfield-etc...)

That collection view has 2 kind of cell:

One with a uilabel with the number of line set to "1" and the correct layout to fit the cell.
Another with a uitextfield and the correct layout

Coupled with:

My current approach is to find the length of string and also calculate the wrapping content length to the next line.

You may be able to easily adjust the width of the different cells, hide a uitextfield (if needed) and display a more dynamic "sequence" (if needed)

score 1 · Answer 2 · edited May 23 '17 at 11:51

1

This is not exactly an answer to your question, instead it's a suggestion for a different interaction.

I think that instead of using inline textFields, you could use a UILabel with an attributed string, and in where the textFields would be, you add a different character with a different color that you can tap (For example, this character ✚).

When tapped, you can show an overlay with a text input, and once that input is completed, you update the label with the text (still tappable, and with a different color).

I think this answer might also be relevant: Detecting taps on attributed text in a UITextView in iOS

edited May 23 '17 at 11:51

Community

1
1

answered Sep 21 '15 at 22:28

EmilioPelaez

18,758
6
46
50

so we are just adding action to attributedStringCharacters and adding an overlay for text input? – Dheeraj Jami Sep 22 '15 at 15:43
Detecting taps on attributed text doesn't work for more than one attributed text in iOS 9 – Dheeraj Jami Sep 24 '15 at 16:56

score 0 · Answer 3 · answered Oct 01 '15 at 06:16

I think your solution of separating the UILabels and calculating their required positions is a good one for versions lower than iOS9, but if you can count on iOS, UIStackView can dramatically simplify the process for you. You can read more about the process in this tutorial: UIStackView Tutorial

Good luck!

Adding UITextField inline UILabel (Fill in the blanks)

3 Answers3