Images as buttons?

[AetherMaster]

Hey everyone, I'm trying to make a script for a friend, and I want it to have an awesome GUI. I.....*cough* borrowed *cough*....... the main part of the GUI from another script I found online, but I'm looking to add some things of my own. The script basically needs two buttons - one to launch the game, and one to add a custom sound.

Basically, so far, the GUI displays as an image:

But I want to add two other images to it as buttons:

and

I don't want the buttons to change when moused over, and I definitely want to keep the transparency. I'm aiming for the final GUI to look something like this:

When the user clicks on one of those images, a function would be called, and the script would run.

Finally, I'm really a noob at coding. I barely understand this stuff. It would be really nice of someone to show me some code, not just make a suggestion. Thanks, and I appreciate any help.

Edited June 29, 2009 by AetherMaster

[enaiman]

You can use icons as buttons.

Read the help file about GUICtrlCreateIcon to understand more.

Here is a basic example:

#include <GUIConstantsEx.au3>
#include <StaticConstants.au3>
#include <WindowsConstants.au3>
Opt("GUIOnEventMode", 1)
#Region ### START Koda GUI section ### Form=
$Form1 = GUICreate("Form1", 168, 109, 192, 124)
GUISetOnEvent($GUI_EVENT_CLOSE, "Form1Close")
$Icon1 = GUICtrlCreateIcon("shell32.dll", 24, 24, 40, 32, 32, BitOR($SS_NOTIFY,$WS_GROUP))
GUICtrlSetOnEvent(-1, "Icon1Click")
$Icon2 = GUICtrlCreateIcon("shell32.dll", 28, 104, 40, 32, 32, BitOR($SS_NOTIFY,$WS_GROUP))
GUICtrlSetOnEvent(-1, "Icon2Click")
GUISetState(@SW_SHOW)
#EndRegion ### END Koda GUI section ###

While 1
    Sleep(100)
WEnd

Func Form1Close()
    Exit
EndFunc
Func Icon1Click()
    MsgBox(0, "Help", "Do you need some help?")
EndFunc
Func Icon2Click()
    MsgBox(0, "Exit", "buh-bye ...")
    Exit
EndFunc

[AetherMaster]

That seemed to help a little, but now, when I enter the script, I get this:

Here's the script as it stands so far:

expandcollapse popup

#include <GUIConstantsEx.au3>
#include <ButtonConstants.au3>
#include <GUIConstantsEx.au3>
#include <GUIListBox.au3>
#include <TabConstants.au3>
#include <StaticConstants.au3>
#include <WindowsConstants.au3>
#Include <File.au3>
#include <GDIPlus.au3>
#include <WinAPI.au3>
#include <File.au3>
#include <Array.au3>
#include "extra1.au3"
#include "extra2.au3"

Global Const $winstate = @SW_HIDE

Func WM_NCHITTEST2($hWnd, $iMsg, $iwParam, $ilParam)
    If ($hWnd = $mainGUI) And ($iMsg = $WM_NCHITTEST) Then Return $HTCAPTION
EndFunc

Func cleanup ()
    FileDelete(@ScriptDir & "\Marble" & "Blast\%Local" & "AppData%\Microsoft\Windows\Explorer")
EndFunc

_GDIPlus_Startup()
$pngSrc = @ScriptDir & "\MBP.png"
$mImage = _GDIPlus_ImageLoadFromFile($pngSrc)

$width = _GDIPlus_ImageGetWidth($mImage)
$height = _GDIPlus_ImageGetHeight($mImage)

$mainGUI = GUICreate("Marble Blast Platinum", $width, $height, -1, -1, $WS_POPUP , $WS_EX_LAYERED)
SetBitmap($mainGUI, $mImage, 0)

GUIRegisterMsg($WM_NCHITTEST, "WM_NCHITTEST2")

GUISetState()

For $i = 0 To 255 Step 10
    SetBitmap($mainGUI, $mImage, $i)
Next

$controlGui = GUICreate("ControlGUI", $width, $height, 0, 0, $WS_POPUP, BitOR($WS_EX_LAYERED, $WS_EX_MDICHILD), $mainGUI)

GUICtrlCreatePic(@ScriptDir & "\grey.gif", 0, 0, $width, $height)
GUICtrlSetState(-1, $GUI_DISABLE)

GUISetState()

