wip on the gallery screen

martinmitrevski · martinmitrevski · commit 16affbed707e · 2021-12-17T17:15:58.000+01:00
diff --git a/Sources/StreamChatSwiftUI/ChatChannel/Gallery/GalleryView.swift b/Sources/StreamChatSwiftUI/ChatChannel/Gallery/GalleryView.swift
@@ -12,6 +12,7 @@ struct GalleryView: View {
     var message: ChatMessage
     @Binding var isShown: Bool
     @State private var selected: Int
+    @State private var loadedImages = [Int: UIImage]()
     
     init(
         message: ChatMessage,
@@ -41,19 +42,33 @@ struct GalleryView: View {
                                 LazyLoadingImage(
                                     source: url,
                                     width: reader.size.width,
-                                    resize: true
+                                    resize: true,
+                                    onImageLoaded: { image in
+                                        loadedImages[index] = image
+                                    }
                                 )
                                 .frame(width: reader.size.width)
                                 .aspectRatio(contentMode: .fit)
                                 Spacer()
                             }
                         }
-                        .background(Color(colors.background1))
                         .tag(index)
                     }
                 }
-                .tabViewStyle(.page)
-                .indexViewStyle(.page(backgroundDisplayMode: .never))
+                .tabViewStyle(.page(indexDisplayMode: .never))
+                
+                if let image = loadedImages[selected] {
+                    HStack {
+                        ShareButtonView(content: [image])
+                            .standardPadding()
+                        
+                        Spacer()
+                        
+                        Text("\(selected + 1) of \(sources.count)")
+                        
+                        Spacer()
+                    }
+                }
             }
         }
     }
