Display an image on an transparent GUI

[Acce]

Hi im having such a hard time on a seemingly easy task I want to display an png image on a transparent GUI . Seams easy enough but for some reason I get a border around the png. Here is what I have tried:

$mGUI = GUICreate("",800, 590,100,120, $WS_POPUP, $WS_EX_LAYERED+$WS_EX_TOOLWINDOW,$hGUI)
GUISetBkColor(0xabcdef)
    _WinAPI_SetLayeredWindowAttributes($mGUI,0xabcdef)
GUISetState(@SW_SHOW)
    $g_hGfx = _GDIPlus_GraphicsCreateFromHWND($mGUI) ;create a graphics object from a window handle
    $g_hBitmap = _GDIPlus_BitmapCreateFromGraphics(800, 590, $g_hGfx) ;create a Bitmap object based on a graphics object
    $g_hGfxCtxt = _GDIPlus_ImageGetGraphicsContext($g_hBitmap) ;get the graphics context of the image / bitmap to draw on image / bitmap
    _GDIPlus_GraphicsSetSmoothingMode($g_hGfxCtxt, $GDIP_SMOOTHINGMODE_HIGHQUALITY) ;sets the graphics object rendering quality (antialiasing)
    _GDIPlus_GraphicsClear($g_hGfxCtxt)
_GDIPlus_GraphicsClear($g_hBitmap)

      _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImage_resized, 20, 0) ; Draw to buffer
      _GDIPlus_GraphicsDrawImage($g_hGfx, $g_hBitmap, 0, 0) ; draw to GUI

Have tried clearing the buffer but this gives a black background , what can be done ? 

[caramen]

Hello, 

You could make a child Gui without borders/close & maximize button with exact same size of your pic. And import picture into it.

[Nine]

@Acce Hint : You would get much more help if you could post runable script.  Giving just a small portion of a script is way too much work for us to replicate your issue.

[Acce]

Here is a snippet should work: 

 

expandcollapse popup

#include <GDIPlus.au3>
#include <WindowsConstants.au3>
#include <GUIConstants.au3>
#include <Misc.au3>
#include <File.au3>
#include <CityBuildingIsoData.au3>
#include <WinAPI.au3>
#include <ScreenCapture.au3>
    Global $mGUI
Global $hImageBg
    Sliding_Menu()
    Func Sliding_Menu()
;Menu GUI
$mGUI = GUICreate("",800, 590,100,120, $WS_POPUP)
GUISetBkColor(0xabcdef)
    _WinAPI_SetLayeredWindowAttributes($mGUI,0xabcdef)
GUISetState(@SW_SHOW)
;Menu GUI <=====
    ;Menu GDI
        ;Load Image
    $hImage_1  = _GDIPlus_ImageLoadFromFile(@ScriptDir & "\assets\HUD\" & "Menu_slider.png")
    $hImage_resized = _GDIPlus_ImageResize($hImage_1, 650, 500)
    
  ;create buffered graphics frame set for smoother gfx object movements
    $g_hGfx = _GDIPlus_GraphicsCreateFromHWND($mGUI) ;create a graphics object from a window handle
    $g_hBitmap = _GDIPlus_BitmapCreateFromGraphics(800, 590, $g_hGfx) ;create a Bitmap object based on a graphics object
    $g_hGfxCtxt = _GDIPlus_ImageGetGraphicsContext($g_hBitmap) ;get the graphics context of the image / bitmap to draw on image / bitmap
    _GDIPlus_GraphicsSetSmoothingMode($g_hGfxCtxt, $GDIP_SMOOTHINGMODE_HIGHQUALITY) ;sets the graphics object rendering quality (antialiasing)
    
    ;capture screen
         $mGUI_Pos = WinGetPos($mGUI)
     $x = $mGUI_Pos[0]
     $y = $mGUI_Pos[1]
    $hHBitmap = _ScreenCapture_Capture("",$x,$y,$x + 800, $y + 700)
    $hImageBg  = _GDIPlus_BitmapCreateFromHBITMAP($hHBitmap)
    For $i = -400 to -20 step 10
          ;_GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImageBg, 0, 0) ; Draw to buffer (bg)
      _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImage_resized, $i, 0) ; Draw to buffer (Hud)
          _GDIPlus_GraphicsDrawImage($g_hGfx, $g_hBitmap, 0, 0) ; draw to GUI
    Next