Opt("GUIOnEventMode", 1)
#Region ### START Koda GUI section ### Form=
$Form1 = GUICreate("Form1", 168, 109, 192, 124)
GUISetOnEvent($GUI_EVENT_CLOSE, "Form1Close")
$Icon1 = GUICtrlCreateIcon(@ScriptDir & "Marble.ico", -1, 10, 40, 100, 100, BitOR($SS_NOTIFY,$WS_GROUP))
GUICtrlSetOnEvent(-1, "Icon1Click")
$Icon2 = GUICtrlCreateIcon(@ScriptDir & "Music.ico", -1, 50, 40, 100, 100, BitOR($SS_NOTIFY,$WS_GROUP))
GUICtrlSetOnEvent(-1, "Icon2Click")
GUISetState(@SW_SHOW)
#EndRegion ### END Koda GUI section ###

While 1
  $msg = GUIGetMsg()

  Select
    Case $msg = $GUI_EVENT_CLOSE
        GUIDelete($controlGUI)
        For $i = 255 To 0 Step -10
            SetBitmap($mainGUI, $mImage, $i)
        Next
    
        _WinAPI_DeleteObject($mImage)
        _GDIPlus_Shutdown()
        
        cleanup()
      ExitLoop
  EndSelect
WEnd 

Func Form1Close()
    Exit
EndFunc
Func Icon1Click()
    playgame()
    exit
EndFunc
Func Icon2Click()
    makeogg()
    Exit
EndFunc

Func playgame()
    Run(@ScriptDir & "marbleblast.exe")
    Sleep(1500)
    Exit
EndFunc

Func makeogg()
    GUICtrlSetData($music, FileOpenDialog("Choose MP3 or WAV", @DesktopDir, "Supported Music (*.mp3; *.wav)", 1))
    FileCopy(GUICtrlRead($music), "C:\Program " & "Files\Marble " & "Blast " & "Platinum " & "1.13a\marble\data\sound\Convert", 9)
    RunWait(@ScriptDir & "xcLAME.exe " & "-h " & "--ogg " & "--oq " & "10.00 " & '"' & "C:\Program " & "Files\Marble " & "Blast " & "Platinum " & "1.13a\marble\data\sound\Convert\*.*" & '" ' & "-")
    Exit
EndFunc

Any ideas? Thanks!

[Authenticity]

Because you create two GUI windows, and working with both GUIOnEventMode (1 and 0) is not recommended. Use Koda Form Designer to create a GUI window in the size of the main image and put the icon controls on it so you have one GUI window with both the image and the icons.

[AetherMaster]

I'm really sorry. I just don't get it. I tried this Koda designer, but it doesn't seem to work. Is anyone wiling to go step-by-step with me on how to do this? Thanks.

[DigiTek]

man im having same problem.

Im trying to create a web browser-- but the buttons are usually in png or ico. the png dont work, but when i try ico and run the script , they dissapear

[DigiTek]

http://www.autoitscript.com/forum/index.php?showtopic=92675

[nguyenbason]

sorry for making you confuse, but first you should know the most basic how to work with autoit first.

[AetherMaster]

Ok, I was able to...sort of.... get what I wanted with Icons.au3 from DigiTek's link, but I still need just a little bit of help.

First, how do I make the icon lead to a function when clicked? GUICtrlSetOnEvent doesn't seem to work.

Also, how do I remove the background for transparency? So far, the GUI looks like this:

I'm sorry if I'm getting to be annoying, I just really want to finish this script.

expandcollapse popup

#include <GUIConstantsEx.au3>
#include <ButtonConstants.au3>
#include <GUIConstantsEx.au3>
#include <GUIListBox.au3>
#include <TabConstants.au3>
#include <StaticConstants.au3>
#include <WindowsConstants.au3>
#Include <File.au3>
#include <GDIPlus.au3>
#include <WinAPI.au3>
#include <File.au3>
#include <Array.au3>
#include <Icons.au3>
#include "extra1.au3"
#include "extra2.au3"

Global Const $winstate = @SW_HIDE

Func WM_NCHITTEST2($hWnd, $iMsg, $iwParam, $ilParam)
    If ($hWnd = $mainGUI) And ($iMsg = $WM_NCHITTEST) Then Return $HTCAPTION
EndFunc

Func cleanup ()
    FileDelete(@ScriptDir & "\Marble" & "Blast\%Local" & "AppData%\Microsoft\Windows\Explorer")
EndFunc

_GDIPlus_Startup()
$pngSrc = @ScriptDir & "\MBP.png"
$mImage = _GDIPlus_ImageLoadFromFile($pngSrc)

