From b6e0413a28ba07f7a277d90f855ce721e47e7acd Mon Sep 17 00:00:00 2001 From: devminseok Date: Sat, 10 Aug 2024 09:28:29 +0900 Subject: [PATCH] =?UTF-8?q?=ED=8F=B0=ED=8A=B8=20DS=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Sources/Typography/FontDetailView.swift | 2 +- .../Button/Box/BoxButtonStyleSize.swift | 2 +- .../Button/Text/TextButtonStyleSize.swift | 2 +- .../Sources/Font/Typography.swift | 157 ++++++++++++++++++ .../Sources/Font/View+Typography.swift | 19 +++ .../DesignSystem/Sources/Typography.swift | 24 --- 6 files changed, 179 insertions(+), 27 deletions(-) create mode 100644 Projects/Shared/DesignSystem/Sources/Font/Typography.swift create mode 100644 Projects/Shared/DesignSystem/Sources/Font/View+Typography.swift delete mode 100644 Projects/Shared/DesignSystem/Sources/Typography.swift diff --git a/Projects/Shared/DesignSystem/Example/Sources/Typography/FontDetailView.swift b/Projects/Shared/DesignSystem/Example/Sources/Typography/FontDetailView.swift index 5dd60052..36d29e12 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 d105a0ff..09412b8b 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 7313bcf8..5650277a 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 00000000..83407dbb --- /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 00000000..ee429119 --- /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) + .kerning(typography.letterSpacing) + .lineSpacing(typography.lineHeight - typography.inherentLineHeight) + .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 75eeb607..00000000 --- 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) -}