[iOS] RewindJourney Scene #110

PushedGun · 2023-11-24T04:10:25Z

❗ 배경

작업 배경에 대한 설명을 작성합니다.
Issue에 대한 링크를 첨부합니다.
#83

🔧 작업 내역

작업한 내용들을 나열합니다.
간결하게 리스트 업하고, 자세한 설명은 아래 리뷰 노트에서 합니다.

MSMusicView

RewindJourneyViewController

MSProgressView

🧪 테스트 방법

동작을 테스트할 수 있는 방법을 설명합니다.
앱 실행 방법일 수 있고, 유닛 테스트 실행 방법일 수 있습니다.

사용 예제

이미지를 외부에서 주입받아, 주입받은 이미지들을 차례대로 띄워주도록 하였습니다.

    let vc = RewindJourneyViewController()
    vc.images = [UIImage(systemName: "pencil")!, UIImage(systemName: "pencil.circle")!, UIImage(systemName: "pencil.circle.fill")!]
    return vc

📝 리뷰 노트

작업 내역에 대한 자세한 설명을 작성합니다.

MSMusicView

: 대략 프레임만 맞추어두었습니다. 후에 음악이 들어간 후 정밀하게 맞추는 작업이 필요할 수도 있습니다.

RewindJourneyViewController

: 오른쪽과 왼쪽 뷰를 두어, 클릭하여 다른 이미지로 전환할 수 있게 구현하였습니다.
지금은 인덱스로 접근하는 방식을 취하고 있는데, 마음에 안들어서 나중에 꼭 바꾸고 싶네요.

MSProgressView

: 추후 유연성있게 사용하기 위해 커스텀하였습니다.

📸 스크린샷

작업한 내용에 대한 스크린샷, 영상 등을 첨부합니다.

11/27 이후

: 하이라이트 로직 수정하였습니다.

SwiftyJunnos

고생하셨습니다!

전체적으로 Lint 적용이 안되어 있는 것 같아요.
한 번 적용하고 수정 부탁드립니다 😊

