I implemented a UICollectionView with horizontal scrolling. My cells are simply thumbnails (UIImageView) with a size of 50x50.
let cvLayout = UICollectionViewFlowLayout()
cvLayout.sectionInset = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10)
cvLayout.itemSize = CGSize(width: 50, height: 50)
cvLayout.scrollDirection = .horizontal
All works fine, as long as the UICollectionView's height is above ca. 100. If I set its height any lower, the images don't appear anymore and the view looks messed up. I tried playing around with all available settings, nothing changes this.
Does the UICollectionView have a minimum height requirement or is this something I could solve with a Custom Layout?
I appreciate any hint!
Grasping a straws a little unless you update the question for more detail. I am going to say it is one of two things. But most likely the first.
1) You build your layout like in the current question but you never assign it.
let cvLayout = UICollectionViewFlowLayout()
cvLayout.sectionInset = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10)
cvLayout.itemSize = CGSize(width: 50, height: 50)
cvLayout.scrollDirection = .horizontal
//possibly not assigning it
collectionView.collectionViewLayout = cvLayout
2) you don't have constraints on your imageview but my guess is this is not the case.
Again, I am just taking a stab at it. If you comment below if neither of these fix the issue I will update the answer provided I have more information. I can set the height to 50 and it fits perfect.
Related
I want to create layout for following layout inside collection view.
Align one cell in centre and two cell outside with scale down using transform.
I have used third party library DXScaleFlowLayout and implemented following code to make like same.
let scaleLayout = DXScaleFlowLayout()
scaleLayout.transformScale = 0
scaleLayout.isPagingEnabled = true
scaleLayout.minimumAlpha = 0.8
scaleLayout.minimumLineSpacing = 0
scaleLayout.minimumInteritemSpacing = 0
let width = self.cvBusinessPlans.bounds.width
let height = self.cvBusinessPlans.bounds.height
scaleLayout.itemSize = CGSize(width: width, height: height)
scaleLayout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
self.cvBusinessPlans.collectionViewLayout = scaleLayout
But it didn't work for me. If anyone know how to make this then please help. I have search of SOF, but I can't find exact or similar solution.
I have been using MessageKit for my live chat feature for my application. One of the issues I am running into is that long messages just look very weird on the screen as the width of the bubbles doesn't seem to be restricted. I wanted to figure out a way to be able to set the maximum width of the chat bubbles so that they format more like a text conversation on the native imessage application.
Currently my messages look like this, but I would want the message below to be less wide and taller:
You can adjust the right/left padding for incoming/outgoing messages respectively.
The default padding is:
public var incomingMessagePadding = UIEdgeInsets(top: 0, left: 4, bottom: 0, right: 30)
public var outgoingMessagePadding = UIEdgeInsets(top: 0, left: 30, bottom: 0, right: 4)
And you can set the padding on the layout object in your messages view controller like this:
let layout = messagesCollectionView.collectionViewLayout as? MessagesCollectionViewFlowLayout
layout?.setMessageIncomingMessagePadding(UIEdgeInsets(top: 0, left: 4, bottom: 0, right: 50))
layout?.setMessageOutgoingMessagePadding(UIEdgeInsets(top: 0, left: 60, bottom: 0, right: 4))
You can see more examples of layout changes in the AdvancedExampleViewController in the MessageKit example project.
It seems that the library that you are using has already a width set, but in my chat (which is customised) I have a greater than or equal than 0 width constraint a a less than or equal than MAX_WIDTH constraint a leading constraint = 0 and a 'trailing constraint = 0' and those last two I get rid of the leading or trailing depending on if it is the sender or receiver of the message.
I want to inset the table view separator by 10 points from the current automatic inset so it respects the safe area etc. but when I set it in the storyboard it doesn't work as documented.
Turns out the settings in the storyboard are not being respected.
When I added the settings in code then it worked as expected.
tableView.separatorInsetReference = .fromAutomaticInsets
tableView.separatorInset = .init(top: 0, left: 10, bottom: 0, right: 0)
I want to put scrollViewIndicator just a bit more outside(right) of scrollView. But It doesn't go even if I set self.mainMenuCollectionView.scrollIndicatorInsets = UIEdgeInsetsMake(0, 10, 0, 0);. It might because of inset works as padding and not going out of bounds of scrollView. It stays in the border.
It works for putting indise(left) of the view.
It would be really helpful if you know how can I achieve that.
N: normal
S: It is possible
W: How I want
You need to setup opposite side with minus sign like:
self.mainMenuCollectionView.scrollIndicatorInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: -10)
Don't forget disable clipsToBounds for getting visible subviews outside:
self.mainMenuCollectionView.clipsToBounds = false
I'm having trouble figuring out how to lay out views in Swift Playgrounds for iPad, though this may also be relevant to Mac users.
The following code should create a view with a red square (also a view) that is near the edges of its' super view, but not touching them.
let v = UIView(frame: CGRect(x: 0, y: 0, width: 500, height: 500))
let sqv = UIView(frame: CGRect(x: 400, y: 400, width: 50, height: 50))
sqv.backgroundColor = .red
v.addSubview(sqv)
PlaygroundPage.current.liveView = v
The result is not what you'd expect:
I suspect I know what is going on here; live views are at a fixed size that is larger than the display area. Some characteristics of the view are ignored when it is acting as the live view. However, I can't find where this is mentioned in the documentation, which vexes me. More importantly, how do I deal with this? I would like to be able to layout simple UIs that change to fit the current size of the live view. I don't know how to address this issue without trial & error and hardcoding, which are two things I would really like to avoid.
I suspect I know what is going on here; live views are at a fixed size that is larger than the display area.
Actually it's more like the other way around. An iPad screen is 1024 points wide (in landscape orientation). The right-hand pane (where it shows your live view) is 512 points wide. The playground forces your root view (v) to fill that pane, inset by 40 points on the left, right, and top (and more on the bottom). So your root view's width is forced to 432 ( = 512 - 2 * 40), less than the 500 you specified.
Views created in code (like yours) have translatesAutoresizingMaskIntoConstraints = true, and a resizing mask of 0, which means don't adjust the view's frame at all when its parent is resized. So the playground resizes your root view to width 432, but your root view doesn't move or resize its subview (sqv).
The easiest fix is to set the autoresizing mask of the subview to express your intent that it remain near the right and bottom edges of the root view. That means it should have flexible top and left margins:
let v = UIView(frame: CGRect(x: 0, y: 0, width: 500, height: 500))
let sqv = UIView(frame: CGRect(x: 400, y: 400, width: 50, height: 50))
sqv.autoresizingMask = [.flexibleLeftMargin, .flexibleTopMargin]
sqv.backgroundColor = .red
v.addSubview(sqv)
PlaygroundPage.current.liveView = v
Result:
let sqv = UIView(frame: CGRect(x: UIScreen.mainScreen().bounds.width-50-1, y:400, width: 50, height: 50))
The above code places your subview 1 point away from the right of the main view. Try changing the value 1 after 50 in x to desired value.