Rollover Burger Buttons

Although more Code is required to use these Buttons, here is the Code to run a Rollover Burger Button with Preloader animation and a Popup Menu with dividing Sections using the Animate() & Popup() Subroutines:

' BurgerButtonExample1
Public Sub BurgerButtonExample1()

    ' prevent multiple clicks
    If IsRunning Then Exit Sub

    ' Animate takes 5 parameters
    ' - the name of the Button Shape object to animate (required)
    ' - the name of the Rollover Shape object to animate (required)
    ' - the animation type, Pulse, FadeIn or Heartbeat (optional)
    ' - the speed & the Shape colour (optional)
    Animate ButtonAnimationShape:=ActiveSheet.Shapes("button_animation1"), _
            RolloverAnimationShape:=ActiveSheet.Shapes("rollover_animation1"), _
            ButtonAnimationType:=Preloader, _
            ButtonAnimationSpeed:=0.05, _
            ButtonAnimationColour:=RGB(144, 182, 149)

    ' Popup a Menu that is sectioned by using dividing lines
    Popup Section

    ' your Code if required after the Popup Menu Code has been ran - this can be omitted...
    'Range("B2").Select

    ' reset
    IsRunning = False

End Sub
                            

Linking a Macro or VBA Subroutine to a Burger Button is easya nd should be done in 2 steps. First of all remove any Protection for the Worksheet selecting Unprotect on the Changes Group of the REVIEW Tab on the Ribbon. Now, select the Selection Pane on the Arrange Group of the PAGE LAYOUT Tab on the Ribbon. Here you will see all the componenet parts of the Rollover Burger Button. Select 'button1' and hover in the middle of the smaller grouped Shape. Right-click->Assign Macro... Pick your Macro to link to the Burger Button. Press ALT+F11 to go into the VBA Code Editor and select the 'Sheet1 (Rollover Burger Buttons)' Worksheet Code Module. Comment out the Code for now so that it will not run on Mouse Move (use the comment block on the editing Toolbar). Repeat this step for the 'rollover_animation1' Shape and uncomment the Code. Now you have linked the same Macro to 2 Shapes - test out the Rollover Burger Button

Step 1. link the Button Shape to your Macro

Step 2. link the Rollover Animation Shape to the same Macro

The following animations are available, Pulse, FadeIn, Heartbeat and Preloader. Pulse renders the circle as dark as the Shape Colour and then does a lovely Fade out. FadeIn fades the circle from light to dark - this will form the basis of my next Project, Burger Buttons with Popup Menu's. Hearbeat is like the rythmic beating of your heart, well for a second or two anyhow! Preloader spins a broken circle round the Button. All of the animations use my Frame Timer routine to ensure a smooth transition

Here is the Code for each animation - the AnimationType is an Enum of the 4 Values, Pulse, FadeIn, Heartbeat & Preloader which can be accessed via the Intellisense when editing the Code:

    Animate ActiveSheet.Shapes("burger_animation"), Pulse

    Animate ActiveSheet.Shapes("burger_animation"), FadeIn

    Animate ActiveSheet.Shapes("burger_animation"), Heartbeat

    Animate ActiveSheet.Shapes("burger_animation"), Preloader
                            

The following Popup Menu types are available, List, Section and SubMenu. List is a classic list of Commandbar Controls or Menu Items, Section is the same list but with small divider lines so that parts of your Menu can be 'sectioned off' and lastly SubMenu which allows you to build up one or more levels of Menu Items. All of the 3 Menu types can be edited in the Code and adjusted to suit your requirements

Here is the Code for each Popup Menu type - the PopUpMenuType is an Enum of the 3 Values, List, Section & SubMenu which can be accessed via the Intellisense when editing the Code:

    Popup List

    Popup Section

    Popup SubMenu
                            

You can adjust the speed and Colour of the animation via the Animate() Subroutine

Here is the Code to speed up the animation - the default value for the speed Parameter is '0.05'. Test values like '0.08' and '0.1':

    Animate ActiveSheet.Shapes("google_animation"), Pulse, 0.08
                            

The Colour is the Colour of the animation Shape and the Parameter will take a Long value like '16777215', a VBA Colour Code like 'vbGreen' or an RGB Colour Code like 'RGB(229, 223, 255)'

