parent
28cf9bd2dd
commit
dabbbed699
@ -0,0 +1,102 @@ |
||||
--- |
||||
layout: page |
||||
title: "Real-time Filters" |
||||
subtitle: "Apply filters to preview and snapshots" |
||||
description: "Apply filters to preview and snapshots" |
||||
category: docs |
||||
order: 11 |
||||
date: 2019-08-06 17:10:17 |
||||
disqus: 1 |
||||
--- |
||||
|
||||
Starting from version `2.1.0`, CameraView experimentally supports real-time filters that can modify |
||||
the camera frames before they are shown and recorded. Just like [overlays](watermarks-and-overlays.html), |
||||
these filters are applied to the preview and to any [picture or video snapshots](capturing-media.html). |
||||
|
||||
Conditions: |
||||
|
||||
- you must set the experimental flag: `app:cameraExperimental="true"` |
||||
- you must use `Preview.GL_SURFACE` as a preview |
||||
|
||||
### Simple usage |
||||
|
||||
```xml |
||||
<com.otaliastudios.cameraview.CameraView |
||||
android:layout_width="wrap_content" |
||||
android:layout_height="wrap_content" |
||||
app:cameraFilter="@string/cameraview_filter_none"/> |
||||
``` |
||||
|
||||
Real-time filters are applied at creation time, through the `app:cameraFilter` XML attribute, |
||||
or anytime during the camera lifecycle using `cameraView.setFilter()`. |
||||
|
||||
We offers a reasonable amount of filters through the `Filters` class, for example: |
||||
|
||||
```java |
||||
cameraView.setFilter(Filters.BLACK_AND_WHITE.newInstance()); |
||||
cameraView.setFilter(Filters.VIGNETTE.newInstance()); |
||||
cameraView.setFilter(Filters.SEPIA.newInstance()); |
||||
``` |
||||
|
||||
All of the filters stored in the `Filters` class have an XML string resource that you can use |
||||
to quickly setup the camera view. For example, `Filters.BLACK_AND_WHITE` can be set by using |
||||
`app:cameraFilter="@string/cameraview_filter_black_and_white`. |
||||
|
||||
The default filter is called `NoFilter` (`Filters.NONE`) and can be used to clear up any other |
||||
filter that was previously set and return back to normal. |
||||
|
||||
|Filter class|Filters value|XML resource value| |
||||
|------------|-------------|---------------------| |
||||
|`NoFilter`|`Filters.NONE`|`@string/cameraview_filter_none`| |
||||
|`AutoFixFilter`|`Filters.AUTO_FIX`|`@string/cameraview_filter_autofix`| |
||||
|`BlackAndWhiteFilter`|`Filters.BLACK_AND_WHITE`|`@string/cameraview_filter_black_and_white`| |
||||
|`BrightnessFilter`|`Filters.BRIGHTNESS`|`@string/cameraview_filter_brightness`| |
||||
|`ContrastFilter`|`Filters.CONTRAST`|`@string/cameraview_filter_contrast`| |
||||
|`CrossProcessFilter`|`Filters.CROSS_PROCESS`|`@string/cameraview_filter_cross_process`| |
||||
|`DocumentaryFilter`|`Filters.DOCUMENTARY`|`@string/cameraview_filter_documentary`| |
||||
|`DuotoneFilter`|`Filters.DUOTONE`|`@string/cameraview_filter_duotone`| |
||||
|`FillLightFilter`|`Filters.FILL_LIGHT`|`@string/cameraview_filter_fill_light`| |
||||
|`GammaFilter`|`Filters.GAMMA`|`@string/cameraview_filter_gamma`| |
||||
|`GrainFilter`|`Filters.GRAIN`|`@string/cameraview_filter_grain`| |
||||
|`GrayscaleFilter`|`Filters.GRAYSCALE`|`@string/cameraview_filter_grayscale`| |
||||
|`HueFilter`|`Filters.HUE`|`@string/cameraview_filter_hue`| |
||||
|`InvertColorsFilter`|`Filters.INVERT_COLORS`|`@string/cameraview_filter_invert_colors`| |
||||
|`LomoishFilter`|`Filters.LOMOISH`|`@string/cameraview_filter_lomoish`| |
||||
|`PosterizeFilter`|`Filters.POSTERIZE`|`@string/cameraview_filter_posterize`| |
||||
|`SaturationFilter`|`Filters.SATURATION`|`@string/cameraview_filter_saturation`| |
||||
|`SepiaFilter`|`Filters.SEPIA`|`@string/cameraview_filter_sepia`| |
||||
|`SharpnessFilter`|`Filters.SHARPNESS`|`@string/cameraview_filter_sharpness`| |
||||
|`TemperatureFilter`|`Filters.TEMPERATURE`|`@string/cameraview_filter_temperature`| |
||||
|`TintFilter`|`Filters.TINT`|`@string/cameraview_filter_tint`| |
||||
|`VignetteFilter`|`Filters.VIGNETTE`|`@string/cameraview_filter_vignette`| |
||||
|
||||
Most of these filters accept input parameters to tune them. For example, `DuotoneFilter` will |
||||
accept two colors to apply the duotone effect. |
||||
|
||||
```java |
||||
duotoneFilter.setFirstColor(Color.RED); |
||||
duotoneFilter.setSecondColor(Color.GREEN); |
||||
``` |
||||
|
||||
You can change these values by acting on the filter object, before or after passing it to `CameraView`. |
||||
Whenever something is changed, the updated values will be visible immediately in the next frame. |
||||
|
||||
### Advanced usage |
||||
|
||||
Advanced users with OpenGL experience can create their own filters by implementing the `Filter` interface |
||||
and passing in a fragment shader and a vertex shader that will be used for drawing. |
||||
|
||||
We recommend: |
||||
|
||||
- Subclassing `BaseFilter` instead of implementing `Filter`, since that takes care of most of the work |
||||
- If accepting parameters, implementing `OneParameterFilter` or `TwoParameterFilter` as well |
||||
|
||||
Most of all, the best way of learning is by looking at the current filters implementations in the |
||||
`com.otaliastudios.cameraview.filters` package. |
||||
|
||||
### Related APIs |
||||
|
||||
|Method|Description| |
||||
|------|-----------| |
||||
|`setFilter(Filter)`|Sets a new real-time filter.| |
||||
|`getFilter()`|Returns the current real-time filter.| |
Loading…
Reference in new issue