[Feature/#77] 동영상 타임라인 드래그 앤 드롭 구현 #80

LURKS02 · 2024-12-02T07:31:39Z

✅ 완료 및 수정 내역

DragDelegate, DropDelegate 구현
ViewModel과 초기화 로직 연결

🛠️ 테스트 방법

SharedVideoEditViewController를 루트로 하여 테스트 했습니다.

📝 리뷰 노트

ViewModel과 연결하면서 드롭 시 데이터 업데이트를 Input으로 보내 ViewModel에서 업데이트를 진행하려고 했으나 이 경우 애니메이션 오류가 발생합니다.

의도한 동작

drop을 통해 이동하려는 인덱스와 아이템 파악 -> 
ViewModel Input으로 전달 -> 
ViewModel transform에서 items 배열 조작 -> 
결과를 output으로 방출 -> 
output에 따른 컬렉션 뷰 반영 및 애니메이션

결과 동작

Simulator.Screen.Recording.-.iPhone.16.Pro.-.2024-12-02.at.16.30.46.mp4

drop으로 인한 애니메이션이 우선 진행 ->
이후 업데이트된 output에 대한 애니메이션 진행
(이런식으로 2번에 걸친 애니메이션이 발생하여 자연스럽게 보이지 않습니다.)

따라서 현재는 ViewModel을 통하지 않고 ViewController에서 직접 업데이트 합니다.
이 부분에서 어떻게 처리해야 할지? 조언이 필요합니다.

📱 스크린샷(선택)

Simulator.Screen.Recording.-.iPhone.16.Pro.-.2024-12-02.at.16.22.00.mp4

- 선택한 아이템을 JSONString으로 변환하여 UIDragItem으로 사용

- 드롭 시 items를 업데이트하고 반영하여 리로드를 진행

jungseokyoung-cloud

고생하셨습니다!
사실 drag & drop이 View의 로직이기에 굳이 ViewModel로 이동할 필요는 없을꺼 같다는 생각입니다!
최종 결과물만 ViewModel로 넘겨주면 될꺼 같습니다!

jungseokyoung-cloud · 2024-12-02T08:09:41Z

Feature/Feature/SharedVideoEditView/View/CollectionView/VideoTimelineItem.swift

@@ -7,7 +7,7 @@

 import Foundation

-public struct VideoTimelineItem: Hashable {
+public struct VideoTimelineItem: Codable, Hashable {


P2: 굳이 public일 이유가 있나요?

동일한 의견입니다~

�제가 다른 코드 구현할 때 ViewModelOutput에서 직접 Item을 건네주기 때문에 이렇게 따라서 구현하신 것 같긴 한데 우선 사용되는 부분은 없으니 수정해두겠습니다!

jungseokyoung-cloud · 2024-12-02T08:10:13Z

Feature/Feature/SharedVideoEditView/ViewModel/SharedVideoEditViewInput.swift

@@ -7,4 +7,6 @@

 import Foundation

-enum SharedVideoEditViewInput { }
+enum SharedVideoEditViewInput {
+    case initialize


P2: initialize말고 좀더 명확한 네이밍이 있었으면 함다!

setInitialState 로 바꿨습니다.

jungseokyoung-cloud · 2024-12-02T08:11:59Z

Feature/Feature/SharedVideoEditView/ViewModel/SharedVideoEditViewModel.swift

@@ -15,13 +15,43 @@ public final class SharedVideoEditViewModel {

    private var output = PassthroughSubject<Output, Never>()
    private var cancellables: Set<AnyCancellable> = []
+
+    var items: [VideoTimelineItem] = []


P2: 이친구는 왜 Internal인가요??

지금 뷰모델 구조에서 state를 직접 꺼내올 수 있는 방법을 못찾았습니다. 따라서 ViewModel이 items를 internal로 가지고 있게 됩니다.

jungseokyoung-cloud · 2024-12-02T08:12:55Z

Feature/Feature/SharedVideoEditView/ViewModel/SharedVideoEditViewModel.swift


    public init() {
        setupBind()
    }

    func transform(_ input: AnyPublisher<Input, Never>) -> AnyPublisher<Output, Never> {
-        input.sink { _ in
+        input.sink { [weak self] input in


P2: 제가 Core에 sink(with:onReceive:) 메서드 추가해놨습니다! 사용하시면 [weak self] 안쓰셔도됩니다!
이전 SliderBar PR에 내용 올려두신 했었슴다

jungseokyoung-cloud · 2024-12-02T08:21:42Z

Feature/Feature/SharedVideoEditView/SharedVideoEditViewController.swift

+
+        coordinator.items.forEach { item in
+            if let sourceIndexPath = item.sourceIndexPath {
+                collectionView.performBatchUpdates({


P2: 여기는 개인적으로 DIffabledataSource를 사용해보면 어떨까 싶긴 합니다~!

jungseokyoung-cloud · 2024-12-02T08:24:33Z

Feature/Feature/SharedVideoEditView/SharedVideoEditViewController.swift

@@ -80,7 +80,11 @@ private extension SharedVideoEditViewController {

        output
            .receive(on: DispatchQueue.main)
-            .sink { output in
+            .sink { [weak self] output in


P2: 이것도 Core의 sink(with:onReceive:)사용하시면 편하게 사용하실 수 있습니다!

수정했습니다~!

around-forest

고생하셨습니다!
저도 석영님 생각처럼 ViewModel로 이동할 필요는 없다 생각합니다.

around-forest · 2024-12-02T09:02:08Z

Feature/Feature/SharedVideoEditView/SharedVideoEditViewController.swift

+                    var items = viewModel.items
+                    let movedItem = items.remove(at: sourceIndexPath.item)
+                    items.insert(movedItem, at: destinationIndexPath.item)
+                    viewModel.items = items


P2: ViewModel의 property에 직접 접근하기보다 메서드를 통해 접근하는게 더 낫지 않을까 싶네요!

getItems() 같은 형태를 따로 만들자는 말씀이신가요??

around-forest · 2024-12-02T09:03:25Z

Feature/Feature/SharedVideoEditView/View/CollectionView/VideoTimelineItem.swift

@@ -16,3 +16,18 @@ public struct VideoTimelineItem: Hashable {
        hasher.combine(identifier)
    }
 }
+
+extension VideoTimelineItem {
+    static func fromJSONString(_ jsonString: String) -> VideoTimelineItem? {


P2: func toVideoTimelineItem(from jsonString: String) 이면 보다 명확하지 않을까 싶긴 합니다.

@around-forest static func여서 호출할 때 중복되는 부분이 많아질 것 같아요

VideoTimelineItem.toVideoTimelineItem("lipsum")

P3: String 대신 Data 타입은 어떤가 싶습니다만 아무래도 상관없을 것 같습니다

저도 윤회님 의견과 동일하고 Data로 바꾸는 것도 좋아보이네요!

around-forest · 2024-12-02T09:04:31Z

Feature/Feature/SharedVideoEditView/ViewModel/SharedVideoEditViewModel.swift

+        input.sink { [weak self] input in
+            guard let self else { return }
+            switch input {
+            case .initialize:


P2: 테스트용 코드는 주석을 넣어주세요!

수정했습니다!

around-forest · 2024-12-02T09:05:29Z

Feature/Feature/SharedVideoEditView/ViewModel/SharedVideoEditViewOutput.swift

@@ -7,4 +7,6 @@

 import Foundation

-enum SharedVideoEditViewOutput { }
+enum SharedVideoEditViewOutput {


P2: 개인적으로 InputOutput은 하나의 파일로 합쳐도 되지 않을까 싶긴한데... 이야기 해보면 좋겠네요!

P2: 특별한 이유가 없다면 파일을 구분하자는 편 입니다.
입출력은 별도의 역할이기도 하고, 종류가 많아진다면 구분할 필요가 생길 것 같아요.
그리고 파일로 구분하는 비용이 그렇지 않을 때 보다 높지 않기도 하구요

051198Hz

고생많으셨습니다~!
단순 궁금증인데 드래그&드롭을 ViewModel과 ViewContorller에서 처리하는게 어떤 차이가 있어서 애니메이션이 이상해지는지 궁금하네요! 뷰컨에서는 DataSourcr를 업데이트하는 구조를 다르게 가져갈 수 있는 건가요?

051198Hz · 2024-12-02T11:17:41Z

Feature/Feature/SharedVideoEditView/View/CollectionView/VideoTimelineItem.swift

@@ -7,7 +7,7 @@

 import Foundation

-public struct VideoTimelineItem: Hashable {
+public struct VideoTimelineItem: Codable, Hashable {


동일한 의견입니다~

051198Hz · 2024-12-02T11:24:04Z

Feature/Feature/SharedVideoEditView/View/CollectionView/VideoTimelineItem.swift

@@ -16,3 +16,18 @@ public struct VideoTimelineItem: Hashable {
        hasher.combine(identifier)
    }
 }
+
+extension VideoTimelineItem {
+    static func fromJSONString(_ jsonString: String) -> VideoTimelineItem? {


@around-forest static func여서 호출할 때 중복되는 부분이 많아질 것 같아요

VideoTimelineItem.toVideoTimelineItem("lipsum")

P3: String 대신 Data 타입은 어떤가 싶습니다만 아무래도 상관없을 것 같습니다

051198Hz · 2024-12-02T11:28:52Z

Feature/Feature/SharedVideoEditView/ViewModel/SharedVideoEditViewOutput.swift

@@ -7,4 +7,6 @@

 import Foundation

-enum SharedVideoEditViewOutput { }
+enum SharedVideoEditViewOutput {


P2: 특별한 이유가 없다면 파일을 구분하자는 편 입니다.
입출력은 별도의 역할이기도 하고, 종류가 많아진다면 구분할 필요가 생길 것 같아요.
그리고 파일로 구분하는 비용이 그렇지 않을 때 보다 높지 않기도 하구요

LURKS02 added 7 commits December 2, 2024 16:16

[FEAT]: VideoTimeLineItem이 JSONString과 변환 가능하도록 구현

dd002cf

[FEAT]: SharedVideoEditView 초기화 Input & Output 구현

a05542c

[CHORE]: 사용하지 않는 초기화 코드 제거

c7b299c

[FEAT]: SharedVideoEditView 초기화에서 데이터 initialize 진행

a79847c

[FEAT]: SharedVideoViewModel의 output이 컬렉션뷰를 리로드하도록 연결

a799062

[FEAT]: 컬렉션 뷰에서 드래그 동작 구현

db6fcb1

- 선택한 아이템을 JSONString으로 변환하여 UIDragItem으로 사용

[FEAT]: 컬렉션 뷰에서 드롭 동작 구현

0731c11

- 드롭 시 items를 업데이트하고 반영하여 리로드를 진행

LURKS02 added the feature label Dec 2, 2024

LURKS02 requested review from jungseokyoung-cloud, 051198Hz and around-forest December 2, 2024 07:31

LURKS02 self-assigned this Dec 2, 2024

jungseokyoung-cloud approved these changes Dec 2, 2024

View reviewed changes

around-forest approved these changes Dec 2, 2024

View reviewed changes

051198Hz approved these changes Dec 2, 2024

View reviewed changes

LURKS02 added 5 commits December 2, 2024 22:29

[CHORE]: Item 타입의 public 제거

5a96e20

[STYLE]: initialize input의 이름을 setInitialState로 변경

f059568

[CHORE]: 사용하지 않는 코드 제거

d2e02db

[REFACTOR]: sink(with:onReceive:)로 바꿔서 구현

08d7e0a

[REFACTOR] Drag & Drop snapshot으로 애니메이션이 동작하도록 변경

e7df3a6

LURKS02 merged commit e84ffd8 into develop Dec 2, 2024
1 check passed

LURKS02 deleted the feature/#77 branch December 2, 2024 13:32

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Feature/#77] 동영상 타임라인 드래그 앤 드롭 구현 #80

[Feature/#77] 동영상 타임라인 드래그 앤 드롭 구현 #80

LURKS02 commented Dec 2, 2024

jungseokyoung-cloud left a comment

jungseokyoung-cloud Dec 2, 2024

051198Hz Dec 2, 2024

LURKS02 Dec 2, 2024

jungseokyoung-cloud Dec 2, 2024

LURKS02 Dec 2, 2024

jungseokyoung-cloud Dec 2, 2024

LURKS02 Dec 2, 2024

jungseokyoung-cloud Dec 2, 2024

jungseokyoung-cloud Dec 2, 2024

jungseokyoung-cloud Dec 2, 2024

LURKS02 Dec 2, 2024

around-forest left a comment

around-forest Dec 2, 2024

LURKS02 Dec 2, 2024

around-forest Dec 2, 2024

051198Hz Dec 2, 2024

LURKS02 Dec 2, 2024

around-forest Dec 2, 2024

LURKS02 Dec 2, 2024

around-forest Dec 2, 2024

051198Hz Dec 2, 2024

051198Hz left a comment •

edited

Loading

051198Hz Dec 2, 2024

051198Hz Dec 2, 2024

051198Hz Dec 2, 2024

[Feature/#77] 동영상 타임라인 드래그 앤 드롭 구현 #80

[Feature/#77] 동영상 타임라인 드래그 앤 드롭 구현 #80

Conversation

LURKS02 commented Dec 2, 2024

관련 이슈

✅ 완료 및 수정 내역

🛠️ 테스트 방법

📝 리뷰 노트

의도한 동작

결과 동작

📱 스크린샷(선택)

jungseokyoung-cloud 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

around-forest 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

051198Hz left a comment • 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

051198Hz left a comment •

edited

Loading