Skip to content

Commit

Permalink
Merge pull request #1260 from wakmusic/1259-ui-fix-artist-detail-desc…
Browse files Browse the repository at this point in the history
…ription

🔀 :: (#1259) 아티스트 설명글 짤림 보완
  • Loading branch information
KangTaeHoon authored Aug 31, 2024
2 parents 883dc5c + cc94d2b commit 7f5ab7f
Show file tree
Hide file tree
Showing 3 changed files with 64 additions and 64 deletions.
18 changes: 7 additions & 11 deletions Projects/Features/ArtistFeature/Resources/Artist.storyboard
Original file line number Diff line number Diff line change
Expand Up @@ -151,16 +151,13 @@
<inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
</button>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="이세계아이돌" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="he6-oI-bGB">
<rect key="frame" x="16" y="56" width="166.33333333333334" height="24"/>
<constraints>
<constraint firstAttribute="height" constant="24" id="6B8-5r-FG8"/>
</constraints>
<rect key="frame" x="16" y="56" width="166.33333333333334" height="17"/>
<fontDescription key="fontDescription" type="system" weight="medium" pointSize="14"/>
<color key="textColor" red="0.062745098040000002" green="0.094117647060000004" blue="0.15686274510000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<nil key="highlightedColor"/>
</label>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="세계 최초의 무7도록 킹받는 아이돌그 뒤에 숨겨진 귀여움이 '좀 더' 킹받는 그녀" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="ne5-kV-2su">
<rect key="frame" x="16" y="92" width="166.33333333333334" height="50.333333333333343"/>
<rect key="frame" x="16" y="87" width="166.33333333333334" height="50.333333333333343"/>
<fontDescription key="fontDescription" type="system" weight="medium" pointSize="14"/>
<color key="textColor" red="0.062745098040000002" green="0.094117647060000004" blue="0.15686274510000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<nil key="highlightedColor"/>
Expand All @@ -170,24 +167,24 @@
<constraint firstItem="7rb-8Q-BEe" firstAttribute="leading" secondItem="FNn-dd-tDU" secondAttribute="leading" constant="16" id="BAQ-lY-NvS"/>
<constraint firstAttribute="trailing" secondItem="4gB-Rq-DeW" secondAttribute="trailing" constant="16" id="Cya-rc-sKO"/>
<constraint firstAttribute="trailing" secondItem="he6-oI-bGB" secondAttribute="trailing" constant="16" id="DPc-F0-IuF"/>
<constraint firstAttribute="bottom" relation="greaterThanOrEqual" secondItem="ne5-kV-2su" secondAttribute="bottom" constant="16" id="FNe-2r-Avv"/>
<constraint firstAttribute="bottom" relation="greaterThanOrEqual" secondItem="ne5-kV-2su" secondAttribute="bottom" id="FNe-2r-Avv"/>
<constraint firstItem="4gB-Rq-DeW" firstAttribute="leading" secondItem="7rb-8Q-BEe" secondAttribute="trailing" id="Fet-VD-KLT"/>
<constraint firstItem="he6-oI-bGB" firstAttribute="top" secondItem="7rb-8Q-BEe" secondAttribute="bottom" constant="8" id="I3h-yC-NzL"/>
<constraint firstItem="7rb-8Q-BEe" firstAttribute="top" secondItem="FNn-dd-tDU" secondAttribute="top" constant="12" id="L67-RP-pYQ"/>
<constraint firstItem="ne5-kV-2su" firstAttribute="trailing" secondItem="he6-oI-bGB" secondAttribute="trailing" id="bJU-E8-VQu"/>
<constraint firstItem="4gB-Rq-DeW" firstAttribute="top" secondItem="FNn-dd-tDU" secondAttribute="top" constant="16" id="mPR-QE-w15"/>
<constraint firstItem="he6-oI-bGB" firstAttribute="leading" secondItem="7rb-8Q-BEe" secondAttribute="leading" id="nFq-RK-3pt"/>
<constraint firstItem="ne5-kV-2su" firstAttribute="leading" secondItem="he6-oI-bGB" secondAttribute="leading" id="pwr-x8-lDS"/>
<constraint firstItem="ne5-kV-2su" firstAttribute="top" secondItem="he6-oI-bGB" secondAttribute="bottom" constant="12" id="v8Q-Ea-Jh8"/>
<constraint firstItem="ne5-kV-2su" firstAttribute="top" secondItem="he6-oI-bGB" secondAttribute="bottom" constant="14" id="v8Q-Ea-Jh8"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="6eV-FK-IbB">
<rect key="frame" x="0.0" y="0.0" width="198.33333333333334" height="188.66666666666666"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="249" verticalHuggingPriority="251" text="소개글" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="cYZ-24-Z5e">
<rect key="frame" x="16" y="16" width="142.33333333333334" height="24"/>
<rect key="frame" x="16" y="16" width="142.33333333333334" height="22"/>
<constraints>
<constraint firstAttribute="height" constant="24" id="ZR1-lj-UTC"/>
<constraint firstAttribute="height" constant="22" id="ZR1-lj-UTC"/>
</constraints>
<fontDescription key="fontDescription" type="boldSystem" pointSize="14"/>
<color key="textColor" red="0.062745098040000002" green="0.094117647060000004" blue="0.15686274510000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
Expand Down Expand Up @@ -238,7 +235,7 @@
</scrollView>
</subviews>
<constraints>
<constraint firstItem="msH-8e-y5Q" firstAttribute="top" secondItem="cYZ-24-Z5e" secondAttribute="bottom" constant="8" id="2c1-R8-T4c"/>
<constraint firstItem="msH-8e-y5Q" firstAttribute="top" secondItem="cYZ-24-Z5e" secondAttribute="bottom" constant="10" id="2c1-R8-T4c"/>
<constraint firstItem="oAc-YA-UoU" firstAttribute="leading" secondItem="cYZ-24-Z5e" secondAttribute="trailing" id="3kU-zK-aq0"/>
<constraint firstItem="oAc-YA-UoU" firstAttribute="top" secondItem="6eV-FK-IbB" secondAttribute="top" constant="16" id="9eg-8b-pqX"/>
<constraint firstAttribute="bottom" secondItem="msH-8e-y5Q" secondAttribute="bottom" constant="16" id="Dci-Jw-Es2"/>
Expand Down Expand Up @@ -286,7 +283,6 @@
<outlet property="artistGroupLabel" destination="he6-oI-bGB" id="uQN-HD-EDe"/>
<outlet property="artistImageView" destination="meV-gF-5BZ" id="dUg-HZ-EFX"/>
<outlet property="artistIntroLabel" destination="ne5-kV-2su" id="I4d-LH-IDA"/>
<outlet property="artistIntroLabelBottomConstraint" destination="FNe-2r-Avv" id="7bR-jq-6uI"/>
<outlet property="artistNameLabel" destination="7rb-8Q-BEe" id="JdJ-eX-T81"/>
<outlet property="artistNameLabelHeight" destination="zPQ-dD-b7K" id="Tv4-wl-ZF4"/>
<outlet property="descriptionBackButton" destination="oAc-YA-UoU" id="yYA-wc-8Gr"/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ class ArtistDetailHeaderViewController: UIViewController, ViewControllerFromStor
@IBOutlet weak var artistNameLabelHeight: NSLayoutConstraint!
@IBOutlet weak var artistGroupLabel: UILabel!
@IBOutlet weak var artistIntroLabel: UILabel!
@IBOutlet weak var artistIntroLabelBottomConstraint: NSLayoutConstraint!

/// Description Back
@IBOutlet weak var descriptionBackView: UIView!
Expand Down Expand Up @@ -56,7 +55,7 @@ extension ArtistDetailHeaderViewController {
let artistNameAttributedString = NSMutableAttributedString(
string: artistKrName + " " + artistEnName,
attributes: [
.font: DesignSystemFontFamily.Pretendard.bold.font(size: 24),
.font: UIFont.WMFontSystem.t1(weight: .bold).font,
.foregroundColor: DesignSystemAsset.BlueGrayColor.gray900.color,
.kern: -0.5
]
Expand All @@ -67,7 +66,7 @@ extension ArtistDetailHeaderViewController {

artistNameAttributedString.addAttributes(
[
.font: DesignSystemFontFamily.Pretendard.light.font(size: 14),
.font: UIFont.WMFontSystem.t6(weight: .light).font,
.foregroundColor: DesignSystemAsset.BlueGrayColor.gray900.color.withAlphaComponent(0.6),
.kern: -0.5
],
Expand All @@ -81,58 +80,57 @@ extension ArtistDetailHeaderViewController {
DEBUG_LOG("availableWidth: \(availableWidth)")
DEBUG_LOG("\(model.krName): \(artistNameWidth)")

artistNameAttributedString.addAttributes(
[.font: DesignSystemFontFamily.Pretendard.bold.font(size: availableWidth >= artistNameWidth ? 24 : 20)],
range: artistKrNameRange
)

self.artistNameLabelHeight.constant =
(availableWidth >= artistNameWidth) ? 36 :
ceil(artistNameAttributedString.height(containerWidth: availableWidth))

self.artistNameLabel.attributedText = artistNameAttributedString

self.artistGroupLabel.text = model.groupName + (model.graduated ? " · 졸업" : "")
if availableWidth >= artistNameWidth {
artistNameAttributedString.addAttributes(
[.font: UIFont.WMFontSystem.t1(weight: .bold).font],
range: artistKrNameRange
)
} else {
if model.krName.count >= 9 { // ex: 김치만두번영택사스가, 캘리칼리 데이비슨
artistNameAttributedString.addAttributes(
[.font: UIFont.WMFontSystem.t4(weight: .bold).font],
range: artistKrNameRange
)
} else {
artistNameAttributedString.addAttributes(
[.font: UIFont.WMFontSystem.t3(weight: .bold).font],
range: artistKrNameRange
)
}
}

let artistIntroParagraphStyle = NSMutableParagraphStyle()
artistIntroParagraphStyle.lineHeightMultiple = (APP_WIDTH() < 375) ? 0 : 1.44
artistNameLabelHeight.constant = (availableWidth >= artistNameWidth) ?
36 : ceil(artistNameAttributedString.height(containerWidth: availableWidth))
artistNameLabel.attributedText = artistNameAttributedString

let artistIntroAttributedString = NSMutableAttributedString(
string: model.title,
attributes: [
.font: DesignSystemFontFamily.Pretendard.medium.font(size: 14),
.foregroundColor: DesignSystemAsset.BlueGrayColor.gray900.color,
.paragraphStyle: artistIntroParagraphStyle,
.kern: -0.5
]
artistGroupLabel.text = (model.id == "woowakgood") ?
"" : model.groupName + (model.graduated ? " · 졸업" : "")
artistGroupLabel.setTextWithAttributes(
lineHeight: UIFont.WMFontSystem.t6(weight: .medium).lineHeight,
lineBreakMode: .byCharWrapping
)
self.artistIntroLabel.lineBreakMode = .byCharWrapping
self.artistIntroLabel.attributedText = artistIntroAttributedString
self.artistIntroLabelBottomConstraint.constant = (APP_WIDTH() < 375) ? 0 : 16

self.introTitleLabel.text = "소개글"
let artistIntroDescriptionParagraphStyle = NSMutableParagraphStyle()
artistIntroDescriptionParagraphStyle.lineHeightMultiple = 1.26
artistIntroLabel.text = model.title
artistIntroLabel.setTextWithAttributes(
lineHeight: UIFont.WMFontSystem.t6(weight: .medium).lineHeight,
lineBreakMode: .byWordWrapping,
hangulWordPriority: true
)

let artistIntroDescriptionAttributedString = NSMutableAttributedString(
string: model.description,
attributes: [
.font: DesignSystemFontFamily.Pretendard.light.font(size: 12),
.foregroundColor: DesignSystemAsset.BlueGrayColor.gray900.color,
.paragraphStyle: artistIntroDescriptionParagraphStyle,
.kern: -0.5
]
introDescriptionLabel.text = model.description
introDescriptionLabel.setTextWithAttributes(
lineHeight: UIFont.WMFontSystem.t7(weight: .light).lineHeight,
lineBreakMode: .byCharWrapping
)
self.introDescriptionLabel.attributedText = artistIntroDescriptionAttributedString

let encodedImageURLString: String = model.squareImage
.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) ?? model.squareImage

artistImageView.kf.setImage(
with: URL(string: encodedImageURLString),
placeholder: nil,
options: [.transition(.fade(0.2))]
)
self.view.layoutIfNeeded()
}
}

Expand Down Expand Up @@ -179,23 +177,22 @@ private extension ArtistDetailHeaderViewController {
descriptionFrontView.isHidden = false
descriptionBackView.isHidden = true

artistGroupLabel.font = DesignSystemFontFamily.Pretendard.medium.font(size: 14)
artistGroupLabel.font = UIFont.WMFontSystem.t6(weight: .medium).font
artistGroupLabel.textColor = DesignSystemAsset.BlueGrayColor.gray900.color
artistGroupLabel.setTextWithAttributes(kernValue: -0.5)
artistGroupLabel.numberOfLines = 1

artistIntroLabel.font = DesignSystemFontFamily.Pretendard.medium.font(size: 14)
artistIntroLabel.font = UIFont.WMFontSystem.t6(weight: .medium).font
artistIntroLabel.textColor = DesignSystemAsset.BlueGrayColor.gray900.color
artistIntroLabel.textAlignment = .left
artistIntroLabel.numberOfLines = 0

introTitleLabel.font = DesignSystemFontFamily.Pretendard.bold.font(size: 14)
introTitleLabel.text = "소개글"
introTitleLabel.font = UIFont.WMFontSystem.t6(weight: .bold).font
introTitleLabel.textColor = DesignSystemAsset.BlueGrayColor.gray900.color
introTitleLabel.setTextWithAttributes(kernValue: -0.5)

introDescriptionLabel.font = DesignSystemFontFamily.Pretendard.light.font(size: 12)
introDescriptionLabel.font = UIFont.WMFontSystem.t7(weight: .light).font
introDescriptionLabel.textColor = DesignSystemAsset.BlueGrayColor.gray900.color
introDescriptionLabel.textAlignment = .left
introDescriptionLabel.lineBreakMode = .byWordWrapping
introDescriptionLabel.setTextWithAttributes(kernValue: -0.5)
introDescriptionLabel.numberOfLines = 0

scrollView.verticalScrollIndicatorInsets = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: -3)
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,7 @@ public extension UILabel {
/// - Parameter lineHeightMultiple: 줄 간격의 배수 (lineSpacing * lineHeightMultiple)
func getTextWithAttributes(
lineHeight: CGFloat? = nil,
lineBreakMode: NSLineBreakMode = .byTruncatingTail,
kernValue: Double? = nil,
lineSpacing: CGFloat? = nil,
lineHeightMultiple: CGFloat? = nil,
Expand All @@ -73,7 +74,7 @@ public extension UILabel {
if let lineSpacing { paragraphStyle.lineSpacing = lineSpacing }
if let lineHeightMultiple { paragraphStyle.lineHeightMultiple = lineHeightMultiple }

paragraphStyle.lineBreakMode = .byTruncatingTail
paragraphStyle.lineBreakMode = lineBreakMode
paragraphStyle.alignment = alignment

let baselineOffset: CGFloat
Expand Down Expand Up @@ -104,19 +105,25 @@ public extension UILabel {

func setTextWithAttributes(
lineHeight: CGFloat? = nil,
lineBreakMode: NSLineBreakMode = .byTruncatingTail,
kernValue: Double? = -0.5,
lineSpacing: CGFloat? = nil,
lineHeightMultiple: CGFloat? = nil,
alignment: NSTextAlignment = .left
alignment: NSTextAlignment = .left,
hangulWordPriority: Bool = false
) {
let paragraphStyle = NSMutableParagraphStyle()

if let lineSpacing { paragraphStyle.lineSpacing = lineSpacing }
if let lineHeightMultiple { paragraphStyle.lineHeightMultiple = lineHeightMultiple }

paragraphStyle.lineBreakMode = .byTruncatingTail
paragraphStyle.lineBreakMode = lineBreakMode
paragraphStyle.alignment = alignment

if hangulWordPriority {
paragraphStyle.lineBreakStrategy = .hangulWordPriority
}

let baselineOffset: CGFloat
let offsetDivisor: CGFloat

Expand Down

0 comments on commit 7f5ab7f

Please sign in to comment.