Refactoring square user profile grid

This commit is contained in:
Marcin Czachurski 2023-05-06 18:21:05 +02:00
parent 2ca4b42b30
commit ccdecddfe2
5 changed files with 31 additions and 14 deletions

View File

@ -190,6 +190,7 @@
F8B0885E29942E31002AB40A /* ThirdPartyView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8B0885D29942E31002AB40A /* ThirdPartyView.swift */; }; F8B0885E29942E31002AB40A /* ThirdPartyView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8B0885D29942E31002AB40A /* ThirdPartyView.swift */; };
F8B0886029943498002AB40A /* OtherSectionView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8B0885F29943498002AB40A /* OtherSectionView.swift */; }; F8B0886029943498002AB40A /* OtherSectionView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8B0885F29943498002AB40A /* OtherSectionView.swift */; };
F8B08862299435C9002AB40A /* SupportView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8B08861299435C9002AB40A /* SupportView.swift */; }; F8B08862299435C9002AB40A /* SupportView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8B08861299435C9002AB40A /* SupportView.swift */; };
F8C287A32A06B4C90072213F /* ImageScale.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8C287A22A06B4C90072213F /* ImageScale.swift */; };
F8D5444329D4066C002225D6 /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8D5444229D4066C002225D6 /* AppDelegate.swift */; }; F8D5444329D4066C002225D6 /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8D5444229D4066C002225D6 /* AppDelegate.swift */; };
F8DF38E429DD68820047F1AA /* ViewOffsetKey.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8DF38E329DD68820047F1AA /* ViewOffsetKey.swift */; }; F8DF38E429DD68820047F1AA /* ViewOffsetKey.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8DF38E329DD68820047F1AA /* ViewOffsetKey.swift */; };
F8DF38E629DDB98A0047F1AA /* SocialsSectionView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8DF38E529DDB98A0047F1AA /* SocialsSectionView.swift */; }; F8DF38E629DDB98A0047F1AA /* SocialsSectionView.swift in Sources */ = {isa = PBXBuildFile; fileRef = F8DF38E529DDB98A0047F1AA /* SocialsSectionView.swift */; };
@ -390,6 +391,7 @@
F8B08861299435C9002AB40A /* SupportView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SupportView.swift; sourceTree = "<group>"; }; F8B08861299435C9002AB40A /* SupportView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SupportView.swift; sourceTree = "<group>"; };
F8B3699A29D86EB600BE3808 /* .swiftlint.yml */ = {isa = PBXFileReference; lastKnownFileType = text.yaml; path = .swiftlint.yml; sourceTree = "<group>"; }; F8B3699A29D86EB600BE3808 /* .swiftlint.yml */ = {isa = PBXFileReference; lastKnownFileType = text.yaml; path = .swiftlint.yml; sourceTree = "<group>"; };
F8B3699B29D86EBD00BE3808 /* .gitignore */ = {isa = PBXFileReference; lastKnownFileType = text; path = .gitignore; sourceTree = "<group>"; }; F8B3699B29D86EBD00BE3808 /* .gitignore */ = {isa = PBXFileReference; lastKnownFileType = text; path = .gitignore; sourceTree = "<group>"; };
F8C287A22A06B4C90072213F /* ImageScale.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ImageScale.swift; sourceTree = "<group>"; };
F8C937A929882CA90004D782 /* Vernissage-001.xcdatamodel */ = {isa = PBXFileReference; lastKnownFileType = wrapper.xcdatamodel; path = "Vernissage-001.xcdatamodel"; sourceTree = "<group>"; }; F8C937A929882CA90004D782 /* Vernissage-001.xcdatamodel */ = {isa = PBXFileReference; lastKnownFileType = wrapper.xcdatamodel; path = "Vernissage-001.xcdatamodel"; sourceTree = "<group>"; };
F8CAE64129B8F1AF001E0372 /* Vernissage-005.xcdatamodel */ = {isa = PBXFileReference; lastKnownFileType = wrapper.xcdatamodel; path = "Vernissage-005.xcdatamodel"; sourceTree = "<group>"; }; F8CAE64129B8F1AF001E0372 /* Vernissage-005.xcdatamodel */ = {isa = PBXFileReference; lastKnownFileType = wrapper.xcdatamodel; path = "Vernissage-005.xcdatamodel"; sourceTree = "<group>"; };
F8D5444229D4066C002225D6 /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; }; F8D5444229D4066C002225D6 /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
@ -531,6 +533,7 @@
F8DF38E329DD68820047F1AA /* ViewOffsetKey.swift */, F8DF38E329DD68820047F1AA /* ViewOffsetKey.swift */,
F871F21C29EF0D7000A351EF /* NavigationMenuItemDetails.swift */, F871F21C29EF0D7000A351EF /* NavigationMenuItemDetails.swift */,
F8624D3C29F2D3AC00204986 /* SelectedMenuItemDetails.swift */, F8624D3C29F2D3AC00204986 /* SelectedMenuItemDetails.swift */,
F8C287A22A06B4C90072213F /* ImageScale.swift */,
); );
path = Models; path = Models;
sourceTree = "<group>"; sourceTree = "<group>";
@ -1255,6 +1258,7 @@
F89B5CC229D01BF700549F2F /* InstanceView.swift in Sources */, F89B5CC229D01BF700549F2F /* InstanceView.swift in Sources */,
F825F0CB29F7CFC4008BD204 /* FollowRequestsView.swift in Sources */, F825F0CB29F7CFC4008BD204 /* FollowRequestsView.swift in Sources */,
F825F0C929F7A562008BD204 /* UserProfilePrivateAccountView.swift in Sources */, F825F0C929F7A562008BD204 /* UserProfilePrivateAccountView.swift in Sources */,
F8C287A32A06B4C90072213F /* ImageScale.swift in Sources */,
F89F57B029D1C11200001EE3 /* RelationshipModel.swift in Sources */, F89F57B029D1C11200001EE3 /* RelationshipModel.swift in Sources */,
F88AB05829B36B8200345EDE /* AccountsPhotoView.swift in Sources */, F88AB05829B36B8200345EDE /* AccountsPhotoView.swift in Sources */,
F85D4971296402DC00751DF7 /* AuthorizationService.swift in Sources */, F85D4971296402DC00751DF7 /* AuthorizationService.swift in Sources */,