sleep(1000)
;slideout()
    Do
Until GUIGetMsg() = $GUI_EVENT_CLOSE
    EndFunc
Func slideout()
        ;Load Image
    $hImage_1  = _GDIPlus_ImageLoadFromFile(@ScriptDir & "\assets\HUD\" & "Menu_slider.png")
    $hImage_resized = _GDIPlus_ImageResize($hImage_1, 650, 500)
    
  ;create buffered graphics frame set for smoother gfx object movements
    $g_hGfx = _GDIPlus_GraphicsCreateFromHWND($mGUI) ;create a graphics object from a window handle
    $g_hBitmap = _GDIPlus_BitmapCreateFromGraphics(800, 590, $g_hGfx) ;create a Bitmap object based on a graphics object
    $g_hGfxCtxt = _GDIPlus_ImageGetGraphicsContext($g_hBitmap) ;get the graphics context of the image / bitmap to draw on image / bitmap
    _GDIPlus_GraphicsSetSmoothingMode($g_hGfxCtxt, $GDIP_SMOOTHINGMODE_HIGHQUALITY) ;sets the graphics object rendering quality (antialiasing)
    _GDIPlus_GraphicsClear($g_hGfxCtxt)
    For $i = -20 to -500 step -10
            _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImageBg, 0, 0) ; Draw to buffer (background global va)
      _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImage_resized, $i, 0) ; Draw to buffer
          _GDIPlus_GraphicsDrawImage($g_hGfx, $g_hBitmap, 0, 0) ; draw to GUI
Next
;slowdown
For $i = -500 to -580 step -1
            _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImageBg, 0, 0) ; Draw to buffer
      _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImage_resized, $i, 0) ; Draw to buffer
          _GDIPlus_GraphicsDrawImage($g_hGfx, $g_hBitmap, 0, 0) ; draw to GUI
Next
    
 GUIDelete($mGUI)
$mGUI = GUICreate("",800, 590,100,120, $WS_POPUP, $WS_EX_LAYERED+$WS_EX_TOOLWINDOW)
GUISetBkColor(0xabcdef)
    _WinAPI_SetLayeredWindowAttributes($mGUI,0xabcdef)
GUISetState(@SW_SHOW)
  $g_hGfx = _GDIPlus_GraphicsCreateFromHWND($mGUI) ;create a graphics object from a window handle
  $g_hBitmap = _GDIPlus_BitmapCreateFromGraphics(800, 590, $g_hGfx) ;create a Bitmap object based on a graphics object
    $g_hGfxCtxt = _GDIPlus_ImageGetGraphicsContext($g_hBitmap) ;get the graphics context of the image / bitmap to draw on image / bitmap
    _GDIPlus_GraphicsSetSmoothingMode($g_hGfxCtxt, $GDIP_SMOOTHINGMODE_HIGHQUALITY) ;sets the graphics object rendering quality (antialiasing)
    _GDIPlus_GraphicsClear($g_hGfxCtxt,0xabcdef)
_GDIPlus_GraphicsClear($g_hBitmap,0xabcdef)
    
      _GDIPlus_GraphicsDrawImage($g_hGfxCtxt, $hImage_resized, 20, 0) ; Draw to buffer
      _GDIPlus_GraphicsDrawImage($g_hGfx, $g_hBitmap, 0, 0) ; draw to GUI
    EndFunc

[Acce]

