Comments (6)
Yes you are right. Now you are a master of video editor. 😜
from cabbage.
It's possible and easy. Below is the demo code
let item1 = TrackItem(resource: resource)
// Set all item's base content mode to .aspectFit
item1.configuration.videoConfiguration.baseContentMode = .aspectFit
....
item2.configuration.videoConfiguration.baseContentMode = .aspectFit
....
itemN.configuration.videoConfiguration.baseContentMode = .aspectFit
let timeline = Timeline()
timeline.videoChannel = [item1, item2, ..., itemN]
timeline.audioChannel = [item1, item2, ..., itemN]
let compositionGenerator = CompositionGenerator(timeline: timeline)
// Set canvas to first video's size
compositionGenerator.renderSize = item1.resource.size
let playerItem = compositionGenerator.buildPlayerItem()
from cabbage.
ohh interesting.. I will try it that way. :) 👍
from cabbage.
Ok so I tried your suggestion, but it seems like all videos start playing AT THE SAME TIME and in a inverted order
.
instead of playing one after the other. I know because I can hear the audio of the first video been overlapped with the audio of the second video. I also get to see a portion of the first video.
And as additional note: Sometimes the exported video is invalid and cannot be played, I feel it might be timing related. It happens specially when merging 3 videos, I need to be able to merge infinite number of videos :(
here is my code.
let tLine = Timeline()
var vChannel = [TrackItem]()
var aChannel = [TrackItem]()
for clip: G8Clip in self._clips {
if let asset = clip.asset {
let resource = AVAssetTrackResource(asset: asset)
// Create a TrackItem instance, TrackItem can configure video&audio configuration
let trackItem = TrackItem(resource: resource)
// Set the video scale mode on canvas
trackItem.configuration.videoConfiguration.baseContentMode = .aspectFit
vChannel.append(trackItem)
aChannel.append(trackItem)
}
}
tLine.videoChannel = vChannel
tLine.audioChannel = aChannel
// Use CompositionGenerator to create AVAssetExportSession/AVAssetImageGenerator/AVPlayerItem
let compositionGenerator = CompositionGenerator(timeline: tLine)
// Set the video canvas's size
var firstVideoDimensions = CGSize(width: 1920, height: 1080)
if(self._clips.count > 0){
let firstVTrack = self._clips.first?.asset?.tracks(withMediaType: AVMediaType.video).first
firstVideoDimensions = CGSize(width: firstVTrack!.naturalSize.width, height: firstVTrack!.naturalSize.height)
}
compositionGenerator.renderSize = firstVideoDimensions
//Create the Export Session
if let exportURL = outputURL {
self.removeFile(fileUrl: exportURL)
if let exportSession = compositionGenerator.buildExportSession(presetName: preset){
exportSession.shouldOptimizeForNetworkUse = true
exportSession.outputURL = exportURL
exportSession.outputFileType = self.fileType
exportSession.exportAsynchronously {
DispatchQueue.main.async {
completionHandler(exportURL, exportSession.error)
}
}
return
}
}
Im attaching 2 Videos (in zip file) that showcase the issue.
1- In this one the landscape video is supposed to be the first one, but it shows the portrait video on top and playing at the same time IMG_7814.mp4.zip
2- In this one, there are 3 videos. the sequence should be: BirthdayCakeVideo, PortraitVideo, AnimatedPhotoVideo(this one has no audio). But instead it plays all of them at the same time, and layered in an inverted sequence.
IMG_7813.mp4.zip
It also fails when I try to merge many videos (ie. 6 videos) even 3 fails.
from cabbage.
tLine.videoChannel = vChannel
tLine.audioChannel = aChannel
// Call this after you set videoChannel. This method will correct the video's start time, base on your order
try! Timeline.reloadVideoStartTime(providers: tLine.videoChannel)
from cabbage.
woah. that worked !! 🥳🤣👍👍 thank you, with just a few lines of code it does what I needed.
Quick question:
I noticed that it takes a while to compile/export the final video with the exportSession
I guess this is normal. But I wonder how TikTok App does it when mergina and exporting all the clips and showing the final composition almost instantly. I'm thinking I can show to the User the final video using the compositionGenerator.buildPlayerItem() and use that to show a video player with the composition instantly. and then later export to a file letting it take as long as it needs. what u think ?
from cabbage.
Related Issues (20)
- Player add blur background HOT 6
- Use Kingfisher to report an error
- About the text overlay, edit, drag and drop, zoom. HOT 1
- CIImage Memory leak HOT 2
- Overlay H.265 Video with Transparency HOT 4
- option to change number of frames on export
- Sound gone when scaled video HOT 1
- Multiple timelines HOT 1
- black screen when the audio overlay goes to finish HOT 2
- transition demo not work HOT 1
- 如何知道轨道和片段之间的关系
- Is this framework support multiple layer blend mode? HOT 1
- Capture the current frame in composed player item HOT 1
- avplayer seek后,影音不同步 HOT 1
- Exported video appears to be darker (colour shifting) HOT 3
- Orientation problem: some videos are rotated by 90 or 180 degrees
- Example of merging several videos in sequence
- Example project doesn't work on Xcode 15 HOT 1
- 导出视频需要的时间太长
- how to support animation tools? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from cabbage.