taler-ios

iOS apps for GNU Taler (wallet)
Log | Files | Refs | README | LICENSE

SegmentControl.swift (5307B)


      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 
     10 struct SegmentControl: View {
     11     @Binding var value: Int
     12     let accountDetails: [ExchangeAccountDetails]
     13     let action: (Int) -> Void
     14 
     15     @Environment(\.colorScheme) private var colorScheme
     16     @Environment(\.colorSchemeContrast) private var colorSchemeContrast
     17 
     18     @State private var selectedAccount = 0
     19     @ScaledMetric var frameHeight = 80       // relative to fontSize
     20 
     21     public var body: some View {
     22         let count = accountDetails.count
     23       if count > 0 {
     24         ZStack(alignment: .center) {
     25             GeometryReader { geo in
     26                 RoundedRectangle(cornerRadius: 6.0)
     27                     .foregroundColor(WalletColors().pickerSelected(colorScheme, colorSchemeContrast))
     28                     .cornerRadius(6.0)
     29                     .padding(4)
     30                     .frame(width: geo.size.width / CGFloat(count))
     31                     .offset(x: geo.size.width / CGFloat(count) * CGFloat(selectedAccount), y: 0)
     32             }
     33             .frame(height: frameHeight)
     34 
     35             HStack(spacing: 0) {
     36                 ForEach((0..<count), id: \.self) { index in
     37                     let detail = accountDetails[index]
     38                     let specs = detail.currencySpecification
     39                     let scope = detail.scope
     40                     let amount = detail.transferAmount
     41                     let formatted = amount?.formatted(specs: specs,
     42                                                  isNegative: false,
     43                                                       scope: scope,
     44                                                      useISO: false)
     45                                     ?? (EMPTYSTRING, EMPTYSTRING)
     46                     let bankName = detail.bankLabel
     47                     let a11yLabel = bankName != nil ? (bankName! + SPACE + formatted.1)
     48                                                     : formatted.1
     49 //            let _ = print(amountStr)
     50                     VStack(spacing: 6) {
     51                         Text(formatted.0)
     52                             .talerFont(.title3)
     53                         if let bankName {
     54                             Text(bankName)
     55                                 .talerFont(.subheadline)
     56                         }
     57                     }
     58                     .accessibilityElement(children: .combine)
     59                     .accessibilityLabel(a11yLabel)
     60                     .accessibilityAddTraits(.isButton)
     61                     .accessibilityAddTraits(index == selectedAccount ? .isSelected : [])
     62                     .frame(maxWidth: .infinity)
     63                     .onTapGesture {
     64                         withAnimation(.easeInOut(duration: 0.150)) {
     65                             selectedAccount = index
     66                         }
     67                     }
     68                 }
     69             }
     70         }
     71         .onAppear() {
     72             if selectedAccount != value {
     73                 withAnimation { selectedAccount = value }
     74             }
     75         }
     76         .onChange(of: selectedAccount) { selected in
     77             action(selected)
     78         }
     79         .background(
     80             RoundedRectangle(cornerRadius: 6.0)
     81                 .fill(WalletColors().sideBackgroundColor)
     82         )
     83       }
     84     } // body
     85 }
     86 
     87 struct SegmentControl2: View {
     88     @Binding var value: Int
     89     let strings: [String]
     90 //    let action: (Int) -> Void
     91 
     92     @Environment(\.colorScheme) private var colorScheme
     93     @Environment(\.colorSchemeContrast) private var colorSchemeContrast
     94 
     95     public var body: some View {
     96         let count = strings.count
     97         if count > 0 {
     98             ZStack(alignment: .center) {
     99                 GeometryReader { geo in
    100                     RoundedRectangle(cornerRadius: 6.0)
    101                         .foregroundColor(WalletColors().pickerSelected(colorScheme, colorSchemeContrast))
    102                         .cornerRadius(6.0)
    103                         .padding(4)
    104                         .frame(width: geo.size.width / CGFloat(count))
    105                         .offset(x: geo.size.width / CGFloat(count) * CGFloat(value), y: 0)
    106                 }
    107 
    108                 HStack(spacing: 0) {
    109                     ForEach((0..<count), id: \.self) { index in
    110                         let string = strings[index]
    111                         VStack(spacing: 6) {
    112                             Text(string)
    113                                 .talerFont(.title3)
    114                         }
    115                         .padding(.vertical, 8)
    116                         .accessibilityElement(children: .combine)
    117 //                        .accessibilityLabel(a11yLabel)
    118                         .accessibilityAddTraits(.isButton)
    119                         .accessibilityAddTraits(index == value ? .isSelected : [])
    120                         .frame(maxWidth: .infinity)
    121                         .onTapGesture {
    122 //                            action(index)
    123                             withAnimation(.easeInOut(duration: 0.150)) {
    124                                 value = index
    125                             }
    126                         }
    127                     }
    128                 }
    129             }
    130             .background(
    131                 RoundedRectangle(cornerRadius: 6.0)
    132                     .fill(WalletColors().sideBackgroundColor)
    133             )
    134         }
    135     } // body
    136 }