Kanvas is an open-source iOS library for adding effects, drawings, text, stickers, and making GIFs from existing media or the camera.

Overview

kanvy

Kanvas

Kanvas Build Status

Cocoapods

Kanvas is an open-source iOS library for adding effects, drawings, text, stickers, and making GIFs from existing media or the camera.

It is used in the Tumblr iOS app as a camera, media editor, GIF maker, and media posting tool.

Setup

Add this to your Podfile:

pod 'Kanvas', :git => 'https://github.com/tumblr/kanvas-ios.git'

And run:

pod install

Usage

Kanvas is mainly two parts: the Camera, and the Editor. Both are just view controllers that you present, and have settings and delegates that help you customize their behavior.

To show the camera:

let settings = CameraSettings()
let camera = CameraController(settings: settings)
present(camera, animated: true)

And to edit existing media, like a video:

let videoURL = URL(string: "path/to/video.mov")
let settings = CameraSettings()
let editor = EditorViewController.createEditor(for: videoURL, settings: settings)
present(editor, animated: true)

Each view controller accepts a CameraSettings object, which provides fine-grained settings and feature togges. Each view controller also has a delegate property for providing your own handlers to creating media, performing editing operations, logging, or really anything else Kanvas can do.

Documentation is lacking at the moment, but contributions are welcome!

Example App

KanvasExample is an example app showing how to use Kanvas. Try it out!

  1. Run cd KanvasExample; bundle exec pod install
  2. Open KanvasExample/KanvasExample.xcworkspace in Xcode
  3. Run the app on a device.
