Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries. Thanks for all your past and future contributions.

Real-time RED Filter using Nokia Imaging SDK

From Wiki
Jump to: navigation, search

In this article, you will learn how to implement real-time red filter using Nokia Imaging SDK.

WP Metro Icon Multimedia.png
WP Metro Icon WP8.png
Article Metadata
Code Example
Source file: Github
Tested with
SDK: Windows Phone 8.1 SDK
Devices(s): Nokia Lumia 520
Windows Phone 8
Dependencies: Nokia Imaging SDK v1.2.115
Platform Security
Created: MGTHEBOSS (12 Jun 2014)
Last edited: MGTHEBOSS (10 Jul 2014)



For better understanding, it is recommended that you read the following articles before implementing this filter:


Device FPS
Lumia 520 11-12

Quick Installation Guide

  1. Download this ZIP file.
  2. Extract.
  3. Copy the RealtimeRedFilterDemoWP folder to C:\Users\YOUR_USER_NAME_HERE\Documents\Visual Studio 2013\Projects
  4. Open the project in Visual Studio from FILE -> Open Project... .
  5. Make sure your WP 8.1 device is connected to your PC/laptop and then press F5.
  6. The WP 8.1 app REAL-TIME RED FILTER DEMO will install and launch.


This filter is implemented by bitwise-AND-ing every source pixel value with 0xffff0000 i.e. alpha and red components are preserved and green and blue components are destroyed.


Note: This is an entry in the Nokia Original Imaging Effect Wiki Challenge 2014Q2. This application demonstrates the implementation of real-time red filter using Nokia Imaging SDK.
* Developer: Manojit Ghosh

using Nokia.Graphics.Imaging;
namespace RealtimeFilterDemo
public class CustomEffect : CustomEffectBase
public CustomEffect(IImageProvider source) : base(source)
protected override void OnProcess(PixelRegion sourcePixelRegion, PixelRegion targetPixelRegion)
var sourcePixels = sourcePixelRegion.ImagePixels;
var targetPixels = targetPixelRegion.ImagePixels;
sourcePixelRegion.ForEachRow((index, width, position) =>
for (int x = 0; x < width; ++x, ++index)
// the only supported color format is ColorFormat.Bgra8888
uint pixel = sourcePixels[index]&0xffff0000; //Green & Blue components are removed using Bitwise-AND operator
targetPixels[index] = pixel;

Implementation of Similar Filters Using the Same Strategy

In this article, I explained how to implement real-time red filter, however, it is not hard to guess that this same strategy of bitwise-AND-ing can be used to implement similar filters. For instance, to implement real-time blue filter just use 0xff0000ff instead of 0xffff0000 .

More Information

More information about RGBA color space can be found here.

Source Code

Download Real-time RED Filter using Nokia Imaging SDK source code from GitHub


MIT License


I hope you have enjoyed the article. If you want to contribute to this article you are welcome. If you have any questions don't hesitate to ask them in the comments or in Twitter.

This page was last modified on 10 July 2014, at 17:58.
106 page views in the last 30 days.