Buttons.swift (14272B)
1 /* 2 * This file is part of GNU Taler, ©2022-25 Taler Systems S.A. 3 * See LICENSE.md 4 */ 5 /** 6 * @author Marc Stibane 7 */ 8 import SwiftUI 9 import Foundation 10 import AVFoundation 11 12 extension ShapeStyle where Self == Color { 13 static var random: Color { 14 Color( 15 red: .random(in: 0...1), 16 green: .random(in: 0...1), 17 blue: .random(in: 0...1) 18 ) 19 } 20 } 21 22 struct HamburgerButton : View { 23 let action: () -> Void 24 25 var body: some View { 26 Button(action: action) { 27 Image(systemName: HAMBURGER) 28 // Image(systemName: "sidebar.squares.leading") // 29 } 30 .talerFont(.title) 31 .accessibilityLabel(Text("Main Menu", comment: "a11y")) 32 } 33 } 34 35 struct LinkButton: View { 36 let destination: URL 37 let hintTitle: String 38 let buttonTitle: String 39 let a11yHint: String 40 let badge: String 41 42 @AppStorage("minimalistic") var minimalistic: Bool = false 43 44 var body: some View { 45 VStack(alignment: .leading) { 46 if !minimalistic { // show hint that the user should authorize on bank website 47 Text(hintTitle) 48 .fixedSize(horizontal: false, vertical: true) // wrap in scrollview 49 .multilineTextAlignment(.leading) // otherwise 50 .listRowSeparator(.hidden) 51 } 52 Link(destination: destination) { 53 HStack(spacing: 8.0) { 54 Image(systemName: LINK) 55 Text(buttonTitle) 56 } 57 } 58 .buttonStyle(TalerButtonStyle(type: .prominent, badge: badge)) 59 .accessibilityHint(a11yHint) 60 } 61 } 62 } 63 64 struct QRButton : View { 65 let hideTitle: Bool 66 let action: () -> Void 67 68 @AppStorage("minimalistic") var minimalistic: Bool = false 69 @State private var showCameraAlert: Bool = false 70 71 private var openSettingsButton: some View { 72 Button("Open Settings") { 73 showCameraAlert = false 74 UIApplication.shared.open(URL(string: UIApplication.openSettingsURLString)!) 75 } 76 } 77 let closingAnnouncement = String(localized: "Closing Camera", comment: "a11y") 78 79 var defaultPriorityAnnouncement = String(localized: "Opening Camera", comment: "a11y") 80 81 var highPriorityAnnouncement: AttributedString { 82 var highPriorityString = AttributedString(localized: "Camera Active", comment: "a11y") 83 if #available(iOS 17.0, *) { 84 highPriorityString.accessibilitySpeechAnnouncementPriority = .high 85 } 86 return highPriorityString 87 } 88 @MainActor 89 private func checkCameraAvailable() -> Void { 90 // Open Camera when QR-Button was tapped 91 announce(defaultPriorityAnnouncement) 92 93 AVCaptureDevice.requestAccess(for: .video, completionHandler: { (granted: Bool) -> Void in 94 if granted { 95 action() 96 if #available(iOS 17.0, *) { 97 AccessibilityNotification.Announcement(highPriorityAnnouncement).post() 98 } else { 99 let cameraActive = String(localized: "Camera Active", comment: "a11y") 100 announce(cameraActive) 101 } 102 } else { 103 showCameraAlert = true 104 } 105 }) 106 } 107 108 var body: some View { 109 let dismissAlertButton = Button("Cancel", role: .cancel) { 110 announce(closingAnnouncement) 111 showCameraAlert = false 112 } 113 let scanText = String(localized: "Scan QR code", comment: "Button title, a11y") 114 let qrImage = Image(systemName: QRBUTTON) 115 let qrText = Text(qrImage) 116 Button(action: checkCameraAvailable) { 117 if hideTitle { 118 qrImage 119 .resizable() 120 .scaledToFit() 121 .foregroundStyle(Color.accentColor) 122 } else if minimalistic { 123 let width = UIScreen.screenWidth / 7 124 qrText.talerFont(.largeTitle) 125 .padding(.horizontal, width) 126 } else { 127 HStack(spacing: 16) { 128 qrText.talerFont(.title) 129 Text(scanText) 130 }.padding(.horizontal) 131 } 132 } 133 .accessibilityLabel(scanText) 134 .alert("Scanning QR-codes requires access to the camera", 135 isPresented: $showCameraAlert, 136 actions: { openSettingsButton 137 dismissAlertButton }, 138 message: { Text("Please allow camera access in settings.") }) // Scanning QR-codes 139 } 140 } 141 142 struct DoneButton : View { 143 let titleStr: String? 144 let accessibilityLabelStr: String 145 let action: () -> Void 146 147 var body: some View { 148 Button(action: action) { 149 if let titleStr { 150 Text(titleStr) 151 .tint(.accentColor) 152 } else { 153 Image(systemName: CHECKMARK) // 154 } 155 } 156 .tint(.accentColor) 157 .talerFont(.title) 158 .accessibilityLabel(accessibilityLabelStr) 159 } 160 } 161 162 struct PlusButton : View { 163 let accessibilityLabelStr: String 164 let action: () -> Void 165 166 var body: some View { 167 Button(action: action) { 168 Image(systemName: PLUS) 169 } 170 .tint(.accentColor) 171 .talerFont(.title) 172 .accessibilityLabel(accessibilityLabelStr) 173 } 174 } 175 176 struct ZoomInButton : View { 177 let accessibilityLabelStr: String 178 let action: () -> Void 179 180 var body: some View { 181 Button(action: action) { 182 let name = ICONNAME_ZOOM_IN 183 if UIImage(named: name) != nil { 184 Image(name) 185 } else { 186 Image(systemName: SYSTEM_ZOOM_IN) 187 } 188 } 189 .tint(.accentColor) 190 .talerFont(.title) 191 .accessibilityLabel(accessibilityLabelStr) 192 } 193 } 194 195 struct ZoomOutButton : View { 196 let accessibilityLabelStr: String 197 let action: () -> Void 198 199 var body: some View { 200 Button(action: action) { 201 let name = ICONNAME_ZOOM_OUT 202 if UIImage(named: name) != nil { 203 Image(name) 204 } else { 205 Image(systemName: SYSTEM_ZOOM_OUT) 206 } 207 } 208 .tint(.accentColor) 209 .talerFont(.title) 210 .accessibilityLabel(accessibilityLabelStr) 211 } 212 } 213 214 struct BackButton : View { 215 let action: () -> Void 216 217 var body: some View { 218 Button(action: action) { 219 let name = ICONNAME_INCOMING + ICONNAME_FILL 220 let sysName = SYSTEM_INCOMING4 + ICONNAME_FILL 221 if UIImage(named: name) != nil { 222 Image(name) 223 } else if UIImage(systemName: sysName) != nil { 224 Image(systemName: sysName) 225 } else { 226 // TODO: ultralight vs black 227 Image(systemName: FALLBACK_INCOMING) 228 } 229 } 230 .tint(.accentColor) 231 .talerFont(.largeTitle) 232 .accessibilityLabel(Text("Back", comment: "a11y")) 233 } 234 } 235 236 struct ForwardButton : View { 237 let enabled: Bool 238 let action: () -> Void 239 240 var body: some View { 241 let myAction = { 242 if enabled { 243 action() 244 } 245 } 246 Button(action: myAction) { 247 let imageName = enabled ? ICONNAME_OUTGOING + ICONNAME_FILL 248 : ICONNAME_OUTGOING 249 let sysName = enabled ? SYSTEM_OUTGOING4 + ICONNAME_FILL 250 : SYSTEM_OUTGOING4 251 if UIImage(named: imageName) != nil { 252 Image(imageName) 253 } else if UIImage(systemName: sysName) != nil { 254 Image(systemName: sysName) 255 } else { 256 // TODO: ultralight vs black 257 Image(systemName: FALLBACK_OUTGOING) 258 } 259 } 260 .tint(.accentColor) 261 .talerFont(.largeTitle) 262 .accessibilityLabel(Text("Continue", comment: "a11y")) 263 } 264 } 265 266 struct ArrowUpButton : View { 267 let action: () -> Void 268 269 var body: some View { 270 Button(action: action) { 271 Image(systemName: ARROW_TOP) // 272 } 273 .tint(.accentColor) 274 .talerFont(.title2) 275 .accessibilityLabel(Text("Scroll up", comment: "a11y")) 276 } 277 } 278 279 struct ArrowDownButton : View { 280 let action: () -> Void 281 282 var body: some View { 283 Button(action: action) { 284 Image(systemName: ARROW_BOT) // 285 } 286 .tint(.accentColor) 287 .talerFont(.title2) 288 .accessibilityLabel(Text("Scroll down", comment: "a11y")) 289 } 290 } 291 292 struct ReloadButton : View { 293 let disabled: Bool 294 let action: () -> Void 295 296 var body: some View { 297 Button(action: action) { 298 Image(systemName: RELOAD) // 299 } 300 .tint(.accentColor) 301 .talerFont(.title) 302 .accessibilityLabel(Text("Reload", comment: "a11y")) 303 .disabled(disabled) 304 } 305 } 306 307 struct TalerButtonStyle: ButtonStyle { 308 enum TalerButtonStyleType { 309 case plain 310 case bordered 311 case prominent 312 } 313 var type: TalerButtonStyleType = .plain 314 var dimmed: Bool = false 315 var narrow: Bool = false 316 var disabled: Bool = false 317 var aligned: TextAlignment = .center 318 var badge: String = EMPTYSTRING 319 320 @Environment(\.colorScheme) private var colorScheme 321 @Environment(\.colorSchemeContrast) private var colorSchemeContrast 322 323 public func makeBody(configuration: ButtonStyleConfiguration) -> some View { 324 // configuration.role = type == .prominent ? .primary : .normal Only on macOS 325 MyBigButton(foreColor: foreColor(type: type, pressed: configuration.isPressed, 326 scheme: colorScheme, contrast: colorSchemeContrast, disabled: disabled), 327 backColor: backColor(type: type, pressed: configuration.isPressed, disabled: disabled), 328 dimmed: dimmed, 329 configuration: configuration, 330 disabled: disabled, 331 narrow: narrow, 332 aligned: aligned, 333 badge: badge, 334 scheme: colorScheme, 335 contrast: colorSchemeContrast) 336 } 337 338 func foreColor(type: TalerButtonStyleType, 339 pressed: Bool, 340 scheme: ColorScheme, 341 contrast: ColorSchemeContrast, 342 disabled: Bool) -> Color { 343 if type == .plain { 344 return WalletColors().fieldForeground // primary text color 345 } 346 return WalletColors().buttonForeColor(pressed: pressed, 347 disabled: disabled, 348 scheme: scheme, 349 contrast: contrast, 350 prominent: type == .prominent) 351 } 352 func backColor(type: TalerButtonStyleType, pressed: Bool, disabled: Bool) -> Color { 353 if type == .plain && !pressed { 354 return Color.clear 355 } 356 return WalletColors().buttonBackColor(pressed: pressed, 357 disabled: disabled, 358 prominent: type == .prominent) 359 } 360 361 struct BackgroundView: View { 362 let color: Color 363 let dimmed: Bool 364 var body: some View { 365 RoundedRectangle( 366 cornerRadius: 15, 367 style: .continuous 368 ) 369 .fill(color) 370 .opacity(dimmed ? 0.6 : 1.0) 371 } 372 } 373 374 struct MyBigButton: View { 375 // var type: TalerButtonStyleType 376 let foreColor: Color 377 let backColor: Color 378 let dimmed: Bool 379 let configuration: ButtonStyle.Configuration 380 let disabled: Bool 381 let narrow: Bool 382 let aligned: TextAlignment 383 var badge: String 384 var scheme: ColorScheme 385 var contrast: ColorSchemeContrast 386 387 var body: some View { 388 let aligned2: Alignment = (aligned == .center) ? Alignment.center 389 : (aligned == .leading) ? Alignment.leading 390 : Alignment.trailing 391 let hasBadge = badge.count > 0 392 let buttonLabel = configuration.label 393 .multilineTextAlignment(aligned) 394 .talerFont(.title3) // narrow ? .title3 : .title2 395 .frame(maxWidth: narrow ? nil : .infinity, alignment: aligned2) 396 .padding(.vertical, 10) 397 .padding(.horizontal, hasBadge ? 0 : 6) 398 .foregroundColor(foreColor) 399 .background(BackgroundView(color: backColor, dimmed: dimmed)) 400 .contentShape(Rectangle()) // make sure the button can be pressed even if backgroundColor == clear 401 .scaleEffect(configuration.isPressed ? 0.95 : 1) 402 .animation(.spring(response: 0.1), value: configuration.isPressed) 403 .disabled(disabled) 404 if hasBadge { 405 let badgeColor: Color = (badge == CONFIRM_BANK) ? WalletColors().confirm 406 : WalletColors().attention 407 let badgeV = Image(systemName: badge) 408 .talerFont(.caption) 409 HStack(alignment: .top, spacing: 0) { 410 badgeV.foregroundColor(.clear) 411 buttonLabel 412 badgeV.foregroundColor(badgeColor) 413 } 414 } else { 415 buttonLabel 416 } 417 } 418 } 419 } 420 // MARK: - 421 #if DEBUG 422 fileprivate struct ContentView_Previews: PreviewProvider { 423 static var previews: some View { 424 let testButtonTitle = String("Placeholder") 425 Button(testButtonTitle) {} 426 .buttonStyle(TalerButtonStyle(type: .bordered, aligned: .trailing)) 427 } 428 } 429 #endif