diff --git a/Projects/Shared/DesignSystem/Example/Sources/Typography/FontDetailView.swift b/Projects/Shared/DesignSystem/Example/Sources/Typography/FontDetailView.swift index 5dd6005..36d29e1 100644 --- a/Projects/Shared/DesignSystem/Example/Sources/Typography/FontDetailView.swift +++ b/Projects/Shared/DesignSystem/Example/Sources/Typography/FontDetailView.swift @@ -12,7 +12,7 @@ import DesignSystem struct FontDetailView: View { var body: some View { - VStack(alignment: .leading, spacing: 10) { + VStack(alignment: .leading, spacing: .zero) { Text("Time") .font(Typography.time) Text("Header1") diff --git a/Projects/Shared/DesignSystem/Sources/Component/Button/Box/BoxButtonStyleSize.swift b/Projects/Shared/DesignSystem/Sources/Component/Button/Box/BoxButtonStyleSize.swift index d105a0f..09412b8 100644 --- a/Projects/Shared/DesignSystem/Sources/Component/Button/Box/BoxButtonStyleSize.swift +++ b/Projects/Shared/DesignSystem/Sources/Component/Button/Box/BoxButtonStyleSize.swift @@ -26,7 +26,7 @@ extension BoxButtonStyleSize { } } - var font: Font { + var font: Typography { switch self { case .large: Typography.header5 diff --git a/Projects/Shared/DesignSystem/Sources/Component/Button/Text/TextButtonStyleSize.swift b/Projects/Shared/DesignSystem/Sources/Component/Button/Text/TextButtonStyleSize.swift index 7313bcf..5650277 100644 --- a/Projects/Shared/DesignSystem/Sources/Component/Button/Text/TextButtonStyleSize.swift +++ b/Projects/Shared/DesignSystem/Sources/Component/Button/Text/TextButtonStyleSize.swift @@ -26,7 +26,7 @@ extension TextButtonStyleSize { } } - var font: Font { + var font: Typography { switch self { case .large: Typography.header5 diff --git a/Projects/Shared/DesignSystem/Sources/Font/Typography.swift b/Projects/Shared/DesignSystem/Sources/Font/Typography.swift new file mode 100644 index 0000000..83407db --- /dev/null +++ b/Projects/Shared/DesignSystem/Sources/Font/Typography.swift @@ -0,0 +1,157 @@ +// +// Typography.swift +// DesignSystem +// +// Created by devMinseok on 8/5/24. +// Copyright © 2024 PomoNyang. All rights reserved. +// + +import SwiftUI + +public enum Typography { + case time + case header1 + case header2 + case header3 + case header4 + case header5 + case bodySB + case bodyR + case subBodySB + case subBodyR + case captionSB + case captionR +} + +extension Typography { + /// swiftui font + var font: Font { + return fontWeight.swiftUIFont(size: fontSize) + } + + /// 폰트 line height + var lineHeight: CGFloat { + switch self { + case .time: + return 77 + case .header1: + return 58 + case .header2: + return 41 + case .header3: + return 28 + case .header4: + return 25 + case .header5: + return 22 + case .bodySB: + return 22 + case .bodyR: + return 22 + case .subBodySB: + return 21 + case .subBodyR: + return 21 + case .captionSB: + return 16 + case .captionR: + return 16 + } + } + + /// 폰트 고유 line height + var inherentLineHeight: CGFloat { + // swiftui의 Font는 고유 lineHeight를 못가져오기에 UIFont에서 가져옴 + return fontWeight.font(size: fontSize).lineHeight + } + + /// 폰트 letter spacing + var letterSpacing: CGFloat { + switch self { + case .time: + return -1.28 + case .header1: + return -0.96 + case .header2: + return -0.68 + case .header3: + return -0.48 + case .header4: + return -0.4 + case .header5: + return -0.36 + case .bodySB: + return -0.32 + case .bodyR: + return -0.32 + case .subBodySB: + return -0.28 + case .subBodyR: + return -0.28 + case .captionSB: + return -0.12 + case .captionR: + return -0.12 + } + } + + /// 폰트 size + private var fontSize: CGFloat { + switch self { + case .time: + return 64 + case .header1: + return 48 + case .header2: + return 34 + case .header3: + return 24 + case .header4: + return 20 + case .header5: + return 18 + case .bodySB: + return 16 + case .bodyR: + return 16 + case .subBodySB: + return 14 + case .subBodyR: + return 14 + case .captionSB: + return 12 + case .captionR: + return 12 + } + } + + /// 폰트 weight + private var fontWeight: DesignSystemFontConvertible { + switch self { + case .time: + return DesignSystemFontFamily.Pretendard.bold + case .header1: + return DesignSystemFontFamily.Pretendard.bold + case .header2: + return DesignSystemFontFamily.Pretendard.bold + case .header3: + return DesignSystemFontFamily.Pretendard.bold + case .header4: + return DesignSystemFontFamily.Pretendard.semiBold + case .header5: + return DesignSystemFontFamily.Pretendard.semiBold + case .bodySB: + return DesignSystemFontFamily.Pretendard.semiBold + case .bodyR: + return DesignSystemFontFamily.Pretendard.regular + case .subBodySB: + return DesignSystemFontFamily.Pretendard.semiBold + case .subBodyR: + return DesignSystemFontFamily.Pretendard.regular + case .captionSB: + return DesignSystemFontFamily.Pretendard.semiBold + case .captionR: + return DesignSystemFontFamily.Pretendard.regular + } + } +} diff --git a/Projects/Shared/DesignSystem/Sources/Font/View+Typography.swift b/Projects/Shared/DesignSystem/Sources/Font/View+Typography.swift new file mode 100644 index 0000000..833c698 --- /dev/null +++ b/Projects/Shared/DesignSystem/Sources/Font/View+Typography.swift @@ -0,0 +1,19 @@ +// +// View+Typography.swift +// DesignSystem +// +// Created by devMinseok on 8/10/24. +// Copyright © 2024 PomoNyang. All rights reserved. +// + +import SwiftUI + +extension View { + public func font(_ typography: Typography) -> some View { + return self + .font(typography.font) + .lineSpacing(typography.lineHeight - typography.inherentLineHeight) + .kerning(typography.letterSpacing) + .padding(.vertical, (typography.lineHeight - typography.inherentLineHeight) / 2) + } +} diff --git a/Projects/Shared/DesignSystem/Sources/Typography.swift b/Projects/Shared/DesignSystem/Sources/Typography.swift deleted file mode 100644 index 75eeb60..0000000 --- a/Projects/Shared/DesignSystem/Sources/Typography.swift +++ /dev/null @@ -1,24 +0,0 @@ -// -// Typography.swift -// DesignSystem -// -// Created by devMinseok on 8/5/24. -// Copyright © 2024 PomoNyang. All rights reserved. -// - -import SwiftUI - -public enum Typography { - public static let time = DesignSystemFontFamily.Pretendard.bold.swiftUIFont(size: 64) - public static let header1 = DesignSystemFontFamily.Pretendard.bold.swiftUIFont(size: 48) - public static let header2 = DesignSystemFontFamily.Pretendard.bold.swiftUIFont(size: 34) - public static let header3 = DesignSystemFontFamily.Pretendard.bold.swiftUIFont(size: 24) - public static let header4 = DesignSystemFontFamily.Pretendard.bold.swiftUIFont(size: 20) - public static let header5 = DesignSystemFontFamily.Pretendard.semiBold.swiftUIFont(size: 18) - public static let bodySB = DesignSystemFontFamily.Pretendard.semiBold.swiftUIFont(size: 16) - public static let bodyR = DesignSystemFontFamily.Pretendard.regular.swiftUIFont(size: 16) - public static let subBodySB = DesignSystemFontFamily.Pretendard.semiBold.swiftUIFont(size: 14) - public static let subBodyR = DesignSystemFontFamily.Pretendard.regular.swiftUIFont(size: 14) - public static let captionSB = DesignSystemFontFamily.Pretendard.semiBold.swiftUIFont(size: 12) - public static let captionR = DesignSystemFontFamily.Pretendard.regular.swiftUIFont(size: 12) -}