diff --git a/Sources/StreamChatSwiftUI/ChatChannel/Gallery/ShareButtonView.swift b/Sources/StreamChatSwiftUI/ChatChannel/Gallery/ShareButtonView.swift
@@ -0,0 +1,49 @@
+//
+// Copyright © 2021 Stream.io Inc. All rights reserved.
+//
+
+import SwiftUI
+
+/// View for presenting a button which has a share action.
+struct ShareButtonView: View {
+    @Injected(\.colors) var colors
+    
+    var content: [Any]
+    @State var isSharePresented = false
+    
+    var body: some View {
+        Button(action: {
+            self.isSharePresented = true
+        }, label: {
+            Image(systemName: "square.and.arrow.up")
+        })
+            .foregroundColor(Color(colors.text))
+            .sheet(isPresented: $isSharePresented) {
+                ShareActivityView(activityItems: content)
+            }
+    }
+}
+
+/// View controller reprensetable which wraps up the activity view controller.
+struct ShareActivityView: UIViewControllerRepresentable {
+
+    var activityItems: [Any]
+    var applicationActivities: [UIActivity]? = nil
+
+    func makeUIViewController(
+        context: UIViewControllerRepresentableContext<ShareActivityView>
+    ) -> UIActivityViewController {
+        let controller = UIActivityViewController(
+            activityItems: activityItems,
+            applicationActivities: applicationActivities
+        )
+        controller.popoverPresentationController?.sourceView = UIApplication.shared.windows.first?.rootViewController?.view
+
+        return controller
+    }
+
+    func updateUIViewController(
+        _ uiViewController: UIActivityViewController,
+        context: UIViewControllerRepresentableContext<ShareActivityView>
+    ) {}
+}
diff --git a/Sources/StreamChatSwiftUI/ChatChannel/Gallery/ZoomableScrollView.swift b/Sources/StreamChatSwiftUI/ChatChannel/Gallery/ZoomableScrollView.swift
@@ -44,6 +44,8 @@ private struct ZoomableScrollViewImpl<Content: View>: UIViewControllerRepresenta
     // MARK: - ZoomableScrollViewController
 
     class ZoomableScrollViewController: UIViewController, UIScrollViewDelegate {
+        @Injected(\.colors) var colors
+        
         let coordinator: Coordinator
         let scrollView = UIScrollView()
         
@@ -74,6 +76,7 @@ private struct ZoomableScrollViewImpl<Content: View>: UIViewControllerRepresenta
             
             let hostedView = coordinator.hostingController.view!
             hostedView.translatesAutoresizingMaskIntoConstraints = false
+            hostedView.backgroundColor = colors.background1
             scrollView.addSubview(hostedView)
             NSLayoutConstraint.activate([
                 hostedView.leadingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.leadingAnchor),
diff --git a/Sources/StreamChatSwiftUI/ChatChannel/MessageList/ImageAttachmentView.swift b/Sources/StreamChatSwiftUI/ChatChannel/MessageList/ImageAttachmentView.swift
@@ -284,6 +284,7 @@ struct LazyLoadingImage: View {
     var resize: Bool = true
     var imageTapped: ((Int) -> Void)? = nil
     var index: Int?
+    var onImageLoaded: (UIImage) -> Void = { _ in }
     
     var body: some View {
         ZStack {
@@ -292,20 +293,10 @@ struct LazyLoadingImage: View {
                     Button {
                         imageTapped(index ?? 0)
                     } label: {
-                        Image(uiImage: image)
-                            .resizable()
-                            .scaledToFill()
-                            .aspectRatio(contentMode: .fill)
-                            .clipped()
-                            .allowsHitTesting(false)
+                        imageView(for: image)
                     }
                 } else {
-                    Image(uiImage: image)
-                        .resizable()
-                        .scaledToFill()
-                        .aspectRatio(contentMode: .fill)
-                        .clipped()
-                        .allowsHitTesting(false)
+                    imageView(for: image)
                 }
             } else if error != nil {
                 Color(.secondarySystemBackground)
@@ -330,6 +321,7 @@ struct LazyLoadingImage: View {
                     switch result {
                     case let .success(image):
                         self.image = image
+                        onImageLoaded(image)
                     case let .failure(error):
                         self.error = error
                     }
@@ -338,6 +330,15 @@ struct LazyLoadingImage: View {
         }
         .clipped()
     }
+    
+    func imageView(for image: UIImage) -> some View {
+        Image(uiImage: image)
+            .resizable()
+            .scaledToFill()
+            .aspectRatio(contentMode: .fill)
+            .clipped()
+            .allowsHitTesting(false)
+    }
 }
 
 extension ChatMessage {
diff --git a/StreamChatSwiftUI.xcodeproj/project.pbxproj b/StreamChatSwiftUI.xcodeproj/project.pbxproj
@@ -240,6 +240,7 @@
 		84F2908A276B90610045472D /* GalleryView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84F29089276B90610045472D /* GalleryView.swift */; };
 		84F2908C276B91700045472D /* ZoomableScrollView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84F2908B276B91700045472D /* ZoomableScrollView.swift */; };
 		84F2908E276B92A40045472D /* GalleryHeaderView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84F2908D276B92A40045472D /* GalleryHeaderView.swift */; };
+		84F29090276CC1280045472D /* ShareButtonView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84F2908F276CC1280045472D /* ShareButtonView.swift */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -516,6 +517,7 @@
 		84F29089276B90610045472D /* GalleryView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GalleryView.swift; sourceTree = "<group>"; };
 		84F2908B276B91700045472D /* ZoomableScrollView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ZoomableScrollView.swift; sourceTree = "<group>"; };
 		84F2908D276B92A40045472D /* GalleryHeaderView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GalleryHeaderView.swift; sourceTree = "<group>"; };
+		84F2908F276CC1280045472D /* ShareButtonView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ShareButtonView.swift; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -1066,6 +1068,7 @@
 				84F29089276B90610045472D /* GalleryView.swift */,
 				8465FD032746A95600AF091E /* VideoPlayerView.swift */,
 				84F2908B276B91700045472D /* ZoomableScrollView.swift */,
+				84F2908F276CC1280045472D /* ShareButtonView.swift */,
 			);
 			path = Gallery;
 			sourceTree = "<group>";
@@ -1347,6 +1350,7 @@
 				84A75FBB274EA29B00225CE8 /* GiphyAttachmentView.swift in Sources */,
 				8465FD802746A95700AF091E /* WebView.swift in Sources */,
 				8465FD942746A95700AF091E /* AddedFileAttachmentsView.swift in Sources */,
+				84F29090276CC1280045472D /* ShareButtonView.swift in Sources */,
 				8465FD852746A95700AF091E /* MessageView.swift in Sources */,
 				8465FDCA2746A95700AF091E /* MoreChannelActionsViewModel.swift in Sources */,
 				8465FDD12746A95700AF091E /* Images.swift in Sources */,

Original file line number	Diff line number	Diff line change
`@@ -12,6 +12,7 @@ struct GalleryView: View {`
`12`	`12`	`var message: ChatMessage`
`13`	`13`	`@Binding var isShown: Bool`
`14`	`14`	`@State private var selected: Int`
	`15`	`+ @State private var loadedImages = [Int: UIImage]()`
`15`	`16`
`16`	`17`	`init(`
`17`	`18`	`message: ChatMessage,`
`@@ -41,19 +42,33 @@ struct GalleryView: View {`
`41`	`42`	`LazyLoadingImage(`
`42`	`43`	`source: url,`
`43`	`44`	`width: reader.size.width,`
`44`		`- resize: true`
	`45`	`+ resize: true,`
	`46`	`+ onImageLoaded: { image in`
	`47`	`+ loadedImages[index] = image`
	`48`	`+ }`
`45`	`49`	`)`
`46`	`50`	`.frame(width: reader.size.width)`
`47`	`51`	`.aspectRatio(contentMode: .fit)`
`48`	`52`	`Spacer()`
`49`	`53`	`}`
`50`	`54`	`}`
`51`		`- .background(Color(colors.background1))`
`52`	`55`	`.tag(index)`
`53`	`56`	`}`
`54`	`57`	`}`
`55`		`- .tabViewStyle(.page)`
`56`		`- .indexViewStyle(.page(backgroundDisplayMode: .never))`
	`58`	`+ .tabViewStyle(.page(indexDisplayMode: .never))`
	`59`	`+`
	`60`	`+ if let image = loadedImages[selected] {`
	`61`	`+ HStack {`
	`62`	`+ ShareButtonView(content: [image])`
	`63`	`+ .standardPadding()`
	`64`	`+`
	`65`	`+ Spacer()`
	`66`	`+`
	`67`	`+ Text("\(selected + 1) of \(sources.count)")`
	`68`	`+`
	`69`	`+ Spacer()`
	`70`	`+ }`
	`71`	`+ }`
`57`	`72`	`}`
`58`	`73`	`}`
`59`	`74`	`}`