View File

@ -0,0 +1,12 @@
//
// https://mczachurski.dev
// Copyright © 2023 Marcin Czachurski and the repository contributors.
// Licensed under the Apache License 2.0.
//
import Foundation
enum ImageScale {
case orginalFullWidth
case squareHalfWidth
}

View File

@ -57,7 +57,9 @@ struct UserProfileStatusesView: View {
LazyVGrid(columns: self.applicationState.showGridOnUserProfile ? dubleGrid : singleGrids, spacing: 5) { LazyVGrid(columns: self.applicationState.showGridOnUserProfile ? dubleGrid : singleGrids, spacing: 5) {
ForEach(self.statusViewModels, id: \.id) { item in ForEach(self.statusViewModels, id: \.id) { item in
ImageRowAsync(statusViewModel: item, withAvatar: false, clipToSquare: self.applicationState.showGridOnUserProfile) ImageRowAsync(statusViewModel: item,
withAvatar: false,
imageScale: self.applicationState.showGridOnUserProfile ? .squareHalfWidth : .orginalFullWidth)
.if(self.applicationState.showGridOnUserProfile) { .if(self.applicationState.showGridOnUserProfile) {
$0.frame(width: UIScreen.main.bounds.width / 2, height: UIScreen.main.bounds.width / 2) $0.frame(width: UIScreen.main.bounds.width / 2, height: UIScreen.main.bounds.width / 2)
} }
@ -132,5 +134,4 @@ struct UserProfileStatusesView: View {
private func prefetch(statusModels: [StatusModel]) { private func prefetch(statusModels: [StatusModel]) {
imagePrefetcher.startPrefetching(with: statusModels.getAllImagesUrls()) imagePrefetcher.startPrefetching(with: statusModels.getAllImagesUrls())
} }
} }

View File

@ -14,15 +14,15 @@ struct ImageRowAsync: View {
private let statusViewModel: StatusModel private let statusViewModel: StatusModel
private let firstAttachment: AttachmentModel? private let firstAttachment: AttachmentModel?
private let showAvatar: Bool private let showAvatar: Bool
private let clipToSquare: Bool private let imageScale: ImageScale
@State private var selected: String @State private var selected: String
@State private var imageHeight: Double @State private var imageHeight: Double
@State private var imageWidth: Double @State private var imageWidth: Double
init(statusViewModel: StatusModel, withAvatar showAvatar: Bool = true, clipToSquare: Bool = false) { init(statusViewModel: StatusModel, withAvatar showAvatar: Bool = true, imageScale: ImageScale = .orginalFullWidth) {
self.showAvatar = showAvatar self.showAvatar = showAvatar
self.clipToSquare = clipToSquare self.imageScale = imageScale
self.statusViewModel = statusViewModel self.statusViewModel = statusViewModel
self.firstAttachment = statusViewModel.mediaAttachments.first self.firstAttachment = statusViewModel.mediaAttachments.first
self.selected = String.empty() self.selected = String.empty()
@ -49,7 +49,7 @@ struct ImageRowAsync: View {
ImageRowItemAsync(statusViewModel: self.statusViewModel, ImageRowItemAsync(statusViewModel: self.statusViewModel,
attachment: firstAttachment, attachment: firstAttachment,
withAvatar: self.showAvatar, withAvatar: self.showAvatar,
clipToSquare: self.clipToSquare) { (imageWidth, imageHeight) in imageScale: self.imageScale) { (imageWidth, imageHeight) in
// When we download image and calculate real size we have to change view size. // When we download image and calculate real size we have to change view size.
if imageWidth != self.imageWidth || imageHeight != self.imageHeight { if imageWidth != self.imageWidth || imageHeight != self.imageHeight {
@ -59,7 +59,7 @@ struct ImageRowAsync: View {
} }
} }
} }
.if(self.clipToSquare == false) { .if(self.imageScale == .orginalFullWidth) {
$0.frame(width: self.imageWidth, height: self.imageHeight) $0.frame(width: self.imageWidth, height: self.imageHeight)
} }
} else { } else {
@ -68,7 +68,7 @@ struct ImageRowAsync: View {
ImageRowItemAsync(statusViewModel: self.statusViewModel, ImageRowItemAsync(statusViewModel: self.statusViewModel,
attachment: attachment, attachment: attachment,
withAvatar: self.showAvatar, withAvatar: self.showAvatar,
clipToSquare: self.clipToSquare) { (imageWidth, imageHeight) in imageScale: self.imageScale) { (imageWidth, imageHeight) in
// When we download image and calculate real size we have to change view size (only when image is now visible). // When we download image and calculate real size we have to change view size (only when image is now visible).
if attachment.id == self.selected { if attachment.id == self.selected {
@ -98,7 +98,7 @@ struct ImageRowAsync: View {
} }
} }
}) })
.if(self.clipToSquare == false) { .if(self.imageScale == .orginalFullWidth) {
$0.frame(width: self.imageWidth, height: self.imageHeight) $0.frame(width: self.imageWidth, height: self.imageHeight)
} }
.tabViewStyle(.page(indexDisplayMode: .never)) .tabViewStyle(.page(indexDisplayMode: .never))

View File

@ -21,8 +21,8 @@ struct ImageRowItemAsync: View {
private var statusViewModel: StatusModel private var statusViewModel: StatusModel
private var attachment: AttachmentModel private var attachment: AttachmentModel
private let showAvatar: Bool private let showAvatar: Bool
private let clipToSquare: Bool
private let imageFromCache: Bool private let imageFromCache: Bool
private let imageScale: ImageScale
@State private var showThumbImage = false @State private var showThumbImage = false
@State private var opacity = 1.0 @State private var opacity = 1.0
@ -33,10 +33,10 @@ struct ImageRowItemAsync: View {
init(statusViewModel: StatusModel, init(statusViewModel: StatusModel,
attachment: AttachmentModel, attachment: AttachmentModel,
withAvatar showAvatar: Bool = true, withAvatar showAvatar: Bool = true,
clipToSquare: Bool = false, imageScale: ImageScale = .orginalFullWidth,
onImageDownloaded: @escaping (_: Double, _: Double) -> Void) { onImageDownloaded: @escaping (_: Double, _: Double) -> Void) {
self.showAvatar = showAvatar self.showAvatar = showAvatar
self.clipToSquare = clipToSquare self.imageScale = imageScale
self.statusViewModel = statusViewModel self.statusViewModel = statusViewModel
self.attachment = attachment self.attachment = attachment
self.onImageDownloaded = onImageDownloaded self.onImageDownloaded = onImageDownloaded
@ -49,7 +49,7 @@ struct ImageRowItemAsync: View {
if let image = state.image { if let image = state.image {
if self.statusViewModel.sensitive && !self.applicationState.showSensitive { if self.statusViewModel.sensitive && !self.applicationState.showSensitive {
ZStack { ZStack {
ContentWarning(spoilerText: self.clipToSquare ? nil : self.statusViewModel.spoilerText) { ContentWarning(spoilerText: self.imageScale == .orginalFullWidth ? self.statusViewModel.spoilerText : nil) {
self.imageContainerView(image: image) self.imageContainerView(image: image)
.imageContextMenu(statusModel: self.statusViewModel, .imageContextMenu(statusModel: self.statusViewModel,
attachmentModel: self.attachment, attachmentModel: self.attachment,
@ -156,7 +156,7 @@ struct ImageRowItemAsync: View {
image image
.resizable() .resizable()
.scaledToFill() .scaledToFill()
.if(self.clipToSquare) { .if(self.imageScale == .squareHalfWidth) {
$0.frame(width: UIScreen.main.bounds.width / 2, height: UIScreen.main.bounds.width / 2).clipped() $0.frame(width: UIScreen.main.bounds.width / 2, height: UIScreen.main.bounds.width / 2).clipped()
} }
.onTapGesture(count: 2) { .onTapGesture(count: 2) {