Here is the Code to adjust the Colour

    Animate ActiveSheet.Shapes("ellipse_purple_animation"), Pulse, , RGB(229, 223, 255)
                            

All Rollover Burger Buttons consist of 3 Shapes and a Label Control that have been Grouped together to make 1 single Button. To view the Shapes you should use the Selection Pane on the Arrange Group of the PAGE LAYOUT Tab on the Ribbon. You will note that any Burger Buttons have unique names and that the 'rollover_animation1' Shape is invisible:

The Label Shape sits right at the bottom of the Z-order. To select the Label Shape you need to have the DEVELOPER Tab visible. Select Design Mode on the Controls Group of the DEVELOPER Tab on the Ribbon and then select 'rollover1' in the Selection Pane

The Button Shape is a single Shape that has been Grouped. It is where you should add your Icon, Picture or Image that you want to use for the Button Face. To select the Button Shape simply use the Selection Pane on the Arrange Group of the PAGE LAYOUT Tab on the Ribbon. Select the 'button1' Shape. Hover in the center of the 'button1' Shape and then using Right-click, select Format Picture to bring up the Format Picture Pane. Go to the Paint Bucket and select 'Picture or Text Fill' and then 'File...'. Select a new Image. I use 48x48 pixels for my Buttons, but you can use or resize images much larger if you wish

The Rollover, Circle or Animation Shape is a single Shape that has been Grouped. It is the Shape that 'pops' up whenever a Rollover Burger Button is 'rolled' over. You can style the circle if you wish. To select the Rollover Animation Shape simply use the Selection Pane on the Arrange Group of the PAGE LAYOUT Tab on the Ribbon. Select the Shape 'rollover_animation1' Hover in the center of the 'button1' Shape and then using Right-click, select Format Picture to bring up the Format Picture Pane. Go to the Paint Bucket and you can change the Fill Colour. You can also change the Shape Style if you wish and add things like 'Glow'

The main Circle or Animation Shape is a single Shape that has been Grouped and is displayed as INVISIBLE. It is the Shape that does the animation when the Rollover Burger Button is clicked. You can style the circle if you wish. To select the Animation Shape simply use the Selection Pane on the Arrange Group of the PAGE LAYOUT Tab on the Ribbon. Select the Shape 'button_animation1' Hover in the center of the 'button1' Shape and then using Right-click, select Format Picture to bring up the Format Picture Pane. Here you can change the Colour etc. If you want though, you can change the actual Shape by using the 'Edit Shape->Change Shape' on the Insert Shapes Group of the FORMAT Tab on the Ribbon to a totally different Shape. Please Note: you can turn on the VISIBILITY of the Shape on the Selection Pane

Before you add the Button, you need to add some Code into your Project or newly Saved Workbook. Copy all of the Code in the 'mdBurgerButtons' Code Module into your own Code Module. You can also drag the Code Module into your own Project using the Project Explorer Window if you prefer. You will be able to delete any Code that is not required later

' Software Name:
' Rollover Burger Buttons - Burger Buttons with Rollover & Click Animation to Trigger a Macro for Excel by Mark Kubiszyn
'
' © Copyright/Author:
' Mark Kubiszyn. All Rights Reserved
' Website/Follow:
' https://www.kubiszyn.co.uk/
' https://www.facebook.com/Kubiszyn.co.uk/
'
' License:
' This Software is released under an MIT License (MIT)
' https://www.kubiszyn.co.uk/license.html
'
' Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files
' (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge,
' publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so,
' subject to the following conditions:
'
' THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
' MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR
' ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
' SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
'
' Changelog:
' 24.10.2018 (Version 1) released

' force explicit variable declaration
Option Explicit

' 64bit & 32bit dec's
#If VBA7 And Win64 Then
    Public Declare PtrSafe Function SetTimer Lib "user32" (ByVal hwnd As LongLong, ByVal nIDEvent As LongLong, ByVal uElapse As LongLong, ByVal lpTimerFunc As LongLong) As LongLong
    Public Declare PtrSafe Function KillTimer Lib "user32" (ByVal hwnd As LongLong, ByVal nIDEvent As LongLong) As LongLong
    Public Declare PtrSafe Function GetCursorPos Lib "user32" (lpPoint As POINTAPI) As Long
    Public Declare PtrSafe Function GetAsyncKeyState Lib "user32" (ByVal vKey As Long) As Integer
