I have two labels on the opposite sides of a UICollectionViewCell that both have dynamic widths. As seen in the screenshot bellow, the "Cream Cheese" and "$15.79" are automatically overlapping because of their dynamic widths.
I want to keep both of those label's dynamic widths, but if the two come into contact, I want the label on the right of the UICollectionViewCell to be the preferred label. That would mean that the width of the label on the right is minimized depending on the dynamic width of the right label. Does anyone know of any ways to accomplish this?
If you are doing this through Interface Builder, you should have a constraint for horizontal spacing between the two labels...
...and give a higher content compression resistance for the label on the right.
That way, it will expand and the longer label will have a shorter width, just as you'd expect.
Related
I searched a lot about this, couldn't find an answer and I am stuck with this problem for some days already.
I have a UITableView with 3 sections, each one with custom cells (xib). The first section must grow accordingly with one of its labels.
The second one is static, it shows up just an static image and basic height.
The third one is like a comment cell, with UIImageView, labels etc. One of this labels must grow till a limit height.
I managed to show the 3 custom cells, but the first and the second one (which are not static height), show only partially. If I set manually the Height of the row I can see it entirely, but all section cells grow and it is not what I need.
The constraints to auto layout, I keep getting some conflicts but could not find any solution, tried to debug the view stack, no success.
Custom Cell
Constraints of custom cell
Can anyone help me or point me to a direction?
Thanks in advance!
I had the same problem. I solved it like this. Set tableView estimatedRowHeight to minimum row height. Set tableView rowHeight to UITableViewAutomaticDimension.
1) For dynamic cell height - Give the label leading, trailing, top, bottom and height greater than equals to minimum height.
2) For fixed cell height - Give the label leading, trailing, top, bottom and height equals to fixed height whatever you wanted.
By this your dynamic height cells will grow and fixed ones will be fixed. If you did not get what i said then post a sample project with just this custom implementation on git or somewhere else. I will correct it.
Thank you.
I am working on a project with multiple buttons on a viewcontroller and I used autolayout. I want all the buttons to have equal widths and heights and I have horizontal/vertical spacing like this:
The result on multiple devices is like this:
For the example I gave the buttons a background color, but in fact they will be filled with images of all kinds of sizes. I have image assets (#1x/#2x/#3x) for the buttons. For example, the #2x image assets will never be bigger then 100width and 75height (points).
Some of the button images can be changed by the user. So I want the button size to be ‘independent’ of the images inside. The buttons should NOT resize based on the image ‘inside’.
So I want to first(auto)layout the buttons, without the images ‘filling’ the buttons, so that the buttons will have the optimum size for the biggest sized images in my project (for the #2x image assets as mentioned:100width&75height points).
When I autolayout the buttons, and afterwards fill them with the images, xcode ‘wants’ to let me update the frames because of misplaced views. I do NOT want the images affecting the autolayout.
If I just run the app on the simulator or on a real iphone, it runs fine. But I have all these misplaced views warnings. What should I do? How will I 'tell' Xcode(7.1) that the images should NOT affect the width and heights of the buttons?
I have the feeling I have a slightly wrong approach to this (auto)layout problem, but I can not yet put my finger on it. I think I make some kind of logical error.
Is it good practice to first (auto)layout the buttons and then ‘fill’ with the images? Or should I fill the buttons with the images and then (auto)layout?
Here an example with images which are of equal widths and heights:
Regarding the earlier question about conflicting constraint:
So I want these buttons to have equal width and heights: ideally 100width and 75height in points. The width will be alright, but the heights is somewhat difficult when I am using autolayout for different sized viewcontrollers (with a scrollview on it). I want to use additional constraints that 'says'; the buttons should NOT have a height value lower then 75 points. If I use a fixed height constraint, with 'equal or higher then' 75 points I get a conflict with the equal heights constraints (off course). I guess I should work with priorities, but I tried, and I did NOT succeed yet with it.
How should I proceed?
Help is much appreciated!
Question 1:
Of course you're getting a conflict when setting two height constraints of which one computes to 1/3 of the screen width (≈ 107px excluding padding on the iPhone 4) and the other enforces a minimum height that is bigger than this value (e.g. 120px).
Fortunately there's a way out of this using priorities:
Set the fixed height constraint's priority to a value below the priority of your 'greater or equal' constraint. This way autolayout will choose the fixed height constraint only if its constant is greater or equal to the constant of your 'greater or equal' constraint. Otherwise the constant of your 'greater or equal' constraint will be used as the view's height. Makes sense, right? :)
Question 2:
You can achieve the desired behavior as described in your second question by enforcing a fixed height and width for your image view and setting its content mode to "Aspect Fit". In Interface Builder there's a drop down menu for that:
In your case the best way to give the image view fixed dimensions is to pin all four sides to its superview (because the superview has a well-defined size):
So when you apply these leading, trailing, top and bottom constraints to all your image views the images will automatically resized according to the constraints and the result will look like this:
This is somewhat hard to explain, but basically I have one label in a tableView group that needs to take up the width of the group and placed at the top. I want to add a second label at the bottom of the group and take up the width of the group as well. However, I cannot do this. When I add my second label it gets pushed to the right automatically. Seems, the second label can't be on the same horizontal plane as the first label. Is there a way to resolve this. I can place my second label at the bottom, but it just gets pushed off to the right and off screen.
Add both labels to the group and then, set in that group vertical Layout (Attached screenshot). Also both labels should have width: relative to container
If you look at the group's settings in Interface Builder, you'll see an option to change the layout type to Vertical, rather than the default Horizontal. That should help you achieve the layout you're looking for, if I understand correctly.
I have an NSView with a number of subviews (e.g. NSLabel). I want these subviews to be aligned in a row, but if the parent view doesn't have enough width, I want the subviews to be wrapped to the lower leftmost space - just like words in English text when the line cannot fit them all.
I thought it can be done with Auto Layout, but I can't make it work. When my simple window with two labels and simple horizontal constraints resizes, the labels just overlap each other. Instead, I need the rightmost label to "jump" to the lower leftmost position.
How can it be done? Should I keep researching the Auto Layout feature?
I'm having trouble with autolayout and labels that get their text set in the source code based on some external conditions. These layouts (portrait and landscape) look like this on the simulator:
http://imgur.com/l6Iirun
http://imgur.com/n7RwwSD
The second one is obviously not what I want it to be, the label with the URN should fill the whole screen.
I have a width constraint for the dynamic label added by Xcode which I can't get rid of even though the "Name"-label has a fixed width and all horizontal spaces are fixed as well which should logically rid me of the need to have a width constraint for the label containing the dynamic text.
Any help on how to achieve what I want? Thanks in advance!
It looks to me like your labels are not binding their trailing edge to the superview. In the lower right there is the little 'I beam' icon, click on your label and then that icon, the top of the menu should be 'Pin' and pick trailing edge to superview. The label should expand to fit the width of the screen, minus some padding. Once that is in place you should be able to remove the width constraint - although you may need to find it in the size inspector and select promote to user constraint before you can remove it.
If you don't see the pin menu, try going up to the top and picking Editor -> Pin and you should see it there.
If it is already pinned, try increasing the content compression resistance priority and decreasing the priority of the width - although if pinning it does not fix it then there is another constraint at play.