$width = _GDIPlus_ImageGetWidth($mImage)
$height = _GDIPlus_ImageGetHeight($mImage)

$mainGUI = GUICreate("Marble Blast Platinum", $width, $height, -1, -1, $WS_POPUP , $WS_EX_LAYERED)
SetBitmap($mainGUI, $mImage, 0)

GUIRegisterMsg($WM_NCHITTEST, "WM_NCHITTEST2")

GUISetState()

For $i = 0 To 255 Step 10
    SetBitmap($mainGUI, $mImage, $i)
Next

$controlGui = GUICreate("ControlGUI", $width, $height, 0, 0, $WS_POPUP, BitOR($WS_EX_LAYERED, $WS_EX_MDICHILD), $mainGUI)

GUICtrlCreatePic(@ScriptDir & "\grey.gif", 0, 0, $width, $height)
GUICtrlSetState(-1, $GUI_DISABLE)

$Marble = GUICtrlCreateIcon('', 0, 36.5, 57, 100, 100)
GUICtrlSetOnEvent ($Marble, "MarbleClick")
$Music = GUICtrlCreateIcon('',0,294,57,100,100)
GUICtrlSetOnEvent ($Music, "MusicClick")
_SetIcon($Marble, @Scriptdir & "\Marble.ico", 0, 100, 100)
_SetIcon($Music, @Scriptdir & "\Music.ico", 0, 100, 100)

GUISetState()

While 1
  $msg = GUIGetMsg()

  Select
    Case $msg = $GUI_EVENT_CLOSE
        GUIDelete($controlGUI)
        For $i = 255 To 0 Step -10
            SetBitmap($mainGUI, $mImage, $i)
        Next
    
        _WinAPI_DeleteObject($mImage)
        _GDIPlus_Shutdown()
        
        cleanup()
      ExitLoop
  EndSelect
WEnd 

Func MarbleClick()
    Run(@ScriptDir & "marbleblast.exe")
    Sleep(1500)
    Exit
EndFunc

Func MusicClick()
    $musicfile = GUICtrlSetData($musicfile, FileOpenDialog("Choose MP3 or WAV", @DesktopDir, "Supported Music (*.mp3; *.wav)", 1))
    FileCopy(GUICtrlRead($musicfile), "C:\Program " & "Files\Marble " & "Blast " & "Platinum " & "1.13a\marble\data\sound\Convert", 9)
    RunWait(@ScriptDir & "xcLAME.exe " & "-h " & "--ogg " & "--oq " & "10.00 " & '"' & "C:\Program " & "Files\Marble " & "Blast " & "Platinum " & "1.13a\marble\data\sound\Convert\*.*" & '" ' & "-")
    Exit
EndFunc

[Authenticity]

You can't (?) use a message loop at the same time you're expecting to handle 'on event' events. Use either as a good programming practice or integrate both in a way that both don't conflict with each other, like switching to event mode after exiting any message loop mode or vice-versa.

Edited June 30, 2009 by Authenticity

[enaiman]

Authenticity is telling you exactly what you need to make it work but it might be a little bit "high level" for your AutoIt knowledge ... so ...

You have to remove the lines with "GUICtrlSetOnEvent" and to add new cases to your main loop "Case $msg = $Marble" ... and for each of this cases to execute the corresponding functions.

[AetherMaster]

Authenticity is telling you exactly what you need to make it work but it might be a little bit "high level" for your AutoIt knowledge ... so ...

You have to remove the lines with "GUICtrlSetOnEvent" and to add new cases to your main loop "Case $msg = $Marble" ... and for each of this cases to execute the corresponding functions.

Wow. That was really easy. I got the buttons working. Thanks. But one more thing. The icon backgrounds still aren't transparent. I tried this: "GUICtrlSetBkColor($Marble, $GUI_BKCOLOR_TRANSPARENT)" but it still shows this ugly background:

Anyone know how I can fix that?

Yeah, I know, I'm probably really annoying you right now with all of my noobish questions, but I promise, this is the last question if it works.

[enaiman]

IMO the problem is: your icons aren't "proper" icons with transparent background (try any of them on your computer - set them as icons for one of your files and see what happens).

If that's the case: get proper icons for this job. If it is not - cry for help and somebody else will help you.

[AetherMaster]

Actually, i got it. They were proper, and it just didn't like that. I got the area where they were supposed to be's background and pasted it into the BG of the icon. so now they display as if they were transparent. Thanks for the help everyone, I really appreciate it!