Processing calls void setup() twice, and I need a work around - processing

I'm working on a program that reads in some images (.jpg) and text from source files and assembling them into a single PDF. I know processing probably isn't the best language to do it in, but its the only one I know how to do it in. Anyway, I am having an issue where processing calls setup two times. I've seen that this issue is resolved when size() is the first line within setup, however I can't have that happen, because I have to read in and store all my data, find the width of the widest image, then make sure its tall enough to accommodate pages with more than one image, and add text before I can decide on how wide and tall my window is. I am looking for suggestions as to how I might structure the code so that I can get all my information without having to call setup twice, because that's causing my PDF to contain two copies of all the data. I've included setup if it helps anyone. Thanks!
void setup(){
font = loadFont("TimesNewRomanPSMT-20.vlw");
File clientsFolder = new File("C:/Users/[my name]/Documents/Processing/ExerciseProgram/Clients");
clients = clientsFolder.listFiles();
for(File x : clients){
println(x.getName());
}
//test files to see if they end in .txt, and have a matching .pdf extension that is newer
String nextClient = needPdf();
File nextClientData = new File("C:/Users/[my name]/Documents/Processing/ExerciseProgram/Clients/" + nextClient);
//println(nextClientData.getName());
//open the file for reading
//setup can't throw the exception, and it needs it, so this should take care of it
try{
Scanner scan = new Scanner(nextClientData);
while(scan.hasNextLine() ){
exercises.add(scan.nextLine());
}
//println(exercises.toString());
printedData = new Exercise[exercises.size()];
println(exercises.size());
for(int i = 0; i < exercises.size(); i++){
printedData[i] = new Exercise((String)exercises.get(i));
}
//count the width and height
int w = 0, h = 0;
for(Exercise e: printedData){
if(e.getWidest() > w){
w = e.getWidest();
}
if(e.getTallest() > h){
h = e.getHeight();
}
}
//and finally we can create the freaking window
// this cuts the .txt off
size(w, h, PDF, "C:/Users/[my name]/Desktop/" + nextClient.substring(0, nextClient.length() - 4) + ".pdf");
}catch (FileNotFoundException e){
println("Unknown error in PApplet.setup(). Exiting.");
println(e.getMessage() );
exit();
}
}

How about moving all these functions to be done before setup()? Although processing usually complains that you are "mixing static and active modes", this hack seems to work at processing 2.0.1:
int i = beforeSetup();
int szX,szY;
int beforeSetup() {
println("look! I am happening before setup()!!");
szX = 800;
szY = 600;
return 0;
}
void setup() {
size(szX,szY);
println("awww");
}
You are essentially calling a function to fill int i just as a hack to run all the functions you want, thus having to compute whatever you want before having to set the window size.

perhaps you can resize your window after calcs are done? Once I made this sketch to see how resizing would work, it is expecting an image file, see if it can help you...
//no error handling for non image files!
PImage img;
int newCanvasWidth = MIN_WINDOW_WIDTH; // made global to use in draw
int newCanvasHeight = MIN_WINDOW_HEIGHT;
java.awt.Insets insets; //"An Insets object is a representation of the borders of a container"
//from http://docs.oracle.com/javase/1.4.2/docs/api/java/awt/Insets.html
void setup()
{
size(200, 200); // always first line
frame.pack(); insets = frame.getInsets();
frame.setResizable(true);
/// for debuging, system depende`nt, at least screen is...
print("MIN_WINDOW_WIDTH = " + MIN_WINDOW_WIDTH);
print(" MIN_WINDOW_HEIGHT = " + MIN_WINDOW_HEIGHT);
print(" screenWidth = " + displayWidth);
println(" screenHeight = " + displayHeight);
}
void draw()
{
if (img != null)
{
image(img, 0, 0, newCanvasWidth, newCanvasHeight);
}
}
void getImageAndResize(File selected)
{
String path = selected.getAbsolutePath();
if (path == null)
{
println ("nono :-|");
}
else
{
img = loadImage(path);
// a temp variable for readability
int widthInsets =insets.left + insets.right;
int heightInsets =insets.top + insets.bottom;
// constrain values between screen size and minimum window size
int newFrameWidth = constrain(img.width + widthInsets, MIN_WINDOW_WIDTH, displayWidth);
int newFrameHeight = constrain(img.height + heightInsets, MIN_WINDOW_HEIGHT, displayHeight -20);
// Canvas should consider insets for constraining? I think so...
newCanvasWidth = constrain(img.width, MIN_WINDOW_WIDTH - widthInsets, displayWidth - widthInsets);
newCanvasHeight = constrain(img.height, MIN_WINDOW_HEIGHT - heightInsets, displayHeight -20 - heightInsets);
// set canvas size to img size WITHOUT INSETS
setSize(newCanvasWidth, newCanvasHeight);
// set frame size to image + Insets size
frame.setSize(newFrameWidth, newFrameHeight);
//// for debuging
println(path);
println(" ");
print("imgW = " + img.width);
println(" imgH = " + img.height);
print("width+ins = " + widthInsets);
println(" height+ins = " + heightInsets);
print("nFrameW = " + newFrameWidth);
println(" nFrameH = " + newFrameHeight);
print("nCanvasw = " + newCanvasWidth);
println(" nCanvsH = " + newCanvasHeight);
println(" ------ ");
}
}
void mouseClicked()
{
img = null;
selectInput("select an image", "getImageAndResize" );
}

