From 057d11882c406fcfd9604cea9ae2cc8d5e500c08 Mon Sep 17 00:00:00 2001 From: Arturo Carretero Calvo <10163049+ArtCC@users.noreply.github.com> Date: Mon, 29 Jan 2024 14:54:29 +0100 Subject: [PATCH] [focus-ios] Fix iOS widget has a white border (https://github.com/mozilla-mobile/focus-ios/pull/4011) * Fix iOS widget has a white border https://github.com/mozilla-mobile/focus-ios/pull/4005 * Fix padding. --------- Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> --- .../SwiftUI Onboarding/CardBannerView.swift | 2 +- .../ShowMeHowOnboardingView.swift | 2 +- .../Sources/Widget/SearchWidgetView.swift | 20 ++++++---- .../GradientFirst.colorset/Contents.json | 38 +++++++++++++++++++ .../GradientSecond.colorset/Contents.json | 38 +++++++++++++++++++ focus-ios/focus-ios/Widgets/Widgets.swift | 33 +++++++++++++++- 6 files changed, 122 insertions(+), 11 deletions(-) create mode 100644 focus-ios/focus-ios/Widgets/Assets.xcassets/GradientFirst.colorset/Contents.json create mode 100644 focus-ios/focus-ios/Widgets/Assets.xcassets/GradientSecond.colorset/Contents.json diff --git a/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/CardBannerView.swift b/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/CardBannerView.swift index 02cb46e3f4e8..4e1fe3569d43 100644 --- a/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/CardBannerView.swift +++ b/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/CardBannerView.swift @@ -62,7 +62,7 @@ public struct CardBannerView: View { } var widget: some View { - SearchWidgetView(title: config.widget.title) + SearchWidgetView(title: config.widget.title, padding: true, background: true) .frame(width: .searchWidgetSize, height: .searchWidgetSize) .clipShape(RoundedRectangle(cornerRadius: 20)) .colorScheme(.light) diff --git a/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/ShowMeHowOnboardingView.swift b/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/ShowMeHowOnboardingView.swift index 9efb772fedec..64efe8bf3b59 100644 --- a/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/ShowMeHowOnboardingView.swift +++ b/focus-ios/focus-ios/BlockzillaPackage/Sources/Onboarding/SwiftUI Onboarding/ShowMeHowOnboardingView.swift @@ -56,7 +56,7 @@ public struct ShowMeHowOnboardingView: View { } HStack { Spacer() - SearchWidgetView(title: config.widgetText) + SearchWidgetView(title: config.widgetText, padding: true, background: true) .frame(width: .searchWidgetSize, height: .searchWidgetSize) .clipShape(RoundedRectangle(cornerRadius: 20)) .colorScheme(.light) diff --git a/focus-ios/focus-ios/BlockzillaPackage/Sources/Widget/SearchWidgetView.swift b/focus-ios/focus-ios/BlockzillaPackage/Sources/Widget/SearchWidgetView.swift index b00b9ac5ff3e..d474274997cb 100644 --- a/focus-ios/focus-ios/BlockzillaPackage/Sources/Widget/SearchWidgetView.swift +++ b/focus-ios/focus-ios/BlockzillaPackage/Sources/Widget/SearchWidgetView.swift @@ -6,9 +6,13 @@ import SwiftUI public struct SearchWidgetView: View { let title: String + let padding: Bool + let background: Bool - public init(title: String) { + public init(title: String, padding: Bool, background: Bool) { self.title = title + self.padding = padding + self.background = background } public var body: some View { @@ -17,11 +21,11 @@ public struct SearchWidgetView: View { Text(title) .font(.headline) .fontWeight(.medium) - .minimumScaleFactor(0.8) - .foregroundColor(.white) + .minimumScaleFactor(0.8) + .foregroundColor(.white) Spacer() - + Image.magnifyingGlass .foregroundColor(.white) .frame(height: .magnifyingGlassHeight) @@ -36,12 +40,12 @@ public struct SearchWidgetView: View { .frame(height: .logoHeight) } } - .padding() + .padding(.all, padding ? 10 : 0) .background( - LinearGradient( + background ? LinearGradient( gradient: .quickAccessWidget, startPoint: .topLeading, - endPoint: .bottomTrailing) + endPoint: .bottomTrailing) : nil ) } } @@ -49,7 +53,7 @@ public struct SearchWidgetView: View { @available(iOS 14, *) struct SearchWidgetView_Previews: PreviewProvider { static var previews: some View { - SearchWidgetView(title: "Search in Focus") + SearchWidgetView(title: "Search in Focus", padding: true, background: true) .previewLayout(.sizeThatFits) .frame(width: 135, height: 135) .clipShape(RoundedRectangle(cornerRadius: 20)) diff --git a/focus-ios/focus-ios/Widgets/Assets.xcassets/GradientFirst.colorset/Contents.json b/focus-ios/focus-ios/Widgets/Assets.xcassets/GradientFirst.colorset/Contents.json new file mode 100644 index 000000000000..b58bfa9bc26c --- /dev/null +++ b/focus-ios/focus-ios/Widgets/Assets.xcassets/GradientFirst.colorset/Contents.json @@ -0,0 +1,38 @@ +{ + "colors" : [ + { + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0.796", + "green" : "0.165", + "red" : "0.349" + } + }, + "idiom" : "universal" + }, + { + "appearances" : [ + { + "appearance" : "luminosity", + "value" : "dark" + } + ], + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0x33", + "green" : "0x2A", + "red" : "0x2B" + } + }, + "idiom" : "universal" + } + ], + "info" : { + "author" : "xcode", + "version" : 1 + } +} diff --git a/focus-ios/focus-ios/Widgets/Assets.xcassets/GradientSecond.colorset/Contents.json b/focus-ios/focus-ios/Widgets/Assets.xcassets/GradientSecond.colorset/Contents.json new file mode 100644 index 000000000000..489cc0fe5ce3 --- /dev/null +++ b/focus-ios/focus-ios/Widgets/Assets.xcassets/GradientSecond.colorset/Contents.json @@ -0,0 +1,38 @@ +{ + "colors" : [ + { + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "1.000", + "green" : "0.443", + "red" : "0.671" + } + }, + "idiom" : "universal" + }, + { + "appearances" : [ + { + "appearance" : "luminosity", + "value" : "dark" + } + ], + "color" : { + "color-space" : "srgb", + "components" : { + "alpha" : "1.000", + "blue" : "0x33", + "green" : "0x2A", + "red" : "0x2B" + } + }, + "idiom" : "universal" + } + ], + "info" : { + "author" : "xcode", + "version" : 1 + } +} diff --git a/focus-ios/focus-ios/Widgets/Widgets.swift b/focus-ios/focus-ios/Widgets/Widgets.swift index 4460086e564f..ae8e6e22de4c 100644 --- a/focus-ios/focus-ios/Widgets/Widgets.swift +++ b/focus-ios/focus-ios/Widgets/Widgets.swift @@ -31,8 +31,13 @@ struct FocusWidgetsEntryView : View { var entry: Provider.Entry var body: some View { - SearchWidgetView(title: String(format: .searchInAppFormat, String.appNameForBundle)) + SearchWidgetView(title: String(format: .searchInAppFormat, String.appNameForBundle), padding: !Bool.isIOS17OrLater, background: false) .widgetURL(.deepLinkURL) + .widgetBackground(backgroundView: + LinearGradient( + gradient: .quickAccessWidget, + startPoint: .topLeading, + endPoint: .bottomTrailing)) } } @@ -57,6 +62,10 @@ struct FocusWidgets_Previews: PreviewProvider { } } +fileprivate extension Gradient { + static let quickAccessWidget = Gradient(colors: [Color("GradientFirst"), Color("GradientSecond")]) +} + fileprivate extension String { static var appNameForBundle: String { var isKlar: Bool { return (Bundle.main.infoDictionary!["CFBundleIdentifier"] as! String).contains("Klar") } @@ -85,6 +94,28 @@ fileprivate extension String { static let searchInApp = String(format: searchInAppFormat, AppInfo.shortProductName) } +fileprivate extension Bool { + static var isIOS17OrLater: Bool { + if #available(iOS 17, *) { + return true + } else { + return false + } + } +} + fileprivate extension URL { static let deepLinkURL: URL = URL(string: "firefox-focus://widget")! } + +fileprivate extension View { + func widgetBackground(backgroundView: some View) -> some View { + if #available(watchOS 10.0, iOSApplicationExtension 17.0, iOS 17.0, macOSApplicationExtension 14.0, *) { + return containerBackground(for: .widget) { + backgroundView + } + } else { + return background(backgroundView) + } + } +}