I did a UIView with UIView embedded inside. I used constraints to get a decent UIView but it is not yet working the way I want even though the result is okay.
I would like to get the same results I have on the iPhone 4.7 inch into the iPhone 5.5 inch and the 4 inch.
For that, I think I need to resize the blue UIViews but I have no clue how to make them auto resize from storyboard nor programmaticaly. I remember a long time ago, I did it for an Android Application and it was easy, I just needed to give a % bigger or lower.
Is there a way to do it with iOS ?
If These are UIViews. Then you can do the following:
Select all the views at once:
Try this. And let me know if some issue arise.
Hope this can help.
I believe ismail's comment is correct, size classes are the correct way to do this in storyboard.
If you are looking for a more programmatic solution, you can implement the sizeForItemAtIndexPath method on UICollectionViewDelegateFlowLayout, for example, you could calculate the width of each device and return the right proportions for each cell using the method mentioned. Basic example:
func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
return CGSize(width:10, height:10)
}
Be sure to account for your collection view spacing and section insets when calculating your widths and heights.
Apple stated that simply selecting all views in the scene, and hitting "Add Missing Constraints" or "Reset to Suggested Constraints." will solve the majority of auto-layout issues. Give that a shot first and foremost. (I'm looking for the source now, will edit answer with it soon).
Then, check out this Apple document on resolving auto-layout issues. It is a short article that will help you understand how to debug what you are trying to do:
https://developer.apple.com/library/ios/recipes/xcode_help-IB_auto_layout/chapters/ResolvinganItemsLayoutIssues.html
You can do it with Autolayout and Size classes. Here are links to great tutorials:
Autolayouts
Size Classes
Related
I got three collectionViews in my application. Now I finished it as far as I wanted it to complete. The only problem which I have for several days now are the constraints. I don't know how to explain it in words so I added two pictures of the problem to the question I hope it's understandable.
What I currently have:
What I want:
Use UICollectionViewDelegateFlowLayout delegate method to archive this.
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
in this method, you can programmatically set size of cells. Give sizes according to your need of each collectionView.
Based on your screenshots, it looks like the collection view holding the column of white dots expands its width when the superview (the screen size) changes.
It also looks like you are using Flow Layout... when the view gets wider there is enough room for 2 cells on each row.
You should be able to fix that by either:
constraining the width of that collection view so it doesn't expand, or
using a custom Collection View Layout
I'd suggest trying a width constraint first - see if you can get the layout to look the way you want.
As a side note... using collection views may not be the best approach for what you're trying to do. UIStackView might be a better option (although, I don't know what else the interface will be doing, so maybe not).
What's the process for doing this?
I've discovered sizeForItemAtIndexPath but I'm not sure what I do in that method. Do I create a new UICollectionViewCell, add in my content, and then return the size of that cell?
Do I need AutoLayout turned on and constraints set? I apologize if this has been answered already. I've been scouring stackoverflow, but haven't quite found a solution that worked.
You need to:
setup Auto Layout constraints on the cell's contentView that, taken all in all, bind the left edge to the right edge, and the top edge to the bottom edge. This is how the cell will express the size it wants to be.
not implement sizeForItemAtIndexPath, since you will not be providing sizes on a per-cell basis.
set estimatedItemSize to some reasonably large value on your UICollectionViewFlowLayout object.
There is a repo with an example.
I am having a heck of a time getting my UICollectionViewCell height to be dynamic based the content inside (in a UILabel element). I've read all over the place about how this is so much easier to do with iOS 8, but I've now spent way to much time trying to figure this out. Hopefully I'm just missing something small. Hopefully...
I was able to sort of make this work by manually setting the height of each cell using this approach (the sizeForItemAtIndexPath part) - calculating it all out based on the text (sizeToFit), but like I said, I've read over and over that it should be 'magic' with Auto Layout and iOS 8, and I shouldn't have to do all that.
So here's my code in the view controller's cellForItemAtIndexPath method:
var cell:LocationCell = collectionView.dequeueReusableCellWithReuseIdentifier("LocationCell", forIndexPath: indexPath) as LocationCell
let thisLocation = fetchedResultsController.objectAtIndexPath(indexPath) as LocationModel
cell.notesLabel.text = thisLocation.notes
cell.notesLabel.sizeToFit()
return cell
Easy enough? right? But each cell is the same height — doesn't matter what the size is notesLabel. Here's what it looks like on the storyboard:
And in the simulator:
As you can see, the height of the UICollectionViewCell is not changing. I've also tried adding the layout property estimatedItemSize in viewDidLoad, but whatever I put in the estimated size, is how all UICollectionViewCells appear.
I can send a github link of any of this is unclear. Really appreciate the help, this has been bothering me for days!!
UIView has sizeThatFits as an extension. I've used it to center-center textfields. The basic concept is to load the view, get the measurements it provides, and then resize/position your containers as you like.
Below is my app when run on iPhone 6 simulator
As you might have guessed it looks good on iPhone 5.
Autoresize is on, but I'm not sure i fully grasp the concept, so i might be missing something.
Any suggestions for a solution are appreciated.
I also added another image for the storyboard structure.
It might be possible as you might have not set layout constraints. The below link will help you how to set constraints. In the below link i've used size class but it is not necessary for you to use sane view, similar constraints can be applied to the storyboard structure you have used.
Hi please visit below link:
iOS 8 Autolayout with Size Classes
Advance auto layout Constraints:
Adjust Center of Measure in Xcode 6
Auto layout is on but you are not using it. You need to add constraints so that when the main view is resized to fit the screen, the table view is resized along with it. Otherwise, it just stays at the same size you designed it (which happens to be the right size for an iPhone 5). These devices are different sizes; the idea of auto layout is to cope with that difference. Use it.
I've set up a UICollectionView (with the default flow layout, and vertical scrolling) with custom cells that load from a xib. The cells contain a couple of elements (a UILabel and a UIView) with constraints on them. I've set up the constraints such that the cell height grows as the label text height increases using the new UICollectionViewFlowLayout property that's available in iOS8, estimatedItemSize:
layout.estimatedItemSize = CGSizeMake(self.collectionView.frame.width, 100)
Everything works like a charm except there's one big problem: the UICollectionView loads only half the items as returned by the numberOfItemsInSection method. So, when the method returns, say, 10, my UICollectionView only displays 5 cells (but displays and lays them out perfectly).
Some relevant findings from my debugging attempts:
I've been able to force the loading of the remaining items by calling invalidateLayout or changing the number of sections from 1 to 2. But those are just debugging hacks.
Separately, everything works like a charm when I replace estimatedItemSize with the itemSize property, i.e. hard-coding the item size. But that defeats the self-sizing functionality I'd like to implement.
I'm assuming there's something wrong with how I'm thinking about self-sized cells. Specifically, I wonder if the problem has something to do with constraints.
I'd appreciate any help here.
I believe this is due to a bug in iOS8 which still exists as of iOS8.3.
Flow layout collection views with self-sizing cells will fail to display some of their content if the estimatedItemSize is too small. This is despite the fact that according to the the API docs the only requirement on the estimatedItemSize is that it be non-zero to trigger the self-sizing behavior.
Only Apple is in a position to fix this. I think the best workaround in the mean time is to put an inflated value into estimatedItemSize`.
This repo demonstrates the issue: https://github.com/algal/SelfSizingCellsDemo. (I've filed a radar at rdar://18078598.)
The obvious non-hacky solution is to implement
flowLayout.collectionView(layout:sizeForItemAtIndexPath:)
but of course that is more code than you presumably have hoped for.
I would suggest you try two more things:
Try to experiment with more plausible estimated sizes. Also try the default value, CGSizeZero.
Check what happens in preferredlLayoutAttributesFittingAttributes() by examining the layoutAttributes parameter. Maybe you find a clue to why the other cells are "crowded out".
In a custom subclass of UICollectionViewFlowLayout
override prepareLayout like so:
- (void)prepareLayout {
[super prepareLayout];
CGSize contentSize = self.collectionView.contentSize;
// Without this line, the scrolling doesn't go all the way to the bottom, right away but takes a while
[super layoutAttributesForElementsInRect:CGRectMake(0.0f, 0.0f, contentSize.width, contentSize.height)];
}
I had this exact same problem.
I was using layout.estimatedItemSize = CGSizeMake(373.0, 500.0) together with
preferredLayoutAttributesFittingAttributes( layoutAttributes: UICollectionViewLayoutAttributes) -> UICollectionViewLayoutAttributes!
and I got exactly the self-sizing behaviour i wanted, except I was only getting half the cells displayed.
The curious thing is when I changed the estimatedItemSize property to: layout.estimatedItemSize = view.bounds.size ALL the cells appear!!
Hope this helps. Good luck.