Related

Toggle function not working in Processing (ControlP5)

I just made my image generator work with PNG files. For now, it's divided into 3 categories (backgrounds, objects & texts). These are now all combined, and with every mouse click it randomises these PNGs.
I made three toggles, where you could to choose to show either the background and the objects on top, all of them, or all separate. Whenever I run the sketch, it shows the "grey" background, but when I use the toggles, it doesn't show anything, or shows a flickering image, where the mouse-click can't be used to go to the next image. I can't seem to find the problem. Hopefully, you can help. :)
import controlP5.*;
boolean showBackground = false;
boolean showObjects = false;
boolean showGrids = false;
ControlP5 cp5;
PImage[] myImageArray = new PImage[8];
PImage[] myImageArray2 = new PImage[15];
PImage[] myImageArray3 = new PImage[15];
void setup() {
size(1436, 847);
background(211, 211, 211);
for (int i=0; i<myImageArray.length; i++) {
myImageArray[i] = loadImage ( "o" + i + ".png");
myImageArray2[i] = loadImage ( "g" + i + ".png");
myImageArray3[i] = loadImage( "b" + i + ".jpg");
cp5 = new ControlP5(this);
// create a toggle and change the default look to a (on/off) switch look
cp5.addToggle("showBackground")
.setPosition(40, 250)
.setSize(50, 20)
.setValue(true)
.setMode(ControlP5.SWITCH);
cp5.addToggle("showObjects")
.setPosition(40, 400)
.setSize(50, 20)
.setValue(true)
.setMode(ControlP5.SWITCH);
cp5.addToggle("showGrid")
.setPosition(40, 600)
.setSize(50, 20)
.setValue(true)
.setMode(ControlP5.SWITCH);
}
display();
}
void display() {
image(myImageArray3[(int)random(myImageArray.length)], 0, 0, 1436, 847); // b
image(myImageArray2[(int)random(myImageArray.length)], 0, 0, 1436, 847); // g
image(myImageArray[(int)random(myImageArray.length)], 0, 0, 1436, 847); // o
}
void mousePressed() {
display();
}
void draw() {
pushMatrix();
if (showBackground==false) {
image(myImageArray3[(int)random(myImageArray.length)], 0, 0, 1436, 847); // b
} else {
background(211, 211, 211);
}
if (showGrids==false) {
image(myImageArray2[(int)random(myImageArray.length)], 0, 0, 1436, 847); // g
} else {
background(211, 211, 211);
}
if (showObjects==false) {
image(myImageArray[(int)random(myImageArray.length)], 0, 0, 1436, 847); // o
} else {
background(211, 211, 211);
}
popMatrix();
}
Here are a couple of things where the logic your wrote in your code might not match what you had in mind:
When you call display() on mouse it renders those 3 images once (also it will be different images within those since it's using a randomised index). Similarly in draw(), when an does get picked to be rendered, frames will be flickering fast as a random index is generated multiple times per second(each frame). You may want to randomise indices in a different event (e.g. mouse or key press) and store this value in a variable you can re-use.
the conditions you use in draw(): you probably meant to check if the values are true(toggled enabled/turned on in controlP5) ? (e.g. e.g. if (showBackground==true) and initialise the toggles with false, instead of true?)
a big one: in draw() , after each condition(showBackground,showGrids,showObjects), if it's false, you're clearing the the whole frame (so a previous image would be erased)
you have 3 arrays, but you use the size of the first(myImageArray.length) only, which means, even though you may have more images for myImageArray2 and myImageArray3, you're not loading, nor displaying them.
The third grid is labeled "showGrid" when it should be "showGrids": if you aren't consistent with the toggle labels and variable names, toggles won't update the variable names.
you should use more descriptive names for the arrays: it will make it easier to scan/follow your code on the long run.
there's no need to add toggles multiple times in the for loop where you load images: once will do.
Here's what I mean:
import controlP5.*;
boolean showBackground = false;
boolean showObjects = false;
boolean showGrids = false;
ControlP5 cp5;
PImage[] objects = new PImage[8];
PImage[] grids = new PImage[15];
PImage[] backgrounds = new PImage[15];
int currentImage = 0;
void setup() {
size(1436, 847);
//load objects
for (int i=0; i<objects.length; i++) {
objects[i] = loadImage ( "o" + i + ".png");
}
//load grids
for(int i = 0 ; i < grids.length; i++){
grids[i] = loadImage ( "g" + i + ".png");
}
//load backgrounds
for(int i = 0 ; i < grids.length; i++){
backgrounds[i] = loadImage( "b" + i + ".jpg");
}
//setup UI
cp5 = new ControlP5(this);
// create a toggle and change the default look to a (on/off) switch look
cp5.addToggle("showBackground")
.setPosition(40, 250)
.setSize(50, 20)
.setValue(false)
.setMode(ControlP5.SWITCH);
cp5.addToggle("showObjects")
.setPosition(40, 400)
.setSize(50, 20)
.setValue(false)
.setMode(ControlP5.SWITCH);
cp5.addToggle("showGrids")
.setPosition(40, 600)
.setSize(50, 20)
.setValue(false)
.setMode(ControlP5.SWITCH);
}
void mousePressed() {
//go to next image index
currentImage = currentImage + 1;
//check if the incremented index is still valid, otherwise, reset it to 0 (so it doesn't go out of bounds)
if (currentImage >= objects.length) {
currentImage = 0;
}
}
void draw() {
//clear current frame
background(211);//for gray scale value you can just use one value: the brightness level :)
if (showBackground==true) {
image(backgrounds[currentImage], 0, 0, 1436, 847); // b
}
if (showGrids==true) {
image(grids[currentImage], 0, 0, 1436, 847); // g
}
if (showObjects==true) {
image(objects[currentImage], 0, 0, 1436, 847); // o
}
}
Note that currently the same index is used for all 3 arrays.
You may want to add a separate index variable for each array (e.g. currentObjectIndex, currentBackgroundIndex, currentGridIndex) that you can increment independently of each other.
I recommend having a bit more patience and double checking your code first.
Visualise what each line of code will do, then check if it actually does what you expect it to do. Either you will learn something new or improve your logic.
Also, if mentally joggling 3 arrays is tricky (and it can be), go one step back: try your logic with one array only until you get the hang of it, then move on.
A step backwards is sometimes a step forward when you're going in the wrong direction.
As creative as you'd like to be with Processing, bare in mind, the interface to plugging your ideas to it is still a series of one instruction at a time, each precisely tuned to do exactly what you want it to do. There's room for fun, but unfortunately you need to get past the boring parts first

Unable to port Lumia imaging SDK2.0 to SDK 3.0(UWP)

I am having a tough time converting lumia imaging SDK 2.0 code to SDK3.0 in below specific case. I used to increase/decrease the image quality of JPG file using below code in Windows phone 8.1 RT apps:
using (StreamImageSource source = new StreamImageSource(fileStream.AsStreamForRead()))
{
IFilterEffect effect = new FilterEffect(source);
using (JpegRenderer renderer = new JpegRenderer(effect))
{
renderer.Quality = App.COMPRESSION_RATIO / 100.0; // higher value means better quality
compressedImageBytes = await renderer.RenderAsync();
}
}
Now since FilterEffect class has been replaced in SDK 3.0 with EffectList(), I changed code to
using (BufferProviderImageSource source = new BufferProviderImageSource(fileStream.AsBufferProvider()))
{
using (JpegRenderer renderer = new JpegRenderer())
{
IImageProvider2 source1 = new EffectList() { Source = source };
renderer.Source = source1;
renderer.Quality = App.COMPRESSION_RATIO / 100.0;
try
{
var img = await renderer.RenderAsync();
}
catch (Exception ex)
{
;
}
}
}
I am getting InvalidCastException exception. I have tried several combinations but no luck.
I don't really know what is going on with the InvalidCastException, we can continue that discussion in the comments as it will most likely need some back-and-forth.
That said, you could continue without the effect list, and chain effects in the normal way. So to rewrite your scenario:
using (var soruce = new StreamImageSource(...))
using (var renderer = new JpegRenderer(source))
{
renderer.Quality = App.COMPRESSION_RATIO / 100.0;
var img = await renderer.RenderAsync();
}
If you wanted to add an effect (for example a CarttonEffect), just do:
using (var soruce = new StreamImageSource(...))
using (var caroonEffect = new CartoonEffect(source))
using (var renderer = new JpegRenderer(caroonEffect))
{
renderer.Quality = App.COMPRESSION_RATIO / 100.0;
var img = await renderer.RenderAsync();
}
and so on. If you had effects A, B, C and D just make a chain Source -> A -> B -> C -> D -> JpegRenderer.
I am on VS 2015 community version. While digging around this, I got below code working which works exactly same as SDK 2.0. All I did was specified the Size of JpegRenderer. It works for all landscape images but fails to transform the portrait images to correct orientation. There is no exception but result of portrait image is widely stretched landscape image.
I initialized the Size for portrait images to Size(765, 1024) but no impact.
using (JpegRenderer renderer = new JpegRenderer(source))
{
renderer.Quality = App.COMPRESSION_RATIO / 100.0;
try
{
var info = await source.GetInfoAsync();
renderer.Size = new Size(1024, 765);
compressedImageBytes = await renderer.RenderAsync();
}
catch (Exception ex)
{
new MessageDialog("Error while compressing.").ShowAsync();
}
}
I am sorry the working code was using BufferProviderImageSource instead StreamImageSource. Below is the snippet. Few points here:
1) If I don't use Size property I get "The component cannot be found exception".
2) GetInfoAsync(): Yes it was useless for above code but I need to use it to know if image is Landscape or Portrait so that I can initialize Size property of resultant image.
3) If Size property goes beyond 1024x1024 for portrait images I get the exception "Value does not fall within the expected range"
Why lumia made this version so tricky. :(
var stream = FileIO.ReadBufferAsync(file);
using (var source = new BufferProviderImageSource(stream.AsBufferProvider()))
{
EffectList list = new EffectList() { Source = source };
using (JpegRenderer renderer = new JpegRenderer(list))
{
renderer.Quality = App.COMPRESSION_RATIO / 100.0;
renderer.OutputOption = OutputOption.PreserveAspectRatio;
try
{
var info = await source.GetInfoAsync();
double width = 0;
double height = 0;
if (info.ImageSize.Width > info.ImageSize.Height) //landscape
{
width = 1024;
height = 765;
if (info.ImageSize.Width < 1024)
width = info.ImageSize.Width;
if (info.ImageSize.Height < 765)
height = info.ImageSize.Height;
}
else //portrait..
{
width = 765;
height = 1024;
if (info.ImageSize.Width < 765)
width = info.ImageSize.Width;
if (info.ImageSize.Height < 1024)
height = info.ImageSize.Height;
}
renderer.Size = new Size(width, height);
compressedImageBytes = await renderer.RenderAsync();
}
catch (Exception ex)
{
new MessageDialog(ex.Message).ShowAsync();
}
}
}

The file "Starting.gif0000.gif" is missing or inaccessible, make sure the URL is valid or that the file has been added to your sketch and is readable

I am trying to incorporate a .gif document into my Processing code but it appears that something's wrong with the URL. The gif document is in the same folder with my sketch and I don't know what is wrong.
Animation animation1;
float xpos;
float ypos;
float drag = 30.0;
void setup() {
size(640, 360);
background(255);
frameRate(24);
animation1 = new Animation("Starting.gif", 38);
ypos = height * 0.25;
}
void draw() {
background(255);
float dx = mouseX - xpos;
xpos = xpos + dx/drag;
animation1.display(xpos-animation1.getWidth()/2, ypos);
}
// Class for animating a sequence of GIFs
class Animation {
PImage[] images;
int imageCount;
int frame;
Animation(String imagePrefix, int count) {
imageCount = count;
images = new PImage[imageCount];
for (int i = 0; i < imageCount; i++) {
// Use nf() to number format 'i' into four digits
String filename = imagePrefix + nf(i, 4) + ".gif";
images[i] = loadImage(filename);
}
}
void display(float xpos, float ypos) {
frame = (frame+1) % imageCount;
image(images[frame], xpos, ypos);
}
int getWidth() {
return images[0].width;
}
}
Error Message
The file "Starting.gif0000.gif" is missing or inaccessible, make sure the URL is valid or that the file has been added to your sketch and is readable.
The file "Starting.gif0001.gif" is missing or inaccessible, make sure the URL is valid or that the file has been added to your sketch and is readable.
The file "Starting.gif0002.gif" is missing or inaccessible, make sure the URL is valid or that the file has been added to your sketch and is readable.
Pay attention to the class definition. It takes many separate images and makes it a gif as output. What you need to do is to separate the Starting.gif you got into 38 files (if there actually are 38 frames), each named "Starting0000.gif", "Starting0001.gif", "Starting0002.gif" ... "Starting0037.gif".
animation1 = new Animation("Starting", 38);
It should be in a folder called data. This folder should be in the same folder of your sketch.
SketchFolder
Sketch.pde
data
Image.gif
Using the menu to add or dropping the image in the PDE will do this for you. Or you can do it manually.

How to end animation? (processing)

I've written this code which creates a sketchbook.
I'm sure that there's a simple error, but why won't it stop playing at the end of the images?
Here is the code
import ddf.minim.spi.*;
import ddf.minim.signals.*;
import ddf.minim.*;
import ddf.minim.analysis.*;
import ddf.minim.ugens.*;
import ddf.minim.effects.*;
Minim minim;
AudioPlayer sou; //variable name;
final int NUMBER_IMAGES = 27;
PImage[] images; //sets PImage array
int framerate = 10;
int currentImage = 0;
String getImageName(int image_number) {
if (image_number == 0) { // == double equals checks for equality
return "title.gif"; //missing k0.gif and k26.gif until this line //added
} else if (image_number == 26) {
return "title2.gif";
} else {
return "data/K" + image_number + ".gif";
}
}
void setup () {
minim = new Minim(this); //define construction
sou = minim.loadFile("ambience.mp3");
sou.loop();
size (300, 300);
background (255);
frameRate(framerate);
imageMode (CENTER); // Tells the images to display relative to CENTRE
images = new PImage[NUMBER_IMAGES]; // initialises the array (not images)
for (int image_number = 0; image_number < NUMBER_IMAGES; image_number++) {
String filename; // Declared a String called filename
filename = getImageName(image_number);
images[image_number] = loadImage(filename);
}
}
void draw () {
// Set framerate
frameRate(framerate);
// Draws first image
image(images[currentImage], width/2.0, height/2.0);
currentImage++;
currentImage = currentImage % NUMBER_IMAGES;
}
void keyPressed() {
if (keyCode == UP) { // up arrow increases frame rate by one
framerate ++;
}
if (keyCode == DOWN) { //down arrow decreases framerate by one
framerate --;
}
}
I can't think of more details to add although I'm being told I can't post this as it is mostly code.
This line is the one that achieves the recurrent number loop.
currentImage = currentImage % NUMBER_IMAGES
What the % (Modulo) operator does is to calculates the remainder when one number is divided by another. So lets say for example that your NUMBER_IMAGES is 10, at first you'll have 1 & 10 and the value stored in currentImage would be 1. This continues until you reach 10 % 10 the value stored would be 0 and there you'll start all over again.
Here you can find more about the (Module) in Processing: https://www.processing.org/reference/modulo.html
Perhaps a more simple approach to achieve what you'll looking for would be to add a condition to stop when you reach the number of images.
void draw () {
// Set framerate
frameRate(framerate);
// Draws images
image(images[currentImage], width/2.0, height/2.0);
if(currentImage < NUMBER_IMAGES){
currentImage++;
}
}
Hope this helps.
Regards
Jose
Because you have this line inside your code it will show images forever
currentImage = currentImage % NUMBER_IMAGES
If you want stop drawing nex image simply change this line into something like this:
if(currentImage == NUMBER_IMAGES) noLoop()
noLoop() will stop whole draw() animation so it will display your last image. If you want then exit the animation you can add this to your keyPressed():
if (keyCode == ESC){
exit();
}
exit() will correctly exit your program. You can use this function instead of noLoop to end after last image.

Transition of images in Windows Forms Picture box

I'm new to Windows Forms, in my project, i need to change the image in the picture box at runtime. I'm able to do that with the help of a timer. The picture just gets changed. Is it possible to do some transitions when image changes, for example fade in, fade out, blur etc.. If possible could some one please let me know how to do it. I searched in net but in vain.Thanks in advance.
Varun
Simply take new code file and paste below code in it
an original answer for the similar question, answer taken from another question
Answer
using System;
using System.Drawing;
using System.Drawing.Imaging;
using System.Windows.Forms;
public class BlendPanel : Panel
{
private Image mImg1;
private Image mImg2;
private float mBlend;
public BlendPanel()
{
SetStyle(ControlStyles.AllPaintingInWmPaint | ControlStyles.UserPaint | ControlStyles.OptimizedDoubleBuffer, true);
}
public Image Image1
{
get { return mImg1; }
set { mImg1 = value; Invalidate(); }
}
public Image Image2
{
get { return mImg2; }
set { mImg2 = value; Invalidate(); }
}
public float Blend
{
get { return mBlend; }
set { mBlend = value; Invalidate(); }
}
protected override void OnPaint(PaintEventArgs e)
{
if (mImg1 == null || mImg2 == null)
e.Graphics.FillRectangle(new SolidBrush(this.BackColor), new Rectangle(0, 0, this.Width, this.Height));
else
{
Rectangle rc = new Rectangle(0, 0, this.Width, this.Height);
ColorMatrix cm = new ColorMatrix();
ImageAttributes ia = new ImageAttributes();
cm.Matrix33 = mBlend;
ia.SetColorMatrix(cm);
e.Graphics.DrawImage(mImg2, rc, 0, 0, mImg2.Width, mImg2.Height, GraphicsUnit.Pixel, ia);
cm.Matrix33 = 1F - mBlend;
ia.SetColorMatrix(cm);
e.Graphics.DrawImage(mImg1, rc, 0, 0, mImg1.Width, mImg1.Height, GraphicsUnit.Pixel, ia);
}
base.OnPaint(e);
}
}
Build your project. You can now drop a BlendPanel from the top of the toolbox onto your form. Here's a sample program that uses it:
private float mBlend;
private int mDir = 1;
public int count = 0;
public Bitmap[] pictures;
public void myPhoto()
{
pictures = new Bitmap[9];
pictures[0] = new Bitmap(#"Library Images\cf3.jpg");
pictures[1] = new Bitmap(#"Library Images\cf4.jpg");
pictures[2] = new Bitmap(#"Library Images\l1.JPG");
pictures[3] = new Bitmap(#"Library Images\l2.JPG");
pictures[4] = new Bitmap(#"Library Images\l3.JPG");
pictures[5] = new Bitmap(#"Library Images\l4.JPG");
pictures[6] = new Bitmap(#"Library Images\l5.JPG");
pictures[7] = new Bitmap(#"Library Images\l6.JPG");
pictures[8] = new Bitmap(#"Library Images\l7.JPG");
timer1.Interval = 50; //time of transition
timer1.Tick += BlendTick;
try
{
blendPanel1.Image1 = pictures[count];
blendPanel1.Image2 = pictures[++count];
}
catch
{
}
timer1.Enabled = true;
}
private void BlendTick(object sender, EventArgs e)
{
mBlend += mDir * 0.02F;
if (mBlend > 1)
{
mBlend = 0.0F;
if ((count + 1) < pictures.Length)
{
blendPanel1.Image1 = pictures[count];
blendPanel1.Image2 = pictures[++count];
}
else
{
blendPanel1.Image1 = pictures[count];
blendPanel1.Image2 = pictures[0];
count = 0;
}
}
blendPanel1.Blend = mBlend;
}
You'll need to modify the new Bitmap(#"yourimagePath"); calls. Build and run. You should see the displayed image smoothly morph from your first image to your second image without any flickering.
I hope it helps for other...
There is no built-in support for such effects, but you can implement them. I'd suggest to write a custom control that renders the image and have a method for fade-swap, fade itself can be reached with alpha-blending drawing with .NET Graphics class.
However, Graphics class isn't very fast, I don't recommend to use this technique for big images. If you need some fancy UI with hw-accelerated effects, take a look at WPF.
Blend effects are easy to get going by using the ColorMatrix class. There's a good example available in my answer in this thread.
A simple way to get a blur is to resize the image, making it smaller, then redraw it back, making it larger. The Graphics.InterpolationMode property affects the type of blur you'll get.
Those are quicky do-it-yourself solutions. Any decent graphics library has these kind of operations built-in. You probably want something free, check out ImageMagick.NET
To put it simply, not without external (3rd-party) libraries.

Resources