@caramen Thanks for your suggestion , what you  have suggested is actually what I have done , However loading the image on this transparent GUI proved to be difficult as I need to clear the old image when loading a new in the for loop. I solved this by using screent capture. But I was hoping to end up with a GUI in the end with just the start image 

[KaFu]

Here some code ripped from AMT's drag&drop sink GUI.

 

expandcollapse popup

#include <GDIPlus.au3>
#include <GUIConstantsEx.au3>
#include <WinAPI.au3>
#include <WindowsConstants.au3>

$h_GUI_AMT_DragDrop = GUICreate('AMT Drag & Drop Interface', 64, 64, 100, 100, $WS_POPUP, BitOR($WS_EX_ACCEPTFILES, $WS_EX_LAYERED, $WS_EX_TOOLWINDOW, $WS_EX_TOPMOST))
GUICtrlCreateLabel("", 0, 0, 64, 64, Default, $GUI_WS_EX_PARENTDRAG)
GUICtrlSetTip(-1, "Drag & Drop movie files or whole" & @CRLF & "folders here to process with AMT", "AMT Drag & Drop Interface", 1)
GUICtrlSetBkColor(-1, $GUI_BKCOLOR_TRANSPARENT)
GUICtrlSetCursor(-1, 9)

_GDIPlus_Startup()
$hImage = _GDIPlus_ImageLoadFromFile(@ScriptDir & "\pause.png")
$hBitmap = _GDIPlus_BitmapCreateHBITMAPFromBitmap($hImage)
_SetBitmap($h_GUI_AMT_DragDrop, $hBitmap, 255)
_GDIPlus_ImageDispose($hImage)

GUIRegisterMsg($WM_NCHITTEST, "WM_NCHITTEST")
GUISetState()

Local $idMsg = 0
While 1
    $idMsg = GUIGetMsg()
    Select
        Case $idMsg = $GUI_EVENT_CLOSE
    EndSelect
WEnd

_WinAPI_DeleteObject($hBitmap)

Func WM_NCHITTEST($hWnd, $iMsg, $wParam, $lParam)
    Switch $hWnd
        Case $h_GUI_AMT_DragDrop
            Return $HTCAPTION
    EndSwitch
    Return $GUI_RUNDEFMSG
EndFunc   ;==>WM_NCHITTEST

Func _SetBitmap($hWnd, $hBitmap, $iOpacity)
    Local $hDC, $hMemDC, $tBlend, $tSIZE, $tSource
    $hDC = _WinAPI_GetDC($hWnd)
    $hMemDC = _WinAPI_CreateCompatibleDC($hDC)
    _WinAPI_SelectObject($hMemDC, $hBitmap)
    $tSIZE = _WinAPI_GetBitmapDimension($hBitmap)
    $tSource = DllStructCreate($tagPOINT)
    $tBlend = DllStructCreate($tagBLENDFUNCTION)
    DllStructSetData($tBlend, 'Alpha', $iOpacity)
    DllStructSetData($tBlend, 'Format', 1)
    _WinAPI_UpdateLayeredWindow($hWnd, $hDC, 0, DllStructGetPtr($tSIZE), $hMemDC, DllStructGetPtr($tSource), 0, DllStructGetPtr($tBlend), $ULW_ALPHA)
    _WinAPI_ReleaseDC($hWnd, $hDC)
    _WinAPI_DeleteDC($hMemDC)
EndFunc   ;==>_SetBitmap

 

[Acce]

Hi thanks for that snippet , might be able to use some of that , the png gets displayed correctly ,  Not sure why my version have a border around the edges ..  Can I ask excactly what part of the code that hides the gui and only shows the image ? 

Edited October 3, 2020 by Acce

[Acce]

Have tried a few different things now , and seams like its the back color that dosent gets cleared completely, resulting in a 1px border around the image 

GUISetBkColor(0xabcdef)

_WinAPI_SetLayeredWindowAttributes($mGUI,0xabcdef)

 

Cause its the color 0xabcdef that can be seen around the image as a small border .