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?
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)
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
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!
Related
Is it possible to create a UILabel subclass that automatically updates its text based on whether it has enough space or not? Similar to the way the label can add ellipses.
I would like to create two properties preferredText and alternateText and have the label select automatically between the two based on the amount of space it has available. So, I could do something like preferredText = #"Count text: 1024"; alternateText = #"1024";.
I've looked at intrinsicContentSize of course, but I think that should always return a value based on preferredText. I also looked at overriding systemLayoutSizeFittingSize and systemLayoutSizeFittingSize:... but these methods are never called during autolayout. I also tried overriding layoutSubviews, but at that point the system has already decided how big it wants the label to be. Changing the text there can result in an infinite loop.
Ideally I would like a generalized solution that I could apply to other view types as well. For example, a custom uibutton might choose a different image if there is not sufficient space.
You would need to look at the preferred text and the size of the label, and then look at the required size for the text (easily done using boundingRectWithSize...) and see whether it will fit. Depending what you learn, you would then assign the preferred text or the alternate text.
(It would be better, however, to allow the label to resize itself depending on its text, which is what it wants to do automatically anyway. Or you could take advantage of the fact that a label is happy to shrink its font size if that's what it takes to make the text fit.)
I have a UITextField that will represent an integer number with a fraction (numerator and denominator). As an example: "27 3/16". I want to make the denominator "/16" at the end both un-editable and also un-selectable.
I can use the delegate method textField:shouldChangeCharactersInRange:replacementString: to prevent the "/16?" from being edited with an approach a bit like this.
Is there some way that I can also prevent the "/16" from being selectable at all? So, the caret can't be moved in to it, and the selection marque can't be made around it.
If this isn't possible, is there a hook so that once the user finishes placing their selection, I can update the selection and move the caret to just before this piece of the text.
Thanks.
You can have a UILabel and UITextField constrained via autolayout next to each other, the UILabel containing the denumerator and the UITextField the numerator.
Here is an answered question for how to do that: Using Auto Layout to have UILabel and UITextField next to each other (the essence is, you need to adjust the content hugging priority of the UITextField to make it always as wide as the contained text.
If your text field gets too small to be tapped, you can apply the code of this answer to a UITextView and make the tappable area of your view bigger: UIButton: Making the hit area larger than the default hit area (but better use method swizzling than overriding a method in a category like in the answer! Or a subclass.)
I am trying to repduce a similar sort of layout as in the screenshot below from the Digg app..
Notice that each list entry has a title in bold followed by the source, posted time and finally if there is enough space the start of the description line.
The question is what is the best way to achieve this in iOS? With some posts having longer titles than others I cannot simply say that the title label is 40px high and then place the Source label at 45 as the title will sometimes be longer and sometimes shorter.
Do I have to calculate the height of the label based on its contents before arranging the layout or is there some better way of doing this in iOS so that the views 'below' are automatically moved down?
Another alternative would be some sort of rich text label that I could add all the text to and have it automatically wrap round moving the later text down but I cannot find any sort of control in standard iOS / Xamarin (MonoTouch).
Any pointers would be greatly appreciated?
If you are using a storyboard the simplest way to achieve this result is to define different prototype cells. For example, you could define four different prototype cells, each one with a different layout like those shown in the example picture you provided. You can dequeue the appropriate cell based on the content you want to display so there is no need to adjust the layout in the code.
If you are doing everything in code, it's a lot more complicated since you have to build your own "layout engine" to adjust size and position of the views in your cell. You can have a look at XibFree or use MonoTouch.Dialog as suggested in the comments.
In our application we are showing the segmented control with dynamic segments.
If number of segments is 2-3 we have no issue, but if number of segments is 5 or more than that then the text in segment is not readable.
See the above image.
So, what is the alternate way to resolve this issue?
There are a couple of solutions.
You could use a UIPickerView instead of a UISegmentedControl
You could show three segments, where the first two segments are the most often used segments, and touching the third segment shows a UIPickerView with all the options.
You could embed the UISegmentedControl in a UIScrollView. Make sure to size your segmented control in a way that shows that it is indeed scrollable.
Which one fits best depends on your app, and what is the actual use of those segments.
It's hard to answer this question on a general basis. Apple's Human Interface Guidlines may be a good reference for this kind of issues.
The best Solution is that add ScrollView in you view controller and add UISegmentController to UIScrollView and give fix size of your segment button and change size of UISegmentController Base on total numbers of button and also change content size of UIScrollView base on UISegmentController.
try setting font size for the test to be smaller, that ways, the text will be more visible.
However, if your number of segments keep increasing, that wouldn't be a solution
(please forgive my english)
I'm new at IOS developing but I've a good skill on other programming languages (mainly c#).
I'm trying to develop a test app with a main window.
Inside that window there is a scrollview with fixed size. inside that scrollviewer there is a view containing some stacked couples of one TextField and one Label: I can't know - ad design time - how many "rows" of them I have to put into.
My problems is:
I can put on the view the first couple (a textfield and, next, a label). Label size can be one or several rows high ,so I've to set multiline and sizeToFit
How can I put the second couple (and so on) without overlap the existing labels..? I can't use a table because between rows there are other labels (title of section).
Do I have to calculate the height of each label and programmatically calculate where to draw the next? Is there a more efficient way?
I don't need code, please just some hints or some keyword to googling on.
Many thanks.
I don't see why you can't use a UITableView, you can set up cells with all the controls you need in it. Either way, using a UITableview won't make the job any easier (just more memory efficient if you have many rows).
The only way that I see is, as you said, to calculate where the next 'row' should be placed (depending on the height of your previous rows). You'll also need to calculate the entire height, in order to set it to the contentSize of the UIScrollView.
Instead of UILabel you can also use a non editable UITextView, since it'll be easier to get its size (after you set the text, you can set the size of a UITextView to be equal to its contentSize)