Mercurial > public > simoleon
changeset 6:3d6f56b0d4ed
Implementing first UI layout
author | Dennis Concepción Martín <dennisconcepcionmartin@gmail.com> |
---|---|
date | Sun, 11 Jul 2021 18:03:56 +0100 |
parents | 115fbbbee06f |
children | 8dad7eaac2c6 |
files | Simoleon.xcodeproj/project.pbxproj Simoleon.xcodeproj/project.xcworkspace/xcuserdata/dennis.xcuserdatad/UserInterfaceState.xcuserstate Simoleon/Helpers/BigFlagsPair.swift Simoleon/Helpers/CurrencyRow.swift Simoleon/Helpers/FlagsPair.swift Simoleon/Helpers/MainCurrencyRow.swift Simoleon/Helpers/SearchBar.swift Simoleon/Helpers/SmallFlagsPair.swift Simoleon/Preview Content/CurrencyQuoteData.json |
diffstat | 9 files changed, 228 insertions(+), 84 deletions(-) [+] |
line wrap: on
line diff
--- a/Simoleon.xcodeproj/project.pbxproj Sun Jul 11 16:20:57 2021 +0100 +++ b/Simoleon.xcodeproj/project.pbxproj Sun Jul 11 18:03:56 2021 +0100 @@ -7,13 +7,15 @@ objects = { /* Begin PBXBuildFile section */ - 9555932C269B0390000FD726 /* FlagsPair.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9555932B269B0390000FD726 /* FlagsPair.swift */; }; + 9555932C269B0390000FD726 /* BigFlagsPair.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9555932B269B0390000FD726 /* BigFlagsPair.swift */; }; 95559330269B08CE000FD726 /* MainCurrencyRow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9555932F269B08CE000FD726 /* MainCurrencyRow.swift */; }; 95559333269B0965000FD726 /* CurrencyQuoteModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 95559332269B0965000FD726 /* CurrencyQuoteModel.swift */; }; 95559337269B0A7B000FD726 /* CurrencyQuoteData.json in Resources */ = {isa = PBXBuildFile; fileRef = 95559336269B0A7B000FD726 /* CurrencyQuoteData.json */; }; 9555933A269B0AB8000FD726 /* ParseJson.swift in Sources */ = {isa = PBXBuildFile; fileRef = 95559339269B0AB8000FD726 /* ParseJson.swift */; }; 9555933D269B0E0A000FD726 /* Currencies.json in Resources */ = {isa = PBXBuildFile; fileRef = 9555933C269B0E0A000FD726 /* Currencies.json */; }; 9555933F269B0E47000FD726 /* CurrencyModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9555933E269B0E47000FD726 /* CurrencyModel.swift */; }; + 956C28CA269B5893005A4595 /* CurrencyRow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 956C28C9269B5893005A4595 /* CurrencyRow.swift */; }; + 956C28CC269B58A0005A4595 /* SmallFlagsPair.swift in Sources */ = {isa = PBXBuildFile; fileRef = 956C28CB269B58A0005A4595 /* SmallFlagsPair.swift */; }; 95C5B2282697752600941585 /* SimoleonApp.swift in Sources */ = {isa = PBXBuildFile; fileRef = 95C5B2272697752600941585 /* SimoleonApp.swift */; }; 95C5B22A2697752600941585 /* ContentView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 95C5B2292697752600941585 /* ContentView.swift */; }; 95C5B22C2697752700941585 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 95C5B22B2697752700941585 /* Assets.xcassets */; }; @@ -44,13 +46,15 @@ /* End PBXContainerItemProxy section */ /* Begin PBXFileReference section */ - 9555932B269B0390000FD726 /* FlagsPair.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FlagsPair.swift; sourceTree = "<group>"; }; + 9555932B269B0390000FD726 /* BigFlagsPair.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = BigFlagsPair.swift; sourceTree = "<group>"; }; 9555932F269B08CE000FD726 /* MainCurrencyRow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainCurrencyRow.swift; sourceTree = "<group>"; }; 95559332269B0965000FD726 /* CurrencyQuoteModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CurrencyQuoteModel.swift; sourceTree = "<group>"; }; 95559336269B0A7B000FD726 /* CurrencyQuoteData.json */ = {isa = PBXFileReference; lastKnownFileType = text.json; path = CurrencyQuoteData.json; sourceTree = "<group>"; }; 95559339269B0AB8000FD726 /* ParseJson.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ParseJson.swift; sourceTree = "<group>"; }; 9555933C269B0E0A000FD726 /* Currencies.json */ = {isa = PBXFileReference; lastKnownFileType = text.json; path = Currencies.json; sourceTree = "<group>"; }; 9555933E269B0E47000FD726 /* CurrencyModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CurrencyModel.swift; sourceTree = "<group>"; }; + 956C28C9269B5893005A4595 /* CurrencyRow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CurrencyRow.swift; sourceTree = "<group>"; }; + 956C28CB269B58A0005A4595 /* SmallFlagsPair.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SmallFlagsPair.swift; sourceTree = "<group>"; }; 95C5B2242697752600941585 /* Simoleon.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = Simoleon.app; sourceTree = BUILT_PRODUCTS_DIR; }; 95C5B2272697752600941585 /* SimoleonApp.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SimoleonApp.swift; sourceTree = "<group>"; }; 95C5B2292697752600941585 /* ContentView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ContentView.swift; sourceTree = "<group>"; }; @@ -197,8 +201,10 @@ isa = PBXGroup; children = ( 95FE659B269AFB54008745DE /* SearchBar.swift */, - 9555932B269B0390000FD726 /* FlagsPair.swift */, + 9555932B269B0390000FD726 /* BigFlagsPair.swift */, + 956C28CB269B58A0005A4595 /* SmallFlagsPair.swift */, 9555932F269B08CE000FD726 /* MainCurrencyRow.swift */, + 956C28C9269B5893005A4595 /* CurrencyRow.swift */, ); path = Helpers; sourceTree = "<group>"; @@ -335,11 +341,13 @@ isa = PBXSourcesBuildPhase; buildActionMask = 2147483647; files = ( + 956C28CA269B5893005A4595 /* CurrencyRow.swift in Sources */, + 956C28CC269B58A0005A4595 /* SmallFlagsPair.swift in Sources */, 9555933F269B0E47000FD726 /* CurrencyModel.swift in Sources */, 95559330269B08CE000FD726 /* MainCurrencyRow.swift in Sources */, 95C5B2312697752700941585 /* Persistence.swift in Sources */, 9555933A269B0AB8000FD726 /* ParseJson.swift in Sources */, - 9555932C269B0390000FD726 /* FlagsPair.swift in Sources */, + 9555932C269B0390000FD726 /* BigFlagsPair.swift in Sources */, 95C5B22A2697752600941585 /* ContentView.swift in Sources */, 95FE659C269AFB54008745DE /* SearchBar.swift in Sources */, 95559333269B0965000FD726 /* CurrencyQuoteModel.swift in Sources */,
Binary file Simoleon.xcodeproj/project.xcworkspace/xcuserdata/dennis.xcuserdatad/UserInterfaceState.xcuserstate has changed
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/Simoleon/Helpers/BigFlagsPair.swift Sun Jul 11 18:03:56 2021 +0100 @@ -0,0 +1,44 @@ +// +// BigFlagsPair.swift +// Simoleon +// +// Created by Dennis Concepción Martín on 11/07/2021. +// + +import SwiftUI + +struct BigFlagsPair: View { + var mainCurrencyFlag: String + var secondaryCurrencyFlag: String + + var body: some View { + VStack { + Image(secondaryCurrencyFlag) + .flagModifier(80) + + Image(mainCurrencyFlag) + .flagModifier(80) + .offset(x: 40, y: -60) + .padding(.bottom, -60) + + + } + .padding(.trailing, 40) + } +} +extension Image { + func flagModifier(_ size: CGFloat) -> some View { + self + .resizable() + .aspectRatio(contentMode: .fill) + .clipShape(Circle()) + .overlay(Circle().stroke(Color("FlagBorder"), lineWidth: 2)) + .frame(width: size, height: size) + } +} + +struct FlagsPair_Previews: PreviewProvider { + static var previews: some View { + BigFlagsPair(mainCurrencyFlag: "GB", secondaryCurrencyFlag: "US") + } +}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/Simoleon/Helpers/CurrencyRow.swift Sun Jul 11 18:03:56 2021 +0100 @@ -0,0 +1,68 @@ +// +// CurrencyRow.swift +// Simoleon +// +// Created by Dennis Concepción Martín on 11/07/2021. +// + +import SwiftUI + +struct CurrencyRow: View { + var currencyQuote: CurrencyQuoteModel + let currencies: [String: CurrencyModel] = parseJson("Currencies.json") + + var body: some View { + VStack { + RoundedRectangle(cornerRadius: 10) + .rectangleModifier(Color("Bone"), 100) + + RoundedRectangle(cornerRadius: 10) + .rectangleModifier(Color(.systemBackground), 100) + .overlay( + HStack { + let symbols = currencyQuote.symbol.split(separator: "/") + let mainCurrencyFlag = currencies[String(symbols[0])]!.flag + let SecondaryCurrencyFlag = currencies[String(symbols[1])]!.flag + + SmallFlagsPair(mainCurrencyFlag: mainCurrencyFlag, secondaryCurrencyFlag: SecondaryCurrencyFlag) + + VStack(alignment: .leading) { + Text("\(String(symbols[0]))") + .fontWeight(.semibold) + + Text("\(String(symbols[1]))") + .fontWeight(.semibold) + } + .padding(.horizontal) + + VStack(alignment: .leading) { + Text("Bid") + Text("\(currencyQuote.bid, specifier: "%.4f")") + .fontWeight(.semibold) + + } + .padding(.trailing) + + VStack(alignment: .leading) { + Text("Ask") + Text("\(currencyQuote.ask, specifier: "%.4f")") + .fontWeight(.semibold) + + } + } + ) + .offset(x: -10.0, y: -120.0) + .padding(.bottom, -120) + } + .padding(.leading, 10) + .padding(.horizontal) + } +} + +struct CurrencyRow_Previews: PreviewProvider { + static var previews: some View { + let currencyQuote: CurrencyQuoteModel = parseJson("CurrencyQuoteData.json") + + CurrencyRow(currencyQuote: currencyQuote) + } +}
--- a/Simoleon/Helpers/FlagsPair.swift Sun Jul 11 16:20:57 2021 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,35 +0,0 @@ -// -// FlagsPair.swift -// Simoleon -// -// Created by Dennis Concepción Martín on 11/07/2021. -// - -import SwiftUI - -struct FlagsPair: View { - var mainCurrencyFlag: String - var secondaryCurrencyFlag: String - - var body: some View { - ZStack { - Image(secondaryCurrencyFlag) - .resizable() - .clipShape(Circle()) - .overlay(Circle().stroke(Color("FlagBorder"), lineWidth: 2)) - - Image(mainCurrencyFlag) - .resizable() - .clipShape(Circle()) - .overlay(Circle().stroke(Color("FlagBorder"), lineWidth: 2)) - .offset(x: 35.0, y: 25.0) - } - } -} - -struct FlagsPair_Previews: PreviewProvider { - static var previews: some View { - FlagsPair(mainCurrencyFlag: "GB", secondaryCurrencyFlag: "US") - .frame(width: 100, height: 100) - } -}
--- a/Simoleon/Helpers/MainCurrencyRow.swift Sun Jul 11 16:20:57 2021 +0100 +++ b/Simoleon/Helpers/MainCurrencyRow.swift Sun Jul 11 18:03:56 2021 +0100 @@ -12,47 +12,63 @@ let currencies: [String: CurrencyModel] = parseJson("Currencies.json") var body: some View { - ZStack { + VStack { RoundedRectangle(cornerRadius: 10) - .strokeBorder(Color("Border"), lineWidth: 2) - .background(RoundedRectangle(cornerRadius: 10).foregroundColor(Color("Bone"))) - .offset(x: 10, y: 10.0) + .rectangleModifier(Color("Bone"), 250) RoundedRectangle(cornerRadius: 10) - .strokeBorder(Color("Border"), lineWidth: 2) - .background(RoundedRectangle(cornerRadius: 10).foregroundColor(Color(.systemBackground))) + .rectangleModifier(Color(.systemBackground), 250) .overlay( VStack { + let symbols = currencyQuote.symbol.split(separator: "/") + let mainCurrencyFlag = currencies[String(symbols[0])]!.flag + let SecondaryCurrencyFlag = currencies[String(symbols[1])]!.flag HStack { - let currencySymbols = currencyQuote.symbol.components(separatedBy: "/") - let mainSymbol = currencySymbols[0] - let secondarySymbol = currencySymbols[1] - let mainCurrencyFlag = currencies[mainSymbol]!.flag - let secondaryCurrencyFlag = currencies[secondarySymbol]!.flag - FlagsPair(mainCurrencyFlag: mainCurrencyFlag, secondaryCurrencyFlag: secondaryCurrencyFlag) - .frame(width: 80, height: 80) + BigFlagsPair(mainCurrencyFlag: mainCurrencyFlag, secondaryCurrencyFlag: SecondaryCurrencyFlag) VStack(alignment: .leading) { Text("Bid") + .font(.title3) + Text("\(currencyQuote.bid, specifier: "%.4f")") + .font(.title3) .fontWeight(.semibold) } - .padding(.leading, 55) + .padding(.horizontal) VStack(alignment: .leading) { Text("Ask") + .font(.title3) + Text("\(currencyQuote.ask, specifier: "%.4f")") + .font(.title3) .fontWeight(.semibold) } - .padding(.horizontal) + .padding(.trailing) } + + Text("100 \(String(symbols[0])) is worth \(currencyQuote.ask*100, specifier: "%.2f") \(String(symbols[1]))") + .font(.title3) + .fontWeight(.semibold) + .padding() } ) + .offset(x: -10, y: -270) + .padding(.bottom, -270) } - .frame(height: 250) + .padding(.leading, 10) .padding(.horizontal) } } +extension RoundedRectangle { + func rectangleModifier(_ colour: Color, _ height: CGFloat) -> some View { + self + .strokeBorder(Color("Border"), lineWidth: 2) + .background(RoundedRectangle(cornerRadius: 10).foregroundColor(colour)) + .frame(height: height) + + } +} struct MainCurrencyRow_Previews: PreviewProvider { static var previews: some View {
--- a/Simoleon/Helpers/SearchBar.swift Sun Jul 11 16:20:57 2021 +0100 +++ b/Simoleon/Helpers/SearchBar.swift Sun Jul 11 18:03:56 2021 +0100 @@ -12,32 +12,40 @@ @Binding var isEditing: Bool var body: some View { - ZStack(alignment: .leading) { - TextField("Search", text: $text) - .padding(.leading, 50) - - Image(systemName: "magnifyingglass.circle") - .padding(.leading) - .imageScale(.large) - .opacity(0.3) - + VStack { + Capsule() + .capsuleModifier(Color("Bone")) + + Capsule() + .capsuleModifier(Color(.systemBackground)) + .overlay( + ZStack(alignment: .leading) { + TextField("Search", text: $text) + .padding(.leading, 55) + .padding(.trailing) + .padding(.vertical, 25) /// Expand tapable area + .contentShape(Capsule()) + + Image(systemName: "magnifyingglass.circle") + .imageScale(.large) + .opacity(0.3) + .padding(.leading) + } + ) + .offset(x: -7, y: -90) + .padding(.bottom, -90) } - .padding() - .background( - ZStack { - Capsule() - .strokeBorder(Color("Border"), lineWidth: 2) - .background(Capsule().foregroundColor(Color("Bone"))) - .offset(x: 7.0, y: 10.0) - - Capsule() - .strokeBorder(Color("Border"), lineWidth: 2) - .background(Capsule().foregroundColor(Color(.systemBackground))) - - - } - ) - .padding() + .padding(.leading, 7) + .padding(.horizontal) + + } +} +extension Capsule { + func capsuleModifier(_ colour: Color) -> some View { + self + .strokeBorder(Color("Border"), lineWidth: 2) + .background(Capsule().foregroundColor(colour)) + .frame(height: 70) } }
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/Simoleon/Helpers/SmallFlagsPair.swift Sun Jul 11 18:03:56 2021 +0100 @@ -0,0 +1,34 @@ +// +// SmallFlagsPair.swift +// Simoleon +// +// Created by Dennis Concepción Martín on 11/07/2021. +// + +import SwiftUI + +struct SmallFlagsPair: View { + var mainCurrencyFlag: String + var secondaryCurrencyFlag: String + + var body: some View { + VStack { + Image(secondaryCurrencyFlag) + .flagModifier(50) + + Image(mainCurrencyFlag) + .flagModifier(50) + .offset(x: 20, y: -40) + .padding(.bottom, -40) + + + } + .padding(.trailing, 20) + } +} + +struct SmallFlagsPair_Previews: PreviewProvider { + static var previews: some View { + SmallFlagsPair(mainCurrencyFlag: "GB", secondaryCurrencyFlag: "US") + } +}
--- a/Simoleon/Preview Content/CurrencyQuoteData.json Sun Jul 11 16:20:57 2021 +0100 +++ b/Simoleon/Preview Content/CurrencyQuoteData.json Sun Jul 11 18:03:56 2021 +0100 @@ -1,7 +1,8 @@ { - "p": 1.18741, - "a": 1.18746, - "b": 1.18736, + "p": 1.39011, + "a": 1.39016, + "b": 1.39006, "s": "GBP/USD", - "t": 1625864399258 + "t": 1625864399283 } +