SwiftyJunnos · 2023-11-26T05:05:43Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+
+    // MARK: - Constants
+
+    private enum Metrix {


Suggested change

private enum Metrix {

private enum Metric {

SwiftyJunnos · 2023-11-26T05:06:09Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+        static var verticalInset: CGFloat = 8.0
+        static var horizonalInset: CGFloat = 12.0
+        static var cornerRadius: CGFloat = 8.0
+
+        //albumart view
+        enum AlbumArtView {
+            static var height: CGFloat = 52.0
+            static var width: CGFloat = 52.0
+        }
+        //title view
+        enum TitleView {
+            static var height: CGFloat = 4.0
+            static var inset: CGFloat = 4.0
+            static var titleHight: CGFloat = 24.0
+            static var subTitleHight: CGFloat = 20.0
+        }
+
+        //playtime view
+        enum PlayTimeView {
+            static var width: CGFloat = 67.0
+            static var verticalInset: CGFloat = 22.0
+            static var horizonalInset: CGFloat = 4.0
+            static var conponentsHeight: CGFloat = 24.0
+        }


이 친구들 상수라서 static let으로 사용해도 될 것 같습니다.

SwiftyJunnos · 2023-11-26T05:07:08Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+    private var albumArtView = UIImageView()
+    private var titleView = UIStackView()
+    private var titleLabel = UILabel()
+    private var subTitleLabel = UILabel()
+    private var playTimeView = UIStackView()
+    private var playTimeLabel = UILabel()


이 친구들도 Component 자체를 갈아끼우는 일은 없을 것 같아서
let으로 설정해줘도 될 것 같아요!

SwiftyJunnos · 2023-11-26T05:08:01Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+    // MARK: - UI Components: style
+
+    private func configureStyle() {
+        MSFont.registerFonts()


registerFonts()는 SceneDelegate에서 한 번만 해주세요..!

SwiftyJunnos · 2023-11-26T05:09:18Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+    // MARK: - Properties
+
+    private var albumArtView = UIImageView()
+    private var titleView = UIStackView()


Suggested change

private var titleView = UIStackView()

private let titleStack = UIStackView()

StackView는 프로퍼티 명에 Stack이 명시적으로 들어가면 좋을 것 같습니다.

SwiftyJunnos · 2023-11-26T05:14:33Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/RewindJourneyViewController.swift

+
+    }
+
+    // MARK: - Properties


Suggested change

// MARK: - Properties

// MARK: - UI Components

SwiftyJunnos · 2023-11-26T05:18:54Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/RewindJourneyViewController.swift

+    var preHighlightenProgressView: MSProgressView?
+    let leftTouchView = UIButton()
+    let rightTouchView = UIButton()
+


Suggested change

// MARK: - Properties

MARK 주석 용도가 조금 헷갈릴 수 있겠네요..
노션 문서 업데이트 해두겠습니다 😅

https://www.notion.so/musicspot/Swift-c80e89fdf4ee41209c7afaed3d759e82?pvs=4#2ca9bc36ba1640939eb82712e2db8b65

SwiftyJunnos · 2023-11-26T05:25:03Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

MSMusicView랑 MSProgressView는 MSUIKit에 넣어도 될 것 같은데 어떻게 생각하시나요?

현재 저희 앱에선 해당 화면 외에 사용할 일이 없어 굳이 빼지 않는 것이 좋을 것 같아요!

SwiftyJunnos · 2023-11-26T05:27:28Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSProgressView.swift

+    public var percentage: Float = 0.0 {
+        didSet {
+            syncProgress(percentage: percentage)
+        }
+    }
+    public var isHighlight: Bool = false {
+        didSet {
+            self.percentage = self.isHighlight ? 1.0 : 0.0
+        }
+    }


이 두 가지 프로퍼티는 내부에서만 사용되는 것 같은데 왜 public인걸까요?

SwiftyJunnos · 2023-11-26T05:28:50Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/RewindJourneyViewController.swift

+            self.progressViews?[index].isHighlight = true
+            self.preHighlightenProgressView?.isHighlight = false
+            self.preHighlightenProgressView = self.progressViews?[index]


리뷰 노트를 보니 임시 처리인 것 같긴 하지만
인덱스 접근은 그래도 안전장치를 하나씩 마련해두면 좋을 것 같습니다.

progressViews의 count가 index - 1보다 크거나 작은 지 확인하는 정도로요..!

앗 안전장치는 아래 코드에 되어있습니다!

@objc private func leftTouchViewTapped() { guard let presentImageIndex else { return } if presentImageIndex > 0 { let index = presentImageIndex - 1 self.presentImageIndex = index } } @objc private func rightTouchViewTapped() { guard let images, let presentImageIndex else { return } if presentImageIndex < images.count - 1 { let index = presentImageIndex + 1 self.presentImageIndex = index } }

SwiftyJunnos · 2023-11-26T05:31:10Z

지금 두 번째 사진으로 넘어가면 두 번째 Indicator만 하얗게 tint 처리되고 있는데
인스타 스토리처럼 그 이전 Indicator들도 하얗게 처리해주시면 좋을 것 같습니다!

…stcampwm2023/iOS01-MusicSpot into iOS/story/RewindJourneyScene fetch from remote

SwiftyJunnos · 2023-11-27T13:02:16Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSProgressView.swift

+            syncProgress(percentage: percentage)
+        }
+    }
+    internal var isHighlight: Bool = false {


isHighlighted가 뭔가 문법 상 더 적절할 것 같습니다.

SwiftyJunnos · 2023-11-27T13:03:04Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSProgressView.swift

+    }
+
+    required init?(coder: NSCoder) {
+        fatalError("MusicSpot은 code-based 로 개발되었습니다.")


Suggested change

fatalError("MusicSpot은 code-based 로 개발되었습니다.")

fatalError("MusicSpot은 code-based로만 작업 중입니다.")

이것도 통일할까요 😋

해당 내용 swift 컨밴션에 추가해두겠습니다.

SwiftyJunnos · 2023-11-27T13:10:51Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSProgressView.swift

+    private func syncProgress(percentage: Float) {
+        self.progress = percentage
+    }


이 함수는 public으로 해야하지 않을까요?

percentage에 따라 바 모양을 바꾸어주는 함수입니다.
private으로 내부에서만 사용되어야하는 함수가 맞습니다.

아 그러면 isHighlighted 프로퍼티로 패키지 내부에서만 조정하는건가 보군요?
실제로 동작은 투명한 버튼 두개로 하는거고..!?

아 넵 맞습니다!

넵 알겠습니다
확인했습니다!

SwiftyJunnos · 2023-11-27T13:11:30Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+    }
+
+    private func configureAlbumArtViewStyle() {
+        self.albumArtView.backgroundColor = .blue


Suggested change

self.albumArtView.backgroundColor = .blue

self.albumArtView.backgroundColor = .msColor(.secondaryBackground)

이미지를 추가하면 사용자에겐 보이지 않으나
다른 분이 저 albumArtView를 작업했을 때, 해당 View의 범위를 시각적으로 보일 수 있게 임의 색상값을 주었습니다.

생각해보니, 이 부분에서 지우고 Preview 코드에 색상값을 주는 코드를 추가해 가시적으로 하면 좋을 것 같네요!
피드백 감사합니다.

SwiftyJunnos · 2023-11-27T13:12:44Z

iOS/Features/RewindJourney/Sources/RewindJourneyView/MSMusicView.swift

+
+    // MARK: - Constants
+
+    private enum Metric {


상수들 let으로 변경해주세요..!

이건.. 죄송합니다

mingun added 2 commits November 24, 2023 12:01

📝 RewindJourney 패키지 파일 생성 및 필요한 패키지 의존성 추가

f8c2bb7

📝 구현에 필요한 UIKit 가져오기

3ce8ed0

PushedGun added the 🎨 UI 비즈니스 로직이 없는 UI 작업 label Nov 24, 2023

PushedGun added this to the 🌠 여정 조회 milestone Nov 24, 2023

PushedGun requested review from yoondj98 and SwiftyJunnos November 24, 2023 04:10

PushedGun self-assigned this Nov 24, 2023

mingun added 2 commits November 24, 2023 13:13

📝 경로 변경에 따른 package 파일 수정

7dabb80

✨ UI Scene 구현

3881f2f

PushedGun changed the base branch from main to iOS/release November 24, 2023 04:15

PushedGun closed this Nov 24, 2023

PushedGun reopened this Nov 24, 2023

PushedGun marked this pull request as draft November 24, 2023 11:30

🎨 불필요한 코드 삭제(코드 정리)

d93c2ca

PushedGun marked this pull request as ready for review November 25, 2023 10:15

SwiftyJunnos linked an issue Nov 25, 2023 that may be closed by this pull request

RewindJourney Scene UI #83

Closed

4 tasks

SwiftyJunnos requested changes Nov 26, 2023

View reviewed changes

SwiftyJunnos enabled auto-merge (squash) November 26, 2023 05:30

SwiftyJunnos and others added 11 commits November 27, 2023 12:21

Merge branch 'iOS/release' into iOS/story/RewindJourneyScene

2c0281a

✨ Preview 코드 추가

0845ff6

📝 Commit 문서 현 Feature package에 Lint 적용하도록 수정

66b2ca4

✨ Preview 추가

45e741c

🎨 Lint 규칙 적용

cafd77b

🎨 Lint 규칙 적용

8b6b499

🎨 Package 파일 Lint 규칙에 맞추어 수정

a5cfcff

Merge branch 'iOS/story/RewindJourneyScene' of https://github.com/boo…

f8291df

…stcampwm2023/iOS01-MusicSpot into iOS/story/RewindJourneyScene fetch from remote

📝 Lint 규칙 수정: 중첩 타입 조건 완화(warning 2 -> 3)

c437c8e

🎨 접근 제한자, 변수명 수정

28fb5dd

✨ 되감기 기능 수정: 전에 보여주었던 이미지들의 progressView도 하이라이트 처리

c72b403

PushedGun requested a review from SwiftyJunnos November 27, 2023 12:53

SwiftyJunnos requested changes Nov 27, 2023

View reviewed changes

PushedGun requested a review from SwiftyJunnos November 27, 2023 13:23

mingun added 3 commits November 28, 2023 12:33

🎨 상수 변수 read-only로 변경

f06e0d5

🎨 변수명 변경 isHighlight -> isHighlighted

a4e92a5

✨ Preview 추가, album art 표지 변경 기능 추가

818be26

Base automatically changed from iOS/release to iOS/epic/JourneyListScene November 30, 2023 04:00

PushedGun closed this Nov 30, 2023

auto-merge was automatically disabled November 30, 2023 12:35
Pull request was closed

PushedGun deleted the iOS/story/RewindJourneyScene branch November 30, 2023 12:35

PushedGun mentioned this pull request Nov 30, 2023

[iOS] RewindJourney Scene UI #153

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[iOS] RewindJourney Scene #110

[iOS] RewindJourney Scene #110

PushedGun commented Nov 24, 2023 •

edited

Loading

SwiftyJunnos left a comment

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

PushedGun Nov 27, 2023

SwiftyJunnos Nov 26, 2023

SwiftyJunnos Nov 26, 2023

PushedGun Nov 27, 2023 •

edited

Loading

SwiftyJunnos commented Nov 26, 2023 •

edited

Loading

SwiftyJunnos Nov 27, 2023

SwiftyJunnos Nov 27, 2023

PushedGun Nov 28, 2023

SwiftyJunnos Nov 27, 2023

PushedGun Nov 28, 2023

SwiftyJunnos Nov 28, 2023

PushedGun Nov 28, 2023

SwiftyJunnos Nov 28, 2023

SwiftyJunnos Nov 27, 2023

PushedGun Nov 28, 2023

SwiftyJunnos Nov 27, 2023

PushedGun Nov 28, 2023

	private var titleView = UIStackView()
	private let titleStack = UIStackView()

	fatalError("MusicSpot은 code-based 로 개발되었습니다.")
	fatalError("MusicSpot은 code-based로만 작업 중입니다.")

	self.albumArtView.backgroundColor = .blue
	self.albumArtView.backgroundColor = .msColor(.secondaryBackground)

[iOS] RewindJourney Scene #110

[iOS] RewindJourney Scene #110

Conversation

PushedGun commented Nov 24, 2023 • edited Loading

❗ 배경

🔧 작업 내역

MSMusicView

RewindJourneyViewController

MSProgressView

🧪 테스트 방법

사용 예제

📝 리뷰 노트

MSMusicView

RewindJourneyViewController

MSProgressView

📸 스크린샷

SwiftyJunnos left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

PushedGun Nov 27, 2023 • edited Loading

Choose a reason for hiding this comment

SwiftyJunnos commented Nov 26, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

PushedGun commented Nov 24, 2023 •

edited

Loading

PushedGun Nov 27, 2023 •

edited

Loading

SwiftyJunnos commented Nov 26, 2023 •

edited

Loading