Introduction.
A Screen with Animated Text or Controls gives the application a lively look and feel than a rigid screen to the user and to the onlooker. Command Button Animation was the first Blogpost that I have published on this Website.
Another Screen design improvement was creating 3D headings on Form and Report with different Fonts, Sizes, and Styles. Initially, create them manually and this leads to the creation of a 3D-Text Wizard.
You can find the details of 3D Text Styles in the following Posts.
IBM AS400 (iSeries) Screens influenced me to go along with designing MS-Access Screens with a dark background, data labels with light shades, and Text in Green. Even though these are old text-based screens better visibility of information is the main attraction of these screens.
But, when I started designing them I faced a little problem with the Command Button Animation that was in use till that time because it was not designed for dark backgrounds. I had to invent a different animation method around the original command button. It is simple to design besides easy to implement without the use of too complex VBA Code.
So, here it is for you and I hope you like it too. First, we will implement it with a simple and easy-to-understand method. After that, we will write a common routine that can drive the animation on any form with one or two lines of code.
Command Button Design.
Open a new Form or an existing one.
Select the Footer of the Form. If it is not visible select Form Header/Footer from View Menu.
Display the Property Sheet (View - ->Properties).
Change the Back Color Property Value to 0.
Select the Command Button Tool from Toolbox and draw a Command Button in the Footer Section of the Form.
Display the Property Sheet of the Command Button.
Change the Name Property Value to cmdExit and Caption property value to Exit.
Select the Rectangle Tool from Toolbox and draw a rectangle around the Command Button as shown in the sample design below:
Give a little more gap, between the button and the rectangle at the bottom and the right side than above and left, giving it a feel that the Command Button is in a raised state.
Click on the Rectangle and display its Property Sheet.
Change the Name Property Value to ExitBox and the Visible Property Value to No.
Animating the Command Button
Now, it is time to implement the animation trick. This time, we will not animate the button like we did earlier on the Command Button Animation; instead, the Box around it will be made visible or hidden based on the Mouse movement over the Command Button.
We will track the mouse movement in Code. When the mouse is over the Command Button the rectangle is made visible and when the mouse moves out it is hidden. When this action is repeated it will look like the command button become raised and goes flat again. It has a better look and feels in a dark background rather than remains flat all the time.
We need to place Code at two places to trap the mouse movements, on the On Mouse Move Event of the Command Button and on the On Mouse Move Event in the Form Footer.
Select the Command Button.
Display the Property Sheet of the Command Button (View - ->Properties).
Select [Event Procedure] in the On Mouse Move property and click on the build button (. . .).
Copy and paste the code given below, between the sub-routine skeleton. You can ignore the first and last lines while copying as these will be present in the Module.
Private Sub cmdExit_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single) If Me.ExitBox.Visible = False Then Me.ExitBox.Visible = True End If End Sub
Click anywhere within the Form Footer, to select that area, display the Property Sheet, and repeat Step-14 above.
Copy and paste the following code into the empty skeleton of the sub-routine, as you did above:
Private Sub FormFooter_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single) If Me.ExitBox.Visible = True Then Me.ExitBox.Visible = False End If End Sub
Actually, the IF. . .Then statement is not required in the routine. This is introduced to avoid changing the value repeatedly during mouse movements and to avoid flickering.
Trial Run of Animation
Save the Form and open it in Normal view.
Move the Mouse over and out of the Command Button repeatedly which will give the button a sense of going flat and raised state every time.
The AnimateFrame() Function
When we implement this animation at several places duplicating the above code everywhere is not good programming. A common routine is given below that can be called with a one-line code so that it is easy to implement anywhere and for any number of buttons.
Copy and paste the code given below into a Global Module of your database and save it.
Public Function AnimateFrame(ByVal OnOff As Boolean, ByVal x_Box As String) Dim frm As Form, ctrl As Control On Error GoTo AnimateFrame_Err Set frm = Application.Screen.ActiveForm Set ctrl = frm.Controls(x_Box) Select Case OnOff Case False If ctrl.Visible = False Then Exit Function frm.Controls(x_Box).Visible = False Case True If ctrl.Visible = True Then Exit Function frm.Controls(x_Box).Visible = True End Select AnimateFrame_Exit: Exit Function AnimateFrame_Err: Resume AnimateFrame_Exit End Function
Now, we can replace the code we have written earlier with a single-line Code each to display and hide the rectangle.
If Me.ExitBox.Visible = False Then Me.ExitBox.Visible = True End If
The above code can be replaced with the statement
AnimateFrame True, "ExitBox"
in the On Mouse Move of Command Button and
If Me.ExitBox.Visible = True Then Me.ExitBox.Visible = False End If
can be replaced with the statement
AnimateFrame False, "ExitBox"
in the FormFooter_MouseMove event procedure.
- Command Button Animation
- Double Action Command Button
- Colorful Command Buttons
- Transparent Command Button
- Command Button Animation-2
- Creating Animated Command Button with VBA
- Command Button Color Change on Mouse Move
No comments:
Post a Comment
Comments subject to moderation before publishing.