Use two columns for trending links/accounts on wide screens

This commit is contained in:
Shadowfacts 2023-09-29 17:33:18 -04:00
parent ad4e112e96
commit 5be8005e24
3 changed files with 50 additions and 28 deletions

View File

@ -13,33 +13,39 @@ extension NSCollectionLayoutSection {
// The .readableContent insets reference has a bunch of weird behavior, // The .readableContent insets reference has a bunch of weird behavior,
// so just calculate the content inset ourselves. // so just calculate the content inset ourselves.
func readableContentInset(in environment: NSCollectionLayoutEnvironment) { func readableContentInset(in environment: NSCollectionLayoutEnvironment) {
let maxWidth: CGFloat guard let maximumReadableWidth = environment.maximumReadableWidth else {
switch environment.traitCollection.preferredContentSizeCategory {
case .extraSmall:
maxWidth = 560
case .small:
maxWidth = 600
case .medium:
maxWidth = 632
case .large:
maxWidth = 664
case .extraLarge:
maxWidth = 744
case .extraExtraLarge:
maxWidth = 816
case .extraExtraExtraLarge:
maxWidth = 896
case .accessibilityMedium:
maxWidth = 1096
default:
// greater accessibility sizes don't have a limit
return return
} }
let inset = max(0, (environment.container.contentSize.width - maximumReadableWidth) / 2)
let inset = max(0, (environment.container.contentSize.width - maxWidth) / 2)
// make sure not to overwrite the vertical insets, which are non-zero for grouped styles // make sure not to overwrite the vertical insets, which are non-zero for grouped styles
contentInsets.leading = inset contentInsets.leading = inset
contentInsets.trailing = inset contentInsets.trailing = inset
} }
} }
extension NSCollectionLayoutEnvironment {
var maximumReadableWidth: CGFloat? {
switch traitCollection.preferredContentSizeCategory {
case .extraSmall:
return 560
case .small:
return 600
case .medium:
return 632
case .large:
return 664
case .extraLarge:
return 744
case .extraExtraLarge:
return 816
case .extraExtraExtraLarge:
return 896
case .accessibilityMedium:
return 1096
default:
// greater accessibility sizes don't have a limit
return nil
}
}
}

View File

@ -46,9 +46,17 @@ class SuggestedProfilesViewController: UIViewController, CollectionViewControlle
case .accounts: case .accounts:
let size = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .estimated(280)) let size = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .estimated(280))
let item = NSCollectionLayoutItem(layoutSize: size) let group: NSCollectionLayoutGroup
let item2 = NSCollectionLayoutItem(layoutSize: size) if let maximumReadableWidth = environment.maximumReadableWidth,
let group = NSCollectionLayoutGroup.vertical(layoutSize: size, subitems: [item, item2]) environment.container.contentSize.width >= maximumReadableWidth {
let width = (environment.container.contentSize.width - 48) / 2
group = .horizontal(layoutSize: size, subitems: [
NSCollectionLayoutItem(layoutSize: .init(widthDimension: .absolute(width), heightDimension: .estimated(280))),
NSCollectionLayoutItem(layoutSize: .init(widthDimension: .absolute(width), heightDimension: .estimated(280))),
])
} else {
group = .vertical(layoutSize: size, subitems: [NSCollectionLayoutItem(layoutSize: size)])
}
group.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 16, bottom: 0, trailing: 16) group.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 16, bottom: 0, trailing: 16)
group.interItemSpacing = .fixed(16) group.interItemSpacing = .fixed(16)
let section = NSCollectionLayoutSection(group: group) let section = NSCollectionLayoutSection(group: group)

View File

@ -50,9 +50,17 @@ class TrendingLinksViewController: UIViewController, CollectionViewController {
case .links: case .links:
let size = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .estimated(280)) let size = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .estimated(280))
let item = NSCollectionLayoutItem(layoutSize: size) let group: NSCollectionLayoutGroup
let item2 = NSCollectionLayoutItem(layoutSize: size) if let maximumReadableWidth = environment.maximumReadableWidth,
let group = NSCollectionLayoutGroup.vertical(layoutSize: size, subitems: [item, item2]) environment.container.contentSize.width >= maximumReadableWidth {
let width = (environment.container.contentSize.width - 48) / 2
group = .horizontal(layoutSize: size, subitems: [
NSCollectionLayoutItem(layoutSize: .init(widthDimension: .absolute(width), heightDimension: .estimated(280))),
NSCollectionLayoutItem(layoutSize: .init(widthDimension: .absolute(width), heightDimension: .estimated(280))),
])
} else {
group = .vertical(layoutSize: size, subitems: [NSCollectionLayoutItem(layoutSize: size)])
}
group.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 16, bottom: 0, trailing: 16) group.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 16, bottom: 0, trailing: 16)
group.interItemSpacing = .fixed(16) group.interItemSpacing = .fixed(16)
let section = NSCollectionLayoutSection(group: group) let section = NSCollectionLayoutSection(group: group)