#Else
    Public Declare Function SetTimer Lib "user32" (ByVal hwnd As Long, ByVal nIDEvent As Long, ByVal uElapse As Long, ByVal lpTimerFunc As Long) As Long
    Public Declare Function KillTimer Lib "user32" (ByVal hwnd As Long, ByVal nIDEvent As Long) As Long
    Public Declare Function GetCursorPos Lib "user32" (lpPoint As POINTAPI) As Long
    Public Declare Function GetAsyncKeyState Lib "user32" (ByVal vKey As Long) As Integer
#End If

' pixel type
Public Type POINTAPI
    X As Long
    Y As Long
End Type

' global animation type
Public Enum AnimationType
    [_First]
    Pulse = 1
    FadeIn = 2
    Heartbeat = 3
    Preloader = 4
    [_Last]
End Enum

' local vars
' - IsRunning, used to prevent repeated animation & Macro's from being triggered by multiple clicking
Private IsRunning As Boolean

' global vars
' - used by the Timer
Public lngTimerID&
Public blnActiveTimer As Boolean
Public intTimerTick As Integer
Public intShapeIndex As Integer

...rest of the Code is omitted...
                           

Now to add a Burger Button to your own Project or Workbook, select a Button in the BurgerButtons.xlsm File using the Selection Pane and then by right-click and Copy the Button to the Clipboard. Paste the Button into your own Project or a new Workbook that has been Saved. Follow the instructions to Link a Macro to a Button. If you are using a Hyperlink Tooltip or a Popup Menu then you will need to take the Code from the respective Workbook

Code is included to add Hyperlinks - you will need to Copy the Code to do this from the respective Workbook in the Zip Archive download. The Code to attach a Rollover Hyperlink to each Shape is shown below:

' AddFakeHyperlink, does what it says, just adds a Hyperlink to itself, but the important part is, that it allows a ToolTip ;)
' - change the name of the Shape for your Shape and the ScreenTip, then run the Code using F5
Private Sub AddFakeHyperlink()

    Dim objShape As Shape
    Set objShape = ActiveSheet.Shapes("burger2")
    ActiveSheet.Hyperlinks.Add Anchor:=objShape, Address:="", ScreenTip:="configuration menu"
    Set objShape = Nothing

End Sub

                           

Code is included to add a Popup Menu - you will need to Copy the Code to do this from the respective Workbook in the Zip Archive download. The Code to Call the Rollover Button, the decision Subroutine and the Code Called to create a Sectioned Popup Menu is shown below:

' BurgerButtonExample1
Public Sub BurgerButtonExample1()

    ' prevent multiple clicks
    If IsRunning Then Exit Sub

    ' Animate takes 5 parameters
    ' - the name of the Button Shape object to animate (required)
    ' - the name of the Rollover Shape object to animate (required)
    ' - the animation type, Pulse, FadeIn or Heartbeat (optional)
    ' - the speed & the Shape colour (optional)
    Animate ButtonAnimationShape:=ActiveSheet.Shapes("button_animation1"), _
            RolloverAnimationShape:=ActiveSheet.Shapes("rollover_animation1"), _
            ButtonAnimationType:=Preloader, _
            ButtonAnimationSpeed:=0.05, _
            ButtonAnimationColour:=RGB(144, 182, 149)

    ' Popup
    Popup Section

    ' your Code...
    'Range("B2").Select

    ' reset
    IsRunning = False

End Sub

' Popup, switch used to select one of 3 Popup Menu types, List, Section or SubMenu
Private Sub Popup(ByVal PopUpMenu As PopUpMenuType)
    Select Case PopUpMenu
    Case 1
        PopupList
    Case 2
        PopupSection
    Case 3
        PopupSubMenu
    End Select
End Sub

