diff options
author | Marc Stibane <marc@taler.net> | 2023-10-26 13:20:00 +0200 |
---|---|---|
committer | Marc Stibane <marc@taler.net> | 2023-10-26 13:20:00 +0200 |
commit | b6f58466c05d234e59ce2d8c0449cd06fcc67ad4 (patch) | |
tree | ab72f6ae54c7265ed4f9a72c63529ae84ee23b58 | |
parent | 3a8281d21ab537309bacc0b44266c647fec8e3a0 (diff) | |
download | taler-ios-b6f58466c05d234e59ce2d8c0449cd06fcc67ad4.tar.gz taler-ios-b6f58466c05d234e59ce2d8c0449cd06fcc67ad4.tar.bz2 taler-ios-b6f58466c05d234e59ce2d8c0449cd06fcc67ad4.zip |
Fixed Balances layout for dynamic font sizes
(Previews work again)
-rw-r--r-- | TalerWallet1/Views/Balances/BalanceRowView.swift | 54 | ||||
-rw-r--r-- | TalerWallet1/Views/Balances/PendingRowView.swift | 32 | ||||
-rw-r--r-- | TalerWallet1/Views/Exchange/ExchangeRowView.swift | 2 | ||||
-rw-r--r-- | TalerWallet1/Views/HelperViews/View+needVStack.swift | 57 |
4 files changed, 96 insertions, 49 deletions
diff --git a/TalerWallet1/Views/Balances/BalanceRowView.swift b/TalerWallet1/Views/Balances/BalanceRowView.swift index 8319782..fabbe63 100644 --- a/TalerWallet1/Views/Balances/BalanceRowView.swift +++ b/TalerWallet1/Views/Balances/BalanceRowView.swift @@ -35,6 +35,7 @@ struct BalanceLabel: View { struct BalanceButton: View { let amountStr: String + let correctForSize: CGFloat let rowAction: () -> Void @AppStorage("iconOnly") var iconOnly: Bool = false @@ -44,11 +45,11 @@ struct BalanceButton: View { Button(action: rowAction) { SingleAxisGeometryReader { width in Group { - let balancesFont = TalerFont.uiFont(.title2) - let amountFont = TalerFont.uiFont(.title) - let titles = [(balanceTitle, balancesFont), - (amountStr, amountFont)] - let needVStack = !iconOnly && Self.needVStack(titles, width: width, spacing: HSPACING, sameSize: false) + let titles = [(balanceTitle, TalerFont.uiFont(.title2)), + (amountStr, TalerFont.uiFont(.title))] + let needVStack = !iconOnly && Self.needVStack(titles, width: width, + correctForSize: correctForSize, + spacing: HSPACING, sameSize: false) if needVStack { VStack(alignment: .leading, spacing: 0) { BalanceLabel(balanceTitle: balanceTitle, horizontal: false, amountStr: amountStr, iconOnly: iconOnly) @@ -85,10 +86,12 @@ struct BalanceRowView: View { let requestTitle2 = String(localized: "Payment", comment: "Bottom of button <Request Payment>") var body: some View { + let correctForSize = Self.correctForSize(sizeCategory) SingleAxisGeometryReader { width in VStack (alignment: .trailing) { let amountStr = currencyInfo?.string(for: amount.valueAsTuple) BalanceButton(amountStr: amountStr ?? amount.valueStr, + correctForSize: correctForSize, rowAction: rowAction) let uiFont = TalerFont.uiFont(.title3) let titles = [(requestTitle1, uiFont), (requestTitle2, uiFont), (sendTitle1, uiFont), (sendTitle2, uiFont)] @@ -98,7 +101,7 @@ struct BalanceRowView: View { lineLimit: 5, sendDisabled: amount.isZero, sendAction: sendAction, recvAction: recvAction) // let _ = print("Screenwidth: \(UIScreen.screenWidth) Geometry: \(width) \(sizeCategory): \(sizeCategory)") - if Self.needVStack(titles, width: width, spacing: HSPACING) { + if Self.needVStack(titles, width: width, correctForSize: correctForSize, spacing: HSPACING) { VStack { twoRowButtons } } else { HStack(spacing: HSPACING) { twoRowButtons } @@ -109,31 +112,42 @@ struct BalanceRowView: View { } } // MARK: - -#if false // DEBUG -struct BalanceRowView_Previews: PreviewProvider { - static var previews: some View { +#if DEBUG + +struct SomeBalanceRows: View { + @Environment(\.sizeCategory) var sizeCategory + + var body: some View { + let testInfo = PreviewCurrencyInfo(TESTCURRENCY, digits: 0) + let demoInfo = PreviewCurrencyInfo(TESTCURRENCY, digits: 2) let test = try! Amount(fromString: TESTCURRENCY + ":1.23") - let demo = try! Amount(fromString: DEMOCURRENCY + ":1234.56") + let demo = try! Amount(fromString: DEMOCURRENCY + ":1234.12") + let testStr = testInfo.string(for: test.valueAsTuple) + let demoStr = demoInfo.string(for: demo.valueAsTuple) + + let correctForSize = Self.correctForSize(sizeCategory) + List { Section { - HStack(alignment: .lastTextBaseline) { - BalanceLabel(balanceTitle: "BalanceA:", horizontal: true, amountStr: test.valueStr, iconOnly: false) - .listRowSeparator(.hidden) - } - } - Section { - BalanceLabel(balanceTitle: "Balance:", horizontal: false, amountStr: demo.valueStr, iconOnly: false) + BalanceLabel(balanceTitle: "Balance:", horizontal: false, amountStr: demoStr, iconOnly: false) .listRowSeparator(.hidden) } Section { - BalanceButton(amountStr: demo.valueStr, rowAction: {}) + BalanceButton(amountStr: testStr, correctForSize: correctForSize, rowAction: {}) .listRowSeparator(.hidden) } Section { - BalanceRowView(amount: demo, sendAction: {}, recvAction: {}, rowAction: {}) + BalanceRowView(amount: demo, currencyInfo: demoInfo, sendAction: {}, recvAction: {}, rowAction: {}) } - BalanceRowView(amount: test, sendAction: {}, recvAction: {}, rowAction: {}) + BalanceRowView(amount: test, currencyInfo: testInfo, sendAction: {}, recvAction: {}, rowAction: {}) } + + } +} + +struct BalanceRowView_Previews: PreviewProvider { + static var previews: some View { + SomeBalanceRows() } } #endif diff --git a/TalerWallet1/Views/Balances/PendingRowView.swift b/TalerWallet1/Views/Balances/PendingRowView.swift index 6604bc1..f999c3f 100644 --- a/TalerWallet1/Views/Balances/PendingRowView.swift +++ b/TalerWallet1/Views/Balances/PendingRowView.swift @@ -139,24 +139,30 @@ struct PendingRowView: View { } // MARK: - #if DEBUG + +func PreviewCurrencyInfo(_ currency: String, digits: Int) -> CurrencyInfo { + let unitName = digits == 0 ? "¥" : "€" + let scope = ScopeInfo(type: .global, currency: currency) + let specs = CurrencySpecification(name: TESTCURRENCY, +// decimalSeparator: ".", groupSeparator: "'", + fractionalInputDigits: digits, + fractionalNormalDigits: digits, + fractionalTrailingZeroDigits: digits, +// isCurrencyNameLeading: true, + altUnitNames: [0 : unitName]) + let formatter = CurrencyFormatter.formatter(scope: scope, specs: specs) + return CurrencyInfo(scope: scope, specs: specs, formatter: formatter) +} + struct PendingRowView_Previews: PreviewProvider { static var previews: some View { - let scope = ScopeInfo(type: .global, currency: TESTCURRENCY) - let specs = CurrencySpecification(name: TESTCURRENCY, -// decimalSeparator: ".", groupSeparator: "'", - fractionalInputDigits: 0, - fractionalNormalDigits: 0, - fractionalTrailingZeroDigits: 0, -// isCurrencyNameLeading: true, - altUnitNames: [0 : "¥"]) - let formatter = CurrencyFormatter.formatter(scope: scope, - specs: specs) - let currencyInfo = CurrencyInfo(scope: scope, specs: specs, formatter: formatter) + let testInfo = PreviewCurrencyInfo(TESTCURRENCY, digits: 0) + let demoInfo = PreviewCurrencyInfo(TESTCURRENCY, digits: 2) let test = try! Amount(fromString: TESTCURRENCY + ":1.23") let demo = try! Amount(fromString: DEMOCURRENCY + ":1234.56") List { - PendingRowView(amount: test, currencyInfo: currencyInfo, incoming: true) - PendingRowView(amount: demo, currencyInfo: currencyInfo, incoming: false) + PendingRowView(amount: test, currencyInfo: testInfo, incoming: true) + PendingRowView(amount: demo, currencyInfo: demoInfo, incoming: false) } } } diff --git a/TalerWallet1/Views/Exchange/ExchangeRowView.swift b/TalerWallet1/Views/Exchange/ExchangeRowView.swift index fa08d80..f1cf984 100644 --- a/TalerWallet1/Views/Exchange/ExchangeRowView.swift +++ b/TalerWallet1/Views/Exchange/ExchangeRowView.swift @@ -59,7 +59,7 @@ struct ExchangeRowView: View { lineLimit: 5, sendDisabled: true, // TODO: amount.isZero sendAction: { selectAndUpdate(1) }, recvAction: { selectAndUpdate(2) }) - if Self.needVStack(titles, width: width, spacing: HSPACING + 4, currency: currency) { + if Self.needVStack(titles, width: width, correctForSize: 1.0, spacing: HSPACING + 4) { VStack { twoRowButtons } } else { HStack(spacing: HSPACING) { twoRowButtons } diff --git a/TalerWallet1/Views/HelperViews/View+needVStack.swift b/TalerWallet1/Views/HelperViews/View+needVStack.swift index fc6f18b..689a81d 100644 --- a/TalerWallet1/Views/HelperViews/View+needVStack.swift +++ b/TalerWallet1/Views/HelperViews/View+needVStack.swift @@ -11,33 +11,60 @@ extension View { /// if !sameSize then all titles are added with spacing static func needVStack(_ titles: [(String, UIFont)], width: CGFloat, // total width available + correctForSize: CGFloat, spacing: CGFloat, // between titles sameSize: Bool = true, - numViews: Int = 2, - currency: String = "") + numViews: Int = 2) -> Bool { let padding: CGFloat = 20 // TODO: depend on myListStyle - var maxTitleWidth: CGFloat = 0 - var totalWidth = padding + let totalSpacing = spacing * CGFloat(numViews - 1) + var totalWidth = padding + totalSpacing + var maxTitleWidth: CGFloat = 0 + var minTitleWidth: CGFloat = 1000 for (title, uiFont) in titles { let titleWidth = title.widthOfString(usingUIFont: uiFont) - if titleWidth > maxTitleWidth { - maxTitleWidth = titleWidth + let fixWidth = round(CGFloat(Int(20 * titleWidth * correctForSize))) / 20 + if fixWidth > maxTitleWidth { + maxTitleWidth = fixWidth + } + if fixWidth < minTitleWidth { + minTitleWidth = fixWidth } - totalWidth += titleWidth + totalWidth += fixWidth } - let neededWidth = padding + maxTitleWidth - let totalSpacing = spacing * CGFloat(numViews - 1) - let availableWidth = (width / CGFloat(numViews)) - totalSpacing - totalWidth += totalSpacing if sameSize { - print("❗️\(currency) available: \(availableWidth) needed: \(neededWidth)") + let availableWidth = (width / CGFloat(numViews)) - totalSpacing + let neededWidth = padding + maxTitleWidth +// if width > 20 { +// print("❗️ available: \(availableWidth) needed: \(neededWidth)") +// } + return neededWidth > availableWidth } else { - print("❗️\(currency) width: \(width) total: \(totalWidth)") +// if width > 20 { +// let (amount, font) = titles[1] +// print("❗️ view width: \(width) total: \(totalWidth) min: \(minTitleWidth) max: \(maxTitleWidth) \(amount)") +// } + return totalWidth > width + } + } + + static func correctForSize(_ sizeCategory: ContentSizeCategory) -> CGFloat { + return switch sizeCategory { + case .extraSmall: 0.7 + case .small: 0.8 + case .medium: 0.9 + case .large: 1.0 + case .extraLarge: 1.15 + case .extraExtraLarge: 1.25 + case .extraExtraExtraLarge: 1.33 + case .accessibilityMedium: 1.52 + case .accessibilityLarge: 1.8 + case .accessibilityExtraLarge: 2.0 + case .accessibilityExtraExtraLarge: 2.2 + case .accessibilityExtraExtraExtraLarge: 2.5 + default: 1.0 } - return sameSize ? neededWidth > availableWidth - : totalWidth > width } } |