Click here to Skip to main content
Click here to Skip to main content

A VB.NET Fluid Effect Image box

, 6 Mar 2003
Rate this:
Please Sign up or sign in to vote.
An article on a VB.NET ripple image control
<!-- Article image -->

Sample Image - fluid_effect.jpg

<!-- Add the rest of your HTML here -->

Introduction

Add a splash to your splash screen - literally!

Finally a VB.NET implementation of the classic ripple / water / splash / fluid effect! This is a port and a enhancement of Christian Tratz's C# implementation.

Background

Even VB.NET users should be able to have awesome effects. There are many fluid effect routines out there, most in C. This is a VB.NET port of the C# implementation. I've also opened up a few more properties so you can have greater control over the effect programatically. You can make some really neat looks by fiddling with the parameters - make your image appear to be rubber, or under an oil surface, or use regular old water physics. Just check out the sample app and the documentation in the code itself.

See http://www.x-caiver.com/Software for additional versions.

Using the code

In just a few steps you will be set up:

  1. Add fluidEffect.vb to your project
  2. On your form, add a Panel object. Position/size/name appropriately. Don't add a graphic to it yet.
  3. Save your form, then switch to the Code View and close the Designer View.
  4. Search for the Panel name, make sure 'Search hidden text' option is selected. There are two instances you are looking for. Both are within the "Windows Form Designer generated code" region. The 2 examples below assume you named your panel myFluidPanel.
    • Watch out, VS.NET likes to change the two lines to be <yournamespace>.fluidEffect.fluidEffectControl and then the Designer gets confused, and won't display it at all until you go back to the Code and fix it.
'This was the original line. Comment it out and add the line below
'Friend WithEvents myFluidPanel As System.Windows.Forms.Panel
Friend WithEvents myFluidPanel As fluidEffect.fluidEffectControl
'This was the original line. Comment it out and add the line below
'Me.myFluidPanel = New System.Windows.Forms.Panel()
Me.myFluidPanel = New fluidEffect.fluidEffectControl()
  1. Save again. Now you can open up the form in Designer View
  2. Select your panel (now a fluidEffect), and scroll to the "Misc" section of its property sheet, and set the ImageBitmap entry to your bitmap. (the fluidEffect only works with bitmaps for now. it will display a jpg (or any format a Panel can show) in the Designer but won't work when you try to run it)
  3. Configure any of the other settings that you want, Save, and you're done!

Settings you can change:

ImageBitmap - this is the image displayed. Bitmaps only for now
dropHeight - larger values make the initial drops higher
dropRadius - larger values make the radius of the initial ripple larger
Dampener - larger values let the ripples last longer. 4 is normal. 2 & 1 make the fluid very thick so the ripples die fast. A value of 0 has basically no ripples
TheScale - Value of 0 is a ripple bitmap the same size as the image, value 1 is half the size, etc. Larger values are useful if you have a big image to make the processing take less time. Also if you scale the image on your form you should try values 1 and up to get the drops to be correctly located in relation to the mouse
StopRipples - This value should be set to False for normal use. Setting it to True will freeze the ripples. Clicking on the image again will start a new ripple, and un-freeze all the existing ripples.

Gotchas:

  1. Only works with bitmaps for now, but you can assign a jpg/icn/etc to the panel from the Designer View
  2. Gets bogged down quickly with larger images. A 500x400 image of mine could only get ~ 2 fps with the settings I had selected
  3. There are error cases that aren't trapped yet. Launch the demo app, and click a lot, quickly, and you will crash the app. (I was able to get 30 drops going at once clicking slowly, but if I clicked quickly I could crash the app after 5 drops)
  4. When 2 & 3 are addressed I will reactivate the drag event handler. This lets you "draw" on the water, like running your finger over the water.

Points of Interest

VB.NET is not the mathematical, memory swapping powerhouse that C# is. This code bogs down quickly under load. One of my apps has a 500 x 400 pixel splash screen, with transparent sections. I wasn't able to get good frame rates out of it. Smaller images work great though. I selected an interesting spot in one of my splash screens that is only 100x100, and it can ripple in realtime.

History

  • 2/18/2003 - Completed VB.NET port & added some configurable properties.
  • 2/20/2003 - Made demo app for CodeProject, woo hoo
  • 2/21/2003 - VS.NET 2003's VB.NET has native bitshift operators. I'll post a version that reverts to using inline bitshifting, instead of the bitshift function that is used in the VS.NET 2003 version posted here, on my website.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

X-caiver
Web Developer
United States United States
Born and raised in good old sunny Florida, USA. Now living in not-quite-as-good, not-quite-as-old, no-where-near-as-sunny Washington State, USA.
 
http://www.x-caiver.com

Comments and Discussions

 
GeneralAdding to the effect PinmemberDavid Goben26-Mar-11 12:17 
GeneralVery Nice Pinmembereg_Anubhava21-Sep-10 1:09 
GeneralResolved : Fix overflow exception PinmemberPascal Ganaye19-May-09 5:26 
GeneralRe: Resolved : Fix overflow exception PinmemberMember 475686927-Aug-11 21:07 
GeneralShame, such a cool effect... I am missing something here, I had it working once... Pinmemberblkbagger20-Feb-09 18:10 
QuestionAnyone....Anyone.... Bueller??? Pinmemberblkbagger20-Feb-09 7:27 
GeneralTell me this, please someone tell me... Pinmemberblkbagger19-Feb-09 14:19 
Generalhyperlink PinsussNaujas4-Feb-04 21:24 
Generalre : overflow problem Pinsussadevendeuvre10-Oct-03 15:48 
GeneralRe: re : overflow problem PinmemberDomenic15-Jul-04 7:57 
Generalvery impressive PinmemberDaaG17-Apr-03 7:51 
GeneralOverflowException Pinmemberre-flex12-Mar-03 22:13 
GeneralRe: OverflowException PinmemberX-caiver13-Mar-03 7:58 
GeneralRe: OverflowException PinmemberHegemon4-Aug-03 7:01 
GeneralRe: OverflowException PinmemberHegemon4-Aug-03 7:19 
GeneralRe: OverflowException PinsussAnonymous8-Aug-03 0:25 
GeneralRe: OverflowException PinmemberDunstad14-Apr-09 17:18 
GeneralCool PinmemberRabidKangaroo7-Mar-03 5:19 
GeneralVery Nice indead!!! PinmemberPoolbeer7-Mar-03 5:09 
GeneralRe: Very Nice indead!!! PinmemberX-caiver7-Mar-03 12:50 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.141223.1 | Last Updated 7 Mar 2003
Article Copyright 2003 by X-caiver
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid