nice working version of the dynamic background color based on photo url
This commit is contained in:
talksik
@@ -31,7 +31,7 @@
|
||||
89288EC9276756DF00E962C4 /* FirebaseStorage in Frameworks */ = {isa = PBXBuildFile; productRef = 89288EC8276756DF00E962C4 /* FirebaseStorage */; };
|
||||
89288ECB27675B9F00E962C4 /* OnboardingTemplateView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89288ECA27675B9F00E962C4 /* OnboardingTemplateView.swift */; };
|
||||
89B46E71276893E200B74255 /* AuthSessionStore.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89B46E70276893E200B74255 /* AuthSessionStore.swift */; };
|
||||
89BDCDE527695DB900577829 /* RemoteImage.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BDCDE427695DB900577829 /* RemoteImage.swift */; };
|
||||
89BDCDE527695DB900577829 /* NirvanaImage.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BDCDE427695DB900577829 /* NirvanaImage.swift */; };
|
||||
89BDCDE72769616600577829 /* UIImage+Extension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BDCDE62769616600577829 /* UIImage+Extension.swift */; };
|
||||
89D99D2E2766FD6B00237814 /* Liquid in Frameworks */ = {isa = PBXBuildFile; productRef = 89D99D2D2766FD6B00237814 /* Liquid */; };
|
||||
89F1386D2767EB19006680ED /* SignInView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89F1386C2767EB19006680ED /* SignInView.swift */; };
|
||||
@@ -61,7 +61,7 @@
|
||||
89288EBF276755DF00E962C4 /* GoogleService-Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = "GoogleService-Info.plist"; sourceTree = "<group>"; };
|
||||
89288ECA27675B9F00E962C4 /* OnboardingTemplateView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingTemplateView.swift; sourceTree = "<group>"; };
|
||||
89B46E70276893E200B74255 /* AuthSessionStore.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AuthSessionStore.swift; sourceTree = "<group>"; };
|
||||
89BDCDE427695DB900577829 /* RemoteImage.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RemoteImage.swift; sourceTree = "<group>"; };
|
||||
89BDCDE427695DB900577829 /* NirvanaImage.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NirvanaImage.swift; sourceTree = "<group>"; };
|
||||
89BDCDE62769616600577829 /* UIImage+Extension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "UIImage+Extension.swift"; sourceTree = "<group>"; };
|
||||
89F1386C2767EB19006680ED /* SignInView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SignInView.swift; sourceTree = "<group>"; };
|
||||
/* End PBXFileReference section */
|
||||
@@ -178,7 +178,7 @@
|
||||
children = (
|
||||
891A15F4276557AB00B26659 /* colors.swift */,
|
||||
891A15FC276566B800B26659 /* constants.swift */,
|
||||
89BDCDE427695DB900577829 /* RemoteImage.swift */,
|
||||
89BDCDE427695DB900577829 /* NirvanaImage.swift */,
|
||||
89BDCDE62769616600577829 /* UIImage+Extension.swift */,
|
||||
);
|
||||
path = Globals;
|
||||
@@ -320,7 +320,7 @@
|
||||
89B46E71276893E200B74255 /* AuthSessionStore.swift in Sources */,
|
||||
891A15F9276563CA00B26659 /* WelcomeView.swift in Sources */,
|
||||
891A1611276590B000B26659 /* ChatsCarouselView.swift in Sources */,
|
||||
89BDCDE527695DB900577829 /* RemoteImage.swift in Sources */,
|
||||
89BDCDE527695DB900577829 /* NirvanaImage.swift in Sources */,
|
||||
891A16132765A44300B26659 /* ChatsCarouselViewModel.swift in Sources */,
|
||||
891A15E127653A7000B26659 /* nirvana_iosApp.swift in Sources */,
|
||||
891A160127656FB200B26659 /* FooterView.swift in Sources */,
|
||||
|
||||
@@ -8,10 +8,43 @@
|
||||
import SwiftUI
|
||||
|
||||
struct RemoteImage: View {
|
||||
@StateObject private var loader: Loader
|
||||
var loading: Image
|
||||
var failure: Image
|
||||
|
||||
// custom average color property we need to access
|
||||
var averageColor: UIColor?
|
||||
|
||||
private enum LoadState {
|
||||
case loading, success, failure
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
selectImage()
|
||||
.resizable()
|
||||
}
|
||||
|
||||
init(url: String, loading: Image = Image(systemName: "photo"), failure: Image = Image(systemName: "multiply.circle")) {
|
||||
_loader = StateObject(wrappedValue: Loader(url: url))
|
||||
self.loading = loading
|
||||
self.failure = failure
|
||||
}
|
||||
|
||||
private func selectImage() -> Image {
|
||||
switch loader.state {
|
||||
case .loading:
|
||||
return loading
|
||||
case .failure:
|
||||
return failure
|
||||
default:
|
||||
if let image = UIImage(data: loader.data) {
|
||||
return Image(uiImage: image)
|
||||
} else {
|
||||
return failure
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private class Loader: ObservableObject {
|
||||
var data = Data()
|
||||
var state = LoadState.loading
|
||||
@@ -35,40 +68,6 @@ struct RemoteImage: View {
|
||||
}.resume()
|
||||
}
|
||||
}
|
||||
|
||||
@StateObject private var loader: Loader
|
||||
var loading: Image
|
||||
var failure: Image
|
||||
|
||||
var body: some View {
|
||||
selectImage()
|
||||
.resizable()
|
||||
}
|
||||
|
||||
init(url: String, loading: Image = Image(systemName: "photo"), failure: Image = Image(systemName: "multiply.circle")) {
|
||||
_loader = StateObject(wrappedValue: Loader(url: url))
|
||||
self.loading = loading
|
||||
self.failure = failure
|
||||
}
|
||||
|
||||
private func selectImage() -> Image {
|
||||
switch loader.state {
|
||||
case .loading:
|
||||
return loading
|
||||
case .failure:
|
||||
return failure
|
||||
default:
|
||||
if let image = UIImage(data: loader.data) {
|
||||
let averageColor = image.averageColor
|
||||
print("the average color is \(averageColor?.description)")
|
||||
|
||||
return Image(uiImage: image)
|
||||
} else {
|
||||
return failure
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
struct RemoteImage_Previews: PreviewProvider {
|
||||
@@ -76,3 +75,16 @@ struct RemoteImage_Previews: PreviewProvider {
|
||||
RemoteImage(url: "https://avatars.githubusercontent.com/u/41487836")
|
||||
}
|
||||
}
|
||||
|
||||
class NirvanaImage {
|
||||
static func getAverageColor(url:URL) -> UIColor? {
|
||||
if let data = try? Data(contentsOf: url) {
|
||||
if let image = UIImage(data: data) {
|
||||
return image.averageColor
|
||||
} else {
|
||||
return nil
|
||||
}
|
||||
}
|
||||
return nil
|
||||
}
|
||||
}
|
||||
@@ -9,6 +9,9 @@ import Foundation
|
||||
import SwiftUI
|
||||
|
||||
extension UIImage {
|
||||
/**
|
||||
This will return the dominant color of the passed in UIImage
|
||||
*/
|
||||
var averageColor: UIColor? {
|
||||
guard let inputImage = CIImage(image: self) else { return nil }
|
||||
let extentVector = CIVector(x: inputImage.extent.origin.x, y: inputImage.extent.origin.y, z: inputImage.extent.size.width, w: inputImage.extent.size.height)
|
||||
|
||||
@@ -9,7 +9,7 @@ import SwiftUI
|
||||
|
||||
struct HeaderView: View {
|
||||
@EnvironmentObject var authStore:AuthSessionStore
|
||||
private var averageColor: UIColor?
|
||||
@State var averageColor: UIColor? = UIColor(NirvanaColor.teal)
|
||||
|
||||
var body: some View {
|
||||
HStack(alignment:.center) {
|
||||
@@ -28,12 +28,19 @@ struct HeaderView: View {
|
||||
.clipShape(Circle())
|
||||
.padding()
|
||||
.shadow(radius:5)
|
||||
.onAppear {
|
||||
self.setAverageColor()
|
||||
}
|
||||
}
|
||||
}
|
||||
.background(Color(self.averageColor!))
|
||||
.frame(maxWidth: .infinity)
|
||||
.onAppear{
|
||||
// set background color based on profile picture tint
|
||||
if authStore.sessionState == SessionState.isAuthenticated {
|
||||
if let userPicUrl = authStore.user?.profilePictureUrl {
|
||||
self.averageColor = NirvanaImage.getAverageColor(url: userPicUrl)
|
||||
}
|
||||
// self.averageColor = NirvanaImage.getAverageColor(url: "https://avatars.githubusercontent.com/u/41487836")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private func setAverageColor() {
|
||||
|
||||
Reference in New Issue
Block a user