Comments
  • Improve memory pressure while exporting GIFs

    Improve memory pressure while exporting GIFs

    This PR updates the exporting loops for creating GIF to be wrapped with autorelease blocks so the memory pressure is smaller when exporting then.

    Related bug: https://jira.tumblr.net/browse/PROD-15147

    How to test:

    • Start the sample project
    • Try to export a larger GIF ( you can get a GIF here: https://zikkimyeyin.tumblr.com/post/651438616631033856 )
    • Check that the memory being used does not go over the limits.
    bug 
    opened by SergioEstevao 6
  • Fast track camera & microphone Permissions

    Fast track camera & microphone Permissions

    JIRA: ICORE-4812 P2: https://wp.me/pbzQyC-248

    What it does

    All commits made on or before 5th April have been reviewed as part of this PR. You can filter this PR for April 6th commits onwards (All Tests and code removals) or review the whole thing.

    | Before | After | | --- | --- | | Simulator Screen Recording - iPhone 8 - 2022-04-05 at 18 11 13| Simulator Screen Recording - iPhone 8 - 2022-04-05 at 18 02 45|

    This changes how we ask the user for camera and microphone permissions. Apple recently rejected our review as they didn't want an intermediary screen where users can choose whether to display apples official permission requests.

    How to test

    Use a real device, resetting the app permission settings on simulator is a bit tricky.

    Unknown permissions

    • Goto Settings > General > Reset > Reset Location & Privacy
    • Open photo screen and two alerts should appear

    Accepted permissions

    • Goto Settings > General > Reset > Reset Location & Privacy
    • Open photo screen and accept both permission alerts
    • Result: Camera and mic should be fully accessible
    • Go back and open screen Result: Camera and mic should be fully accessible

    Denied permissions -

    • Goto Settings > General > Reset > Reset Location & Privacy
    • Open photo screen
    • Deny Camera and Mic access
    • Result: Settings redirect screen should appear and no access to camera is granted
    • Go back and reopen screen
    • Result: No permission alerts should appear. Settings redirect screen should appear and no access to camera is granted
    • Kill app and open screen
    • Result: Settings redirect screen should appear and no access to camera is granted
    • repeat these steps this time only selecting one of the camera or mic permissions to reject
    opened by Deco354 4
  • 9:16 Content Editing

    9:16 Content Editing

    • Restrict Media to 9:16 aspect ratio.
    • Align 9:16 media for devices which are taller than this ratio.

    Pan/Zoom Android PR w/ discussions an alignment: https://github.com/Automattic/stories-android/pull/649

    enhancement stories 
    opened by bjtitus 4
  • Videos have the wrong size when exporting them with a filter

    Videos have the wrong size when exporting them with a filter

    After applying a filter to a video, when exporting it the dimensions were wrong. This PR removes the size specification in the renderer used by the VideoCompositor so that the default is used.

    To test it in Orangina: -Open the editor to create a new post. -Select a video from your phone or record a new one. -Add a filter to your video and tap on the blue arrow to select it. -The size of the video in the editor shouldn't look distorted or different. -Post the video. -The video should be posted with the selected filter and the correct dimensions. -Bonus: try with videos in different orientations and with images and GIFs too, to make sure they weren't affected.

    opened by adriana-elizondo 3
  • MultiEditorViewController: Reload the current editor during export process

    MultiEditorViewController: Reload the current editor during export process

    Description

    This PR reloads the current editor when exporting from a MultiEditorViewController so that layers don't disappear if the user cancels the process. This currently affects WPiOS and appears to have been a problem in the past fixed by this PR. However, that fix doesn't seem to have the same effect anymore.

    What this PR aims to do:

    • Only reload the currently selected (and visible, for WPiOS) editor rather than all exported editors
    • Reduce memory consumption and retention during the export process

    ⚠️ I'm unsure how this may affect the Tumblr or any other clients. Since the original fix was for WPiOS I'm inclined to think Tumblr won't be negatively affected, but I'm OK with implementing a more backwards-compatible fix if we think it's a risk.

    Related issues:

    • https://github.com/tumblr/kanvas-ios/pull/106
    • https://github.com/wordpress-mobile/WordPress-iOS/issues/18550)

    Testing

    1. Run WPiOS from this PR
    2. Create a new Story post
    3. Add media from the device
    4. Add a text layer
    5. Tap the arrow at the top right to start the export / posting process
    6. Cancel the posting process by swiping the publishing sheet down
    7. Observe that the text from step 4 is retained

    | Before | After | | - | - | |

    bug stories 
    opened by twstokes 2
  • Reduce renderer memory consumption when exporting

    Reduce renderer memory consumption when exporting

    Description

    Memory consumption grows constantly when exporting multiple images due to calls to output in the renderer. In instances where there's no delegate to process the renderer's pixel buffer, we can avoid running the function altogether.

    This will help alleviate WPiOS out-of-memory crashes:

    enhancement stories 
    opened by twstokes 2
  • Add Permissions Button color customization

    Add Permissions Button color customization

    Adds permissions button colors properties to KanvasColors:

    • KanvasColors.permissionsButtonColor
    • KanvasColors.permissionsButtonAcceptedBackgroundColor

    We want to customize these colors a bit for WordPress iOS: https://github.com/tumblr/kanvas-ios/issues/54

    opened by bjtitus 2
  • The permissions screen buttons do not work after revoking manually

    The permissions screen buttons do not work after revoking manually

    • Accept permissions when first using
    • Go back to the Privacy screen in settings and disable camera and microphone access
    • Go back to create with Kanvas
    • The "Allow access to camera/microphone" buttons do not work

    We probably need to show better messaging here as I don't think it's possible to enable the in-app after they have been manually disabled.

    opened by bjtitus 2
  • Specify `editorFonts` w/ UIFont & not KanvasTextFont

    Specify `editorFonts` w/ UIFont & not KanvasTextFont

    Replaces the KanvasTextFont type with UIFonts.

    This allows us to add fonts without having to change the library to handle stringly typed names.

    The analytics provider will now be responsible for converting the UIFont to a string.

    Clients implementing KanvasCameraAnalyticsProvider will need to do any conversion from the UIFont to an appropriate string for logging. In the example the font's name is used, but a mapping like the previous KanvasTextFont provided can also be used.

    opened by bjtitus 2
  • Font toggle not working in 35257 build

    Font toggle not working in 35257 build

    Noticed in the 35257 build that you can't toggle to change the font between the sans serif and the script. This button works in the regular tumblr build.

    stories 
    opened by megsfulton 2
  • Remove “GIF” creation option for videos

    Remove “GIF” creation option for videos

    Can't really see the case for this functionality in stories. It might be interesting to keep the video trimming functionality for a future version, but not v1.

    stories 
    opened by megsfulton 2
  • Upon running on Xcode 13 and uploading to testlfight, camera icons in the camera preview screen are missing

    Upon running on Xcode 13 and uploading to testlfight, camera icons in the camera preview screen are missing

    I do not receive any new errors when running my app. When running on Xcode 13 and building to my device everything works as it should. But when I upload to test flight most of the camera icons in the camera preview screen are gone. If I tap on the area where the icons should be then the action registers properly(like closing the camera view). The icons are invisible but can still be actioned. The only icons I can see on screen is the Ghost Frame and record button.

    Everything works fine on my Xcode 12.5 build even when uploading to testflight. Any advice, please.

    opened by riveraj33 2
  • It show black screen when  starting with video and image

    It show black screen when starting with video and image

    Hello,

    It is very nice tool, however it always show black screen when starting with video/image, even has video voice.

    Please help to check and solve.

    Best regards, Nguyen

    opened by chinhnd 1
  • Adds iPad support to Kanvas

    Adds iPad support to Kanvas

    Adds basic iPad support to Kanvas.

    • Handles rotation by refreshing the capture session when device rotates.
    • Uses the same constraints as the non-home button iPhones for positioning preview
    • Adds a new KanvasEditorDesign.storiesDesign for tweaking button sizing.
    • Adds a new CameraSettings.showShadowOverMediaClips flag for disabling the shadow on either side of the media clips view.
    stories 
    opened by bjtitus 0
  • Export contents of added Layers for accessibility

    Export contents of added Layers for accessibility

    Allow the client to access textual data about added layers for accessibility purposes.

    For example:

    • The strings from Text layers
    • A textual description of stickers
    stories 
    opened by bjtitus 0
Releases(1.4.3)
  • 1.4.3(Jul 8, 2022)

    What's Changed

    • Move to Buildkite by @jkmassel in https://github.com/tumblr/kanvas-ios/pull/139
    • MultiEditorViewController: Reload the current editor during export process by @twstokes in https://github.com/tumblr/kanvas-ios/pull/141
    • Reduce renderer memory consumption when exporting by @twstokes in https://github.com/tumblr/kanvas-ios/pull/140

    New Contributors

    • @jkmassel made their first contribution in https://github.com/tumblr/kanvas-ios/pull/139
    • @twstokes made their first contribution in https://github.com/tumblr/kanvas-ios/pull/141

    Full Changelog: https://github.com/tumblr/kanvas-ios/compare/1.4.2...1.4.3

    Source code(tar.gz)
    Source code(zip)
  • 1.4.2(Jun 28, 2022)

  • 1.4.1(Jun 24, 2022)

  • 1.4.0(Apr 25, 2022)

    What's Changed

    • Clean up and update Ruby by @andrewdmontgomery in https://github.com/tumblr/kanvas-ios/pull/131
    • Update FBSnapshot Library by @Deco354 in https://github.com/tumblr/kanvas-ios/pull/132
    • Make snapshot tests M1 compatible by @Deco354 in https://github.com/tumblr/kanvas-ios/pull/135
    • Simplified permission flow by @Deco354 in https://github.com/tumblr/kanvas-ios/pull/133

    New Contributors

    • @andrewdmontgomery made their first contribution in https://github.com/tumblr/kanvas-ios/pull/131
    • @Deco354 made their first contribution in https://github.com/tumblr/kanvas-ios/pull/132

    Full Changelog: https://github.com/tumblr/kanvas-ios/compare/1.3.5...1.4.0

    Source code(tar.gz)
    Source code(zip)
  • 1.3.4(Jan 4, 2022)

  • 1.3.2(Dec 28, 2021)

    https://github.com/tumblr/kanvas-ios/pull/122 - Fixes the calling order of EditorViewDelegate.getQuickPostButton when loading EditorView.

    Source code(tar.gz)
    Source code(zip)
  • 1.3.1(Jul 1, 2021)

    https://github.com/tumblr/kanvas-ios/pull/119 - Fixes various issues with the tumblr integration: Editing videos & GIFs, and segment deletion while in Stitch mode.

    Source code(tar.gz)
    Source code(zip)
  • 1.3.0(Jun 18, 2021)

    A few compatibility changes needed for Tumblr integration.

    • Hide UIColor extension
    • New KanvasMedia initializer: init(type: MediaType, url: URL, info: MediaInfo, size: CGSize)
    • Fix for loading indicator when dismissing post options
    Source code(tar.gz)
    Source code(zip)
  • 1.2.8(Jun 14, 2021)

  • 1.2.7(May 11, 2021)

    • https://github.com/tumblr/kanvas-ios/pull/109 A crash fix when multitasking.
    • https://github.com/tumblr/kanvas-ios/pull/113 Improves loading state while exporting multiple media files + removes some assertions in OpenGL rendering.
    Source code(tar.gz)
    Source code(zip)
  • 1.2.6(Apr 12, 2021)

  • 1.2.5(Mar 17, 2021)

    • Fixes rendering issues with OpenGL + scaleToFill contentMode https://github.com/tumblr/kanvas-ios/pull/106
    • Fixes disappearing overlays on export https://github.com/tumblr/kanvas-ios/pull/106
    Source code(tar.gz)
    Source code(zip)
  • 1.2.4(Mar 5, 2021)

    1.2.4 Release with bug fixes

    • Fixes #96 #100: Media reordering bugs
    • Tweak media clips scrolling logic to jump around less
    • Fixes #98: Crash in UIFeedbackGenerator subclass
    • Fix #70: Add setting to disable/enable font resizing
    • Fixes #63: Send current selection to clips collection
    • Fix a clips selection bug when moving items
    • Pause video when editor is off-screen
    Source code(tar.gz)
    Source code(zip)
  • 1.2.3(Mar 2, 2021)

    Pull Request https://github.com/tumblr/kanvas-ios/pull/93

    • Appends all added segments to the end of existing segments.
    • Adds the iPhone 12 Pro to the belongsToIPhoneXGroup to fix display issues on iPhone 12 Pro and Pro Max.

    | Before | After | | ------ | ----- | | | |

    Source code(tar.gz)
    Source code(zip)
  • 1.2.2(Feb 22, 2021)

    • muteButton Camera Setting to enable a new control for muting videos during playback and export.
    • Multiple Media types in logMediaPickerPickedMedia for selecting multiple types of media at once:
    --- func logMediaPickerPickedMedia(ofType mediaType: KanvasMediaType)
    +++ func logMediaPickerPickedMedia(ofTypes mediaTypes: [KanvasMediaType])
    
    • confirmAtTop Camera Setting to enable a state where the confirm button is moved to the top right.
    • KanvasImages now has a shared instance which can be overridden to provide customized nextImage, confirmImage and editorConfirmImage.
    Source code(tar.gz)
    Source code(zip)
  • 1.2.1(Feb 19, 2021)

  • 1.2.0(Feb 18, 2021)

    Includes many of the changes necessary for Stories integration into WordPress iOS.

    • NSSecureCoding conformance for edits + media
    • Exports multiple frames when using multipleExports
    • New scaleMediaToFill property to fill the screen with media
    Source code(tar.gz)
    Source code(zip)
  • 1.0.1(Jan 27, 2021)

  • v1.0.0-rc(Dec 8, 2020)

Owner
Tumblr
Tumblr
Instant camera hybrid with multiple effects and filters written in Swift.

Kontax Cam Download on the app store! No longer on the app store Kontax Cam is an instant camera built 100% using Swift for iOS. You can take your pho

Kevin Laminto 108 Dec 27, 2022
Get a photo which has effects like the system camera’s Portrait mode (on compatible devices).

Blurring background like Portrait mode in the iPhone camera If we want to have the blurring effect like the Portrait mode in the iOS Camera app. What

Kien (Bradley) Hoang 4 Sep 20, 2022
Drop in GIF Collection View. Uses Tenor as default GIFs provider.

Drop in GIF Collection View. Uses Tenor as default GIFs provider. This will allow you to easily integrate GIF image search into your app or you can use this as a GIF keyboard for your messaging needs.

null 5 May 7, 2022
Vision Camera 📸 The Camera library that sees the vision.

Vision Camera ?? The Camera library that sees the vision. npm i react-native-vision-camera npx pod-install Documentation Guides API Ex

Marc Rousavy 3.5k Jan 5, 2023
GPU-based media processing library using Metal written in Swift

GPU-based media processing library using Metal written in Swift. Overview MetalAcc is a GPU-Based media processing library that lets you apply GPU-acc

Jiawei Wang 259 Dec 17, 2022
Jogendra 113 Nov 28, 2022
A view that takes a set of images, make transition from one to another by using flipping effects.

CDFlipView A view that takes a set of images, make transition from one to another by using flipping effects. Demo Live Demo: https://appetize.io/app/w

Jianbin LIN 99 Aug 27, 2021
add text(multiple line support) to imageView, edit, rotate or resize them as you want, then render the text on image

StickerTextView is an subclass of UIImageView. You can add multiple text to it, edit, rotate, resize the text as you want with one finger, then render the text on Image.

Textcat 478 Dec 17, 2022
Example of adding marching ants selection to the edges of the image.

JMCMarchingAnts Library that lets you add marching ants (animated) selection to the edges of the images. Usage: * Copy the JMCMarchingAnts.swift file

Izotx 143 Dec 17, 2022
Microblog-ref-app - A Twitter like social media app that users can share their moments

HiPlace - iOS Table of Contents Introduction HMS Services Getting Started Suppor

null 2 Jan 3, 2022
An open source iOS framework for GPU-based image and video processing

GPUImage Brad Larson http://www.sunsetlakesoftware.com @bradlarson [email protected] Overview The GPUImage framework is a BSD-licensed iO

Brad Larson 20k Jan 1, 2023
TripUp is an open source, photo storage and sharing app made for privacy conscious users.

TripUp is an open source, photo storage and sharing app made for privacy conscious users.

TripUp 19 Aug 26, 2022
FlaneurImagePicker is an iOS image picker that allows users to pick images from different sources (ex: user's library, user's camera, Instagram...). It's highly customizable.

FlaneurImagePicker is a highly customizable iOS image picker that allows users to pick images from different sources (ex: device's library, device's c

FlaneurApp 17 Feb 2, 2020
PublisherKit - An open source implementation of Apple's Combine framework for processing asynchronous events over time

Publisher Kit Overview PublisherKit provides a declarative Swift API for processing asynchronous events over time. It is an open source version of App

null 5 Feb 22, 2022
Swifttty and easy camera framework for iOS.

SwiftttCamera Swifttty and easy camera framework for iOS. View Demo · Report Bug · Request Feature SwiftttCamera is a wrapper around AVFoundation that

Roger Oba 13 Sep 14, 2022
Custom iOS camera and photo picker with editing capabilities

Overview Paparazzo is a component for picking and editing photos. Key Features ?? Taking photos using camera ?? Picking photos from user's photo libra

avito.tech 757 Jan 4, 2023
FlexibleImage is implemented with the hope that anyone could easily develop an app that provides features such as Camera Filter and Theme.

FlexibleImage is implemented with the hope that anyone could easily develop an app that provides features such as Camera Filter and Theme. When you wr

Jungwon An 815 Dec 30, 2022
A free, multiplatform SDK for real-time facial motion capture using blendshapes, and rigid head pose in 3D space from any RGB camera, photo, or video.

mocap4face by Facemoji mocap4face by Facemoji is a free, multiplatform SDK for real-time facial motion capture based on Facial Action Coding System or

Facemoji 592 Jan 1, 2023
CameraButton - A simple camera button that can be used for photo and video capturing

CameraButton A simple camera button that can be used for photo and video capturi

Erik Drobne 9 Dec 22, 2022