' PopupSection, creates a simple Popup List of configurable Menu Items that can fire macros with horizontal lines to section off specific Items
' - to pass a Parameter into a Macro use .OnAction = ' "'ExamplePopupListCallback ""Foobar"" '"
' - also remember that you can use the CommandBars, Standard Controls to identify FaceID's
Private Sub PopupSection()

    ' vars
    Const POPUP_MENU As String = "PopUpMenu"
    Dim objMenu As CommandBar

    On Error Resume Next
    ' delete old bar if it exists
    Application.CommandBars(POPUP_MENU).Delete
    Set objMenu = CommandBars.Add(Position:=msoBarPopup, Temporary:=True)

    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Copy"
        .FaceId = CommandBars("Standard").Controls("Copy").ID
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback_Copy"
    End With

    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Cut"
        .FaceId = CommandBars("Standard").Controls("Cut").ID
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback_Cut"
    End With

    ' -----------------------------------------------------------------

    ' to begin a new Section, add the .BeginGroup = True to the Control
    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Save Data"
        .FaceId = 3
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback"
        .BeginGroup = True
    End With

    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Information"
        .FaceId = 487
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback"
    End With

    ' -----------------------------------------------------------------

    ' to begin a new Section, add the .BeginGroup = True to the Control
    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Browse for Folder"
        .FaceId = 23
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback"
        .BeginGroup = True
    End With

    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Export Data"
        .FaceId = 246
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback"
    End With

    With objMenu.Controls.Add(Type:=msoControlButton)
        .Caption = "Print Worksheet"
        .FaceId = 745
        .OnAction = "'" & ThisWorkbook.Name & "'!" & "ExamplePopupSectionCallback"
    End With

    objMenu.ShowPopup

    On Error GoTo 0

End Sub

                           

There is no possibility of changing the Burger Icon Colour in this Version. I may consider this in any future builds. When Tooltips are used there is a slight lag updating the Tooltip when switching between individual Rollover Burger Buttons. The maximum number of Buttons allowed for any of the Rollover Files is 10 due to how they use a global ShapeIndex Suffix - I will amend this for future builds

Second generation Rollover Burger Buttons are far superior in speed and animation - their only drawback is that you cannot use a Tooltip, but other than that, I would recommend that you employ the Hyperlink Cell Rollover technique. Two Files are included in the Download that use the second generation Rollover technique

Rollover Burger Button Rollover Shape

This is a Screen Shot of the Rollover Burger Button as it is 'Rolled over':

Rollover Burger Button Preloader Animation

This is a Screen Shot of the Rollover Burger Button after it has been clicked:

Rollover Burger Button using a Tooltip

This is a Screen Shot of the Rollover Burger Button using a Tooltip:

Rollover Burger Button using a Popup Menu

This is a Screen Shot of a Rollover Burger Button using a Popup Menu:

Rollover Burger Button with a Spin Animation

This is a Screen Shot of a Rollover Burger Button using a Spin Animation:

Magnifier Rollover Burger Button with a Spin Animation

This is a Screen Shot of a Rollover Burger Button using a Spin Animation on a Magnifier Icon:

Spanner Rollover Burger Button with a Spin Animation

This is a Screen Shot of a Rollover Burger Button using a Bounce Animation on a Spanner Icon:

Droplet Rollover Burger Button with a Spin Animation

This is a Screen Shot of a Rollover Burger Button using a Spin Animation on a Water Droplet Icon:

Water Droplets Rollover Burger Button with a Spin Animation

This is a Screen Shot of a Rollover Burger Button using a Spin Animation on Water Droplets Icon:

Power Rollover Burger Button with a Spin Animation

This is a Screen Shot of a Rollover Burger Button using a Spin Animation on a Power Icon:

Videos of the Rollover Burger Buttons in action

Here, I run through the examples for the Rollover Burger Buttons. A Rollover circle will appear whenever a Burger Button is 'Rolled over', then an animation will be shown when the Burger Button is clicked. Finally the Rollover circle will 'popup' again if you are still over the Rollover Burger Button. The first example uses a Preloader animation on a 3/4 circle arch. The second example uses a Pulse animation on a normal circle:

Here, I run through the examples for the Rollover Burger Buttons with Tooltips, switching between Rollover Burger Buttons to demostrate how they work:

Here, I run through the example for the Rollover Burger Button with a Popup Menu: