Jordan Dobson
This package contains a set of connective components that work with the cameras on your device. Using the default config settings you can quickly connect up the camera on your device to output the lens to a view by applying custom actions through the interactions menu.
This package is a work in progress and is known to have some issues displaying the camera on certain versions of Android using Chrome.
Watch this demo video to learn the basics on using this package and to get an overview of the Lens and View components.
Watch Usage Example Demo Video →
Integrations allow you to extend the Camera + package of connective components for use in a multitude of ways. If you’d like to create your own integration, reach out in the Contact & Feedback section below.
Place this component on your canvas to connect and view your camera in the preview. Use the Lens image data to connect to other views using action controls in the interactions menu.
PROPERTIES | |
---|---|
Preference | Your preferred lens with a fallback to the default camera device lens |
Background | Placeholder color for the canvas and before camera stream is visible in preview |
Radius | Corner radius of component |
Shutter | Show shutter flash when image data is captured from the lens |
Config | Default Lens ID or a Custom Lens ID |
On Canvas | Choose how the Lens is displayed on canvas |
EVENTS & TRIGGERS | |
---|---|
Tap | onTap event fires when clicking or tapping on the lens |
Capture | onCapture event fires when image data is captured from the lens |
Use this component on your canvas to display what’s captured from the camera lens in the preview.
PROPERTIES | |
---|---|
Background | Placeholder color for the canvas and before camera lens capture |
Radius | Corner radius of component |
Config | Default View ID or a Custom View ID |
On Canvas | Choose how the View is displayed on canvas |
EVENTS & TRIGGERS | |
---|---|
Tap | onTap event fires when clicking or tapping on the view |
Clear | onClear event fires when image data is removed from the view |
ACTION CONTROLS | |
---|---|
Clear View | Clears view using default or custom ID |
Send Lens to View | Sends Camera Lens image to Camera View using default or custom ID |
This is a work in progress by @jordandobson. Feedback, bugs, ideas and integrations are always appreciated.
jordan@framer.com
19 AUGUST 2020
Small bug fix to address camera initialization on canvas.
12 AUGUST 2020
Updates to Lens presentation on Canvas for Web & Desktop, support for Safari & mobile devices and integration support.
06 AUGUST 2020
Updates to the Framer App package details view and Framer package documentation webpage.
22 JULY 2020
Updates to canvas displays and placeholder states.
21 JULY 2020
Updated package icon + artwork, improved documentation layout / presentation and minor updates to Action Control labels.
20 JULY 2020
Initial release for community testing & feedback before Framer Sessions late July.