Draggable image on transparent window

[Fangbeast]

I want to make a little draggable image on a transparent window. Idea being to drag and drop files on it (Like a download manager's drop target) for whatever I might need later (catalogues, print jobs, listers, anything).

Anyone have a simple example of that? I already have an 80x80x256 colour image with a transparent background to put on it.

Regards.

[netmaestro]

It's not transparent, but it's a drop target for files, dunno if it's doing anything you're interested in or not:

http://www.purebasic.fr/english/viewtopic.php?t=26376

[Fangbeast]

No, wanted it more like FlashGet which is a draggable image on a borderless window so it looks as if you are dragging the image itself without a window. Most download managers do this.

I had the borderless window doen and an image in it, just couldn't make the window transparent and couldn't drag it.

Found this sample code in the forums (adapted to my image dimensions) and still couldn't drag it so I don't know.

It's not important but would be fun to do. Had a few ideas for using it.

Case #WM_LBUTTONDOWN
If WindowMouseX(#Window_dragger) < 80 And WindowMouseY(#Window_dragger) < 0
SendMessage_(WindowID(#Window_dragger), #WM_NCLBUTTONDOWN, #HTCAPTION, 0)
EndIf

[Trond]

Oh, you wanted a translucent draggable window with an image, not a draggable image on a transparent window. That's easy:

Code: Select all

OpenWindow(0, 250, 250, 512, 384, "", #PB_Window_BorderLess | #PB_Window_Invisible)
CreateGadgetList(WindowID(0))
SetWindowLong_(WindowID(0), #GWL_EXSTYLE, GetWindowLong_(WindowID(0), #GWL_EXSTYLE) | #WS_EX_LAYERED) 
LoadImage(0, "c:\map.bmp")
hDC = StartDrawing(ImageOutput(0))
  ContextOffset.POINT
  BlendMode.BLENDFUNCTION
  GetObject_(ImageID(Image), SizeOf(BITMAP), @BitmapInfo.BITMAP)
  BlendMode\SourceConstantAlpha = 128
  BlendMode\AlphaFormat = 0
  UpdateLayeredWindow_(WindowID(0), 0, 0, @BitmapInfo+4, hDC, @ContextOffset, 0, @BlendMode, 2)
StopDrawing()
HideWindow(0, 0)
StickyWindow(0, 1)

Repeat
  Select WaitWindowEvent()
    Case #PB_Event_CloseWindow
      Break
    Case #WM_LBUTTONDOWN
      SendMessage_(WindowID(0), #WM_NCLBUTTONDOWN, #HTCAPTION, 0)
  EndSelect
ForEver

[Fangbeast]

That's a pretty nifty demo and I have 2 questions:

1 How do you close the window? Couldn't find any obvious way to do it.

2. Can this drawn on image still be a drop target using PB drag and drop commands (as I cannot see how it would work with this method?)

[srod]

I'll give the mighty Trond a well deserved break! (Nice example by the way. )

1. Closing this window would be built into your application fangles. You'd probably have a main window open with a close button etc. Although, I'd imagine you'd want to close the window as soon as the drag was complete as with the following:

Code: Select all

#ULW_ALPHA = $2
OpenWindow(0, 250, 250, 512, 384, "", #PB_Window_BorderLess | #PB_Window_Invisible) 
CreateGadgetList(WindowID(0)) 
SetWindowLong_(WindowID(0), #GWL_EXSTYLE, GetWindowLong_(WindowID(0), #GWL_EXSTYLE) | #WS_EX_LAYERED) 
LoadImage(0, "bm1.bmp") 
hDC = StartDrawing(ImageOutput(0)) 
  ContextOffset.POINT 
  BlendMode.BLENDFUNCTION 
  GetObject_(ImageID(Image), SizeOf(BITMAP), @BitmapInfo.BITMAP) 
  BlendMode\SourceConstantAlpha = 128 
  BlendMode\AlphaFormat = 0 
  UpdateLayeredWindow_(WindowID(0), 0, 0, @BitmapInfo+4, hDC, @ContextOffset, 0, @BlendMode, #ULW_ALPHA) 
StopDrawing() 
HideWindow(0, 0) 
StickyWindow(0, 1) 

Repeat 
  Select WaitWindowEvent() 
    Case #PB_Event_CloseWindow 
      Break 
    Case #WM_LBUTTONDOWN 
      If IsWindow(0)
        SendMessage_(WindowID(0), #WM_NCLBUTTONDOWN, #HTCAPTION, 0) 
        CloseWindow(0)
        break
      EndIf    
  EndSelect 
ForEver 

2. The drag image is actually a window, so yes you should be able to use it as a drop target with EnableWindowDrop() etc. Not really sure why you'd want to, but oh well!

[Trond]

Just add this in the event loop and you can close with the right mouse button. Of course you can always close it with Alt+F4.

Code: Select all

    Case #WM_RBUTTONUP
      CreatePopupMenu(0)
      MenuItem(0, "Close")
      DisplayPopupMenu(0, WindowID(0))
    Case #PB_Event_Menu
      Break

[netmaestro]

Also fellows, don't forget to toss in #WS_EX_TOOLWINDOW along with the layered exstyle as it keeps the icon off the taskbar, which is appropriate for this kind of thing imho.

[srod]

Good point, although in an application you'd probably make the layered window a child of a top most window anyhow.

[netmaestro]

probably make the layered window a child of a top most window anyhow

No, you can't do that. WS_CHILD and WS_EX_LAYERED are mutually exclusive, more's the pity. Many's the time I wished it were otherwise.

[Fangbeast]

And wizards popup to confound me!

1. Closing this window would be built into your application fangles. You'd probably have a main window open with a close button etc. Although, I'd imagine you'd want to close the window as soon as the drag was complete as with the following:

No, i'd want the drop target visible and open continuously in most cases, if I was only using the drop target NOT ATTACHED to any other program.

2. The drag image is actually a window, so yes you should be able to use it as a drop target with EnableWindowDrop() etc. Not really sure why you'd want to, but oh well!

[/quote]

You've never seen FlashGet or most internet download managers? They are a floating little graphic (usually an inch square or perhaps less) with a transpaent background and they are the targets of drag and drop operations so that the main program window can be hidden and not take up screen real-estate when you don't need the entire form occluding the screen.

I had in mind something similar but not for a download manager, something else.

[Fangbeast]

Just add this in the event loop and you can close with the right mouse button. Of course you can always close it with Alt+F4.

Code: Select all

    Case #WM_RBUTTONUP
      CreatePopupMenu(0)
      MenuItem(0, "Close")
      DisplayPopupMenu(0, WindowID(0))
    Case #PB_Event_Menu
      Break

Thank you, I had not thought of that.

[srod]

probably make the layered window a child of a top most window anyhow

No, you can't do that. WS_CHILD and WS_EX_LAYERED are mutually exclusive, more's the pity. Many's the time I wished it were otherwise.

Huh, didn't know that! Actually I probably did but just misplaced that bit of memory somewhere!

[Fangbeast]

Ever since the new beta of pb came out and I mastered some very basic (okay, mistered, not mastered!!) some of the drag and drop, my tiny mind has been stewing over with some small ideas beyond my ability to implement by myself.

Whether on not constant fatigue, pain and depression will allow me to work much on it is another story entirely!!!!!

But, my 2 brain cells are percolating with some small and useful ideas (the other cells were stolen by pupil last year, who fed them to his goldfish)

Undoubtedly, someone will look at my junk and say, "why bother", it's too primitive", "go away", "I don't think so baby puppy", "your'e too ugly in that tutu" and worse but I usually write stuff the family needs (as no-one has given me any suggestions other than "bugger off idiot") and then add things if by some miracle I get asked to.

Thanks for all the ideas wizards, us peons are grateful beyond imagining but please don't raise the serf taxes, I have no more children to sell.

[Fangbeast]

Code: Select all

#ULW_ALPHA = $2
OpenWindow(0, 250, 250, 512, 384, "", #PB_Window_BorderLess | #PB_Window_Invisible) 
CreateGadgetList(WindowID(0)) 
SetWindowLong_(WindowID(0), #GWL_EXSTYLE, GetWindowLong_(WindowID(0), #GWL_EXSTYLE) | #WS_EX_LAYERED) 
LoadImage(0, "bm1.bmp") 
hDC = StartDrawing(ImageOutput(0)) 
  ContextOffset.POINT 
  BlendMode.BLENDFUNCTION 
  GetObject_(ImageID(Image), SizeOf(BITMAP), @BitmapInfo.BITMAP) 
  BlendMode\SourceConstantAlpha = 128 
  BlendMode\AlphaFormat = 0 
  UpdateLayeredWindow_(WindowID(0), 0, 0, @BitmapInfo+4, hDC, @ContextOffset, 0, @BlendMode, #ULW_ALPHA) 
StopDrawing() 
HideWindow(0, 0) 
StickyWindow(0, 1) 

Repeat 
  Select WaitWindowEvent() 
    Case #PB_Event_CloseWindow 
      Break 
    Case #WM_LBUTTONDOWN 
      If IsWindow(0)
        SendMessage_(WindowID(0), #WM_NCLBUTTONDOWN, #HTCAPTION, 0) 
        CloseWindow(0)
        break
      EndIf    
  EndSelect 
ForEver 

Is there any way to pick a colour on the image so as to turn the background transparent tot he window over which it is dragged?