OSX Dock style menu - BlitzCoder.net

-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0\|731\|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
Socoder -> Blitz -> OSX Dock style menu
Tue, 27 Oct 2009, 03:56
spinal	I thought I would post this, as I have a habit of loosing code that I end up needing in the future. What we have here, is an example of icon movement used in the osx shortcut dock, if anyone remembers, I used this methot in both DSision and DSision2. I hope someone finds it useful. ; OSX style dock menu, using tutorial at - ; https://www.flashkit.com/tutorials/Interactivity/Navigation/Mac_OS_X-Aaron_Ha-722/index.php AppTitle "Dock Menu" Graphics 850,200,0,2 ;picture = CreateImage(36,36) ;SetBuffer ImageBuffer(picture) ;Rect 0,0,35,35,0 ;SetBuffer FrontBuffer() picture = LoadImage("cover.bmp") ScaleImage picture, 0.28125, 0.28125 ; my cover.bmp is 128x128 so i resize it to about 36x36 Dim iconX(10) Dim iconOffset(10) Dim iconScale#(10) For t=0 To 9 iconX(t) = 200 + 50t DrawBlock picture,iconX(t),50 Next SetBuffer BackBuffer() While Not KeyHit(1) Delay 2 Cls mx = MouseX() my = MouseY() For t=0 To 9 iconOffset(t) = mx-(200 + 50t) iconOffset(t) = checkOffset(iconOffset(t)) iconScale(t) = setScale(iconOffset(t)) scalePicture = CopyImage(picture) ScaleImage scalePicture, iconScale(t), iconScale(t) If mx>150 And mx<700 And my > 100 Then DrawBlock scalePicture,iconX(t)-iconOffset(t) -(ImageWidth(scalePicture)/2), 200-ImageHeight(scalePicture) Else DrawBlock Picture,iconX(t) -(ImageWidth(Picture)/2), 200-ImageHeight(Picture) End If Next Flip VWait() Wend WaitKey() End Function checkOffset(coffset) If (coffset<-175) coffset = -175 If (coffset>175) coffset = 175 Return coffset End Function Function setScale#(soffset#) Return (3-(2*(Abs(soffset)/175))) End Function --v -=-=- Check out my excellent homepage!
Mon, 02 Nov 2009, 07:13
TazzMan47	Thanks for sharing this code. I believe this will be very handy. -=-=- Are You Rapture Ready?
Mon, 27 Jan 2025, 04:57
spinal	Trying to do this in 3d... How on earth do you get a sprite to be 100% scale when rendered? Graphics3D 850, 400, 32, 2 texture = LoadTexture("cover.bmp") ; 128x128 image ; Get the texture resolution TextureWidth# = TextureWidth(texture) TextureHeight# = TextureHeight(texture) ; Create a sprite and apply the texture sprite = CreateSprite() EntityTexture sprite, texture ; Set the position of the sprite PositionEntity sprite, 0, 0, 0 ; Centered in the 3D world ; Create a camera to view the sprite camera = CreateCamera() CameraClsColor camera, 255, 255, 255 MoveEntity camera, 0, 0, -Float(TextureWidth / 20.0) ; <- this cant be right surely!? ; Adjust the camera distance While Not KeyHit(1) UpdateWorld RenderWorld Flip VWait() Wend WaitKey() End --v -=-=- Check out my excellent homepage!
Mon, 27 Jan 2025, 05:05
Jayenkai	Can you switch to Orthogonal view? That'll be slightly easier. But you have a myriad of issues, like distance from lens, graphics resolution scaling on DirectX's side, graphics resolution scaling on Windows' side, and a whole lot of other bits and pieces. Orthogonal projection will stop things getting bigger/smaller when further away, which should help trying to get things a bit more exact. (16 years?!!) -=-=- ''Load, Next List!''
Mon, 27 Jan 2025, 06:47
spinal	Loads a 128x128 image, displays it in the centre of the screen. It turns out that the sacle of the sprites are directly related to the width of the window, no wonder I couldn't scale it properly. Anyway, this example changes the window size with spacebar and recaculates the icon size from the new window width. Graphics3D 800, 600, 32, 2 Global screenWidth = 800 Global screenHeight = 600 Global iconSize# = 128.0 Global iconScale# = iconSize / screenWidth ; Create camera camera = CreateCamera() MoveEntity camera, 0, 0, -10 ; Move camera back along the Z-axis CameraProjMode camera, 2 ; Set camera to orthogonal projection mode ; Load and position the image image = LoadTexture("cover.bmp") sprite = CreateSprite(0) EntityTexture sprite, image PositionEntity sprite, 0, 0, 0 ScaleSprite sprite, iconScale, iconScale While Not KeyHit(1) ; Check if spacebar is pressed If KeyHit(57) ; Toggle window size If screenWidth = 800 screenWidth = 1024 screenHeight = 768 Else screenWidth = 800 screenHeight = 600 End If ; Reinitialize graphics mode with new dimensions Graphics3D screenWidth, screenHeight, 32, 2 image = LoadTexture("cover.bmp") sprite = CreateSprite(0) EntityTexture sprite, image PositionEntity sprite, 0, 0, 0 iconScale# = iconSize / screenWidth ScaleSprite sprite, iconScale, iconScale ; Re-create camera camera = CreateCamera() MoveEntity camera, 0, 0, -10 ; Move camera back along the Z-axis CameraProjMode camera, 2 ; Set camera to orthogonal projection mode ; Re-position the image PositionEntity sprite, 0, 0, 0 End If RenderWorld Flip Wend End --v -=-=- Check out my excellent homepage!
Mon, 27 Jan 2025, 13:51
spinal	Got the mouse pointer moving correctly, but then I realised, I can't make a transparent window in Blitz3D. I'll be giving up on this then. Graphics3D 800, 600, 32, 2 Global screenWidth = 800 Global screenHeight = 600 Global iconSize# = 128.0 Global iconScale# = iconSize / screenWidth Const tex_color = 1 ; Color texture Const tex_alpha = 2 ; Alpha texture (Include alpha channel data) Const tex_mask = 4 ; Masked texture (black is transparent) Const tex_mipmap = 8 ; Create texture mipmaps Const tex_clampu = 16 ; Restrict U texture coords from "bleeding over" Const tex_clampv = 32 ; Restrict V texture coords from "bleeding over" Const tex_envshpere = 64 ; Load texture as a spherical environment map Const tex_vram = 256 ; Force texture graphics to vram Const tex_highcolor = 512 ; Forces texture graphics to be 32-bits per pixel Const tex_mipmap_OFF = 1024 ; Turn mipmap OFF ; Calculate aspect ratio Global aspectRatio# = Float(screenWidth) / Float(screenHeight) ; Create camera camera = CreateCamera() MoveEntity camera, 0, 0, -10 ; Move camera back along the Z-axis CameraProjMode camera, 2 ; Set camera to orthogonal projection mode ; Load and position the icon image = LoadTexture("cover.bmp") sprite = CreateSprite(0) EntityTexture sprite, image PositionEntity sprite, 0, 0, 0 ScaleSprite sprite, iconScale, iconScale ; Load mouse pointer image mouseImage = LoadTexture("mouse_pointer.bmp") mouseSprite = CreateSprite(0) EntityTexture mouseSprite, mouseImage ScaleSprite mouseSprite, iconScale, iconScale Global opx Global opy While Not KeyHit(1) PX = MouseX() py = MouseY() ; Check if spacebar is pressed If KeyHit(57) ; Toggle window size If screenWidth = 800 screenWidth = 1024 screenHeight = 768 Else screenWidth = 800 screenHeight = 800 End If ; Reinitialize graphics mode with new dimensions Graphics3D screenWidth, screenHeight, 32, 2 image = LoadTexture("cover.bmp", tex_color Or tex_mipmap_OFF) sprite = CreateSprite(0) EntityTexture sprite, image iconScale# = iconSize / screenWidth ScaleSprite sprite, iconScale, iconScale ; Re-create camera camera = CreateCamera() MoveEntity camera, 0, 0, -10 ; Move camera back along the Z-axis CameraProjMode camera, 2 ; Set camera to orthogonal projection mode ; Re-load mouse pointer image mouseImage = LoadTexture("mouse_pointer.png", tex_color Or tex_alpha Or tex_mipmap_OFF) ; Make sure your image has an alpha channel and is saved as PNG mouseSprite = CreateSprite(0) EntityTexture mouseSprite, mouseImage ScaleSprite mouseSprite, iconScale, iconScale ; Recalculate aspect ratio aspectRatio# = Float(screenWidth) / Float(screenHeight) End If ; Update mouse pointer position tempX# = 2.0 / Float(screenWidth) mx# = (PX * tempX) - 1 tempY# = 2.0 / (Float(screenHeight) * aspectRatio#) my# = ((PY+((screenWidth-screenHeight)/2)) * tempY) - 1 PositionEntity mouseSprite, mx#, -my#, 0 ; Render the world and display the values of mx and aspect ratio RenderWorld Flip Wend End --v -=-=- Check out my excellent homepage!
Mon, 27 Jan 2025, 15:16
Jayenkai	D'oh! That's a shame, but it's probably a good idea to stop here, before spending FAR too long on the project! I honestly can't think of what else you could use, or at least, nothing that'll be easy to work with! -=-=- ''Load, Next List!''
Mon, 27 Jan 2025, 15:56
spinal	Turns out, if you ask copilot enough over a couple of hours, you can get quite close in python... import tkinter as tk from PIL import Image, ImageTk # Constants ICON_SIZE = 40 MAX_SIZE = 128 MOUSE_RANGE = 175 SCALE_MAX = MAX_SIZE / ICON_SIZE SCALE_MIN = 1.0 ICONS_COUNT = 10 INITIAL_GAP = 10 # Initial gap between icons class DockApp: def __init__(self, root): self.root = root self.root.title("OSX Style Dock") self.root.configure(bg='black') self.root.overrideredirect(True) # Remove window border # Set window transparency and transparent color self.root.attributes('-transparentcolor', 'black') self.canvas = tk.Canvas(self.root, bg='black', highlightthickness=0) self.canvas.pack(fill=tk.BOTH, expand=True) # Load the original image self.original_picture = Image.open("cover.bmp") self.icons = [None] * ICONS_COUNT # Placeholder for ImageTk objects self.iconX = [200 + (ICON_SIZE + INITIAL_GAP) * t for t in range(ICONS_COUNT)] self.iconImages = [] for idx, x in enumerate(self.iconX): scalePicture = self.original_picture.resize((ICON_SIZE, ICON_SIZE), Image.LANCZOS) self.icons[idx] = ImageTk.PhotoImage(scalePicture) image = self.canvas.create_image(x, ICON_SIZE, image=self.icons[idx], anchor=tk.S) self.iconImages.append(image) self.canvas.tag_bind(image, "<Button-3>", self.on_right_click) self.canvas.bind("<Motion>", self.on_mouse_move) self.update_window_size() def on_right_click(self, event): self.root.destroy() def on_mouse_move(self, event): mx, my = event.x, event.y scales = [SCALE_MIN] * ICONS_COUNT totalWidth = 0 for t in range(ICONS_COUNT): iconOffset = mx - self.iconX[t] iconOffset = self.checkOffset(iconOffset) scales[t] = self.setScale(iconOffset) totalWidth += int(ICON_SIZE * scales[t]) + INITIAL_GAP totalWidth -= INITIAL_GAP leftMargin = (self.root.winfo_width() - totalWidth) // 2 maxIconHeight = 0 for idx in range(ICONS_COUNT): iconScale = scales[idx] scalePicture = self.original_picture.resize((int(ICON_SIZE * iconScale), int(ICON_SIZE * iconScale)), Image.LANCZOS) self.icons[idx] = ImageTk.PhotoImage(scalePicture) if idx == 0: newX = leftMargin + (int(ICON_SIZE * scales[0]) // 2) else: newX = leftMargin + sum(int(ICON_SIZE * scales[i]) + INITIAL_GAP for i in range(idx)) + (int(ICON_SIZE * scales[idx]) // 2) self.canvas.itemconfig(self.iconImages[idx], image=self.icons[idx]) self.canvas.coords(self.iconImages[idx], newX, self.root.winfo_height()) maxIconHeight = max(maxIconHeight, int(ICON_SIZE * iconScale)) self.update_window_size(totalWidth, maxIconHeight) def update_window_size(self, width=None, height=None): if width is None: width = sum(self.canvas.bbox(img)[2] - self.canvas.bbox(img)[0] + INITIAL_GAP for img in self.iconImages if self.canvas.bbox(img) is not None) - INITIAL_GAP if height is None: height = max(self.canvas.bbox(img)[3] - self.canvas.bbox(img)[1] for img in self.iconImages if self.canvas.bbox(img) is not None) screen_width = self.root.winfo_screenwidth() screen_height = self.root.winfo_screenheight() x_cordinate = int((screen_width / 2) - (width / 2)) y_cordinate = screen_height - height self.root.geometry(f"{width}x{height}+{x_cordinate}+{y_cordinate}") def checkOffset(self, coffset): if coffset < -MOUSE_RANGE: coffset = -MOUSE_RANGE if coffset > MOUSE_RANGE: coffset = MOUSE_RANGE return coffset def setScale(self, soffset): return SCALE_MAX - (2 * (abs(soffset) / MOUSE_RANGE)) if __name__ == "__main__": root = tk.Tk() app = DockApp(root) root.mainloop() --v -=-=- Check out my excellent homepage!