How to draw a "speech bubble" above NSWindow? - objective-c

Notice this app:
How can I draw that sort of triangle above an existing NSWindow? I know the app in question probably draws the whole thing as a custom window, but I want to keep the existing title bar. Is there any way to draw a triangle and attach it above a NSWindow? Please note that the solution has to be MAS-compatible (i.e. no private frameworks or classes).

The only way to do this would be to create a borderless child window with no shadow that overlays the edge of the existing window. You'd need to draw any shadow yourself.

A more comprehensive solution would involve subclassing NSThemeFrame and doing some custom drawing. Take a look at Matt Gallagher's Drawing a custom window on Mac OS X. It contains a wealth of helpful information, and Google will also be of great help here.

I've written an open source (BSD) framework that draws windows similar to this: https://github.com/sbooth/SFBPopovers
It won't directly do what you need but will illustrate the basics of drawing custom window frames.

Related

How to make a custom trackball / eyeball control with Cocoa?

I'm writing my first Cocoa app and I would like to make a "trackball / eyeball / arcball / whatever it's called" button to rotate a 3D OpenGL scene.
There's a perfect example of this custom Cocoa control in Pages (Apple iWork suite) when you select a 3D chart. After some hacks, this control seems to be referenced as SFC3DRotateWidget. Here's a screenshot of the control in Pages.
Maybe this widget is reusable, but I didn't find how or where. So I try to recreate it.
I'm inexperienced with Cocoa so I'm not sure how to do that nor exactly where (i.e. what to do with Interface Builder, what to do with code...).
I'm not sure if I need to override the drawing function. I thought to use a textured button (Interface Builder) with a NSTrackingArea (code) to handle mouse events (move, drag, ...) but the area is necessarily rectangular. The interactive zones of the custom control used by Apple seem to follow the shape of the arrows. I've read on S.O. I can use NSBezierPath to create a more specific area (only via code?).
Does it sound good for you?
Do I miss something?
Let met know if you have any tips, tricks or resources you can share!
Thanks!
It sounds like you want to build a custom control. You do this by subclassing NSControl, which there is a guide on how to do. You can control the circular clickable area, and the responses to the mouse events by implementing the various methods. For example you can track mouse events with mouseDown: and the related methods.
You probably do not need to use any custom drawing code, NSImageView subviews with the various arrows will probably suite your purposes fine, unless you'd rather draw them in code.

How should I design displaying a dynamic map? (Coordinates + Lines)

So I want to have a view (NSView, NSOpenGLView, something CG related?) which basically displays a map. Such as:
http://dump.tanaris4.com/map.png
Obviously that looks horrible, but I did it using an NSView, and it draws SO slow. Clearly not designed for this.
I just need to allow users to click on the individual (x,y) coordinates to make changes, and zoom into a certain area (to see it better).
Should I go the OpenGL route? And if so - any suggestions as to how to get started? (I was able to follow the guide to draw a triangle, so that's good).
I did find this post on zooming in an NSView: How to implement zoom/scale in a Cocoa AppKit-application
My concern is if I'm drawing over 6000 coordinates and the lines connecting them, this isn't efficient at all.
I don't think using OpenGL would be of any good here. The problem does not seem to be the actual painting, but rather the rendering strategy. You would need a scene graph of some kind to dynamically handle level of detail and culling.
Qt has all this packaged in a nice class class QGraphicsScene (see http://doc.qt.nokia.com/latest/qgraphicsscene.html for reference, and http://doc.qt.nokia.com/main-snapshot/demos-chip.html for an example).
Some basic concepts you should consider using:
http://en.wikipedia.org/wiki/Scene_graph
http://en.wikipedia.org/wiki/Quadtree
http://en.wikipedia.org/wiki/Level_of_detail
Try using core graphics for this, really there is so much that could be done. Watch the video Practical Drawing for iOS Developers from WWDC 2011 and it should give an over view of what can be done with CG.
I believe even CoreGraphics will suffice for what you want to achieve, and that should work under a UIView if you draw the rectangle of your view completely under the DrawRect method of your UIView (you must overload this method). Please see the UIView Class Reference. I have a mobile application that logs points on the UIMapKit, kind of like Nike+, and it certainly works well for massive amounts of points/line segments. There is no reason why this simple approach cannot work for you as well.

Using an image as the window in cocoa

I'm trying to figure out how to use an image as my window frame. I've been looking at creating custom windows, but it talks about drawing a custom shape rather than using an existing image.
I want to make a window like this:
Checkout the TunesWindow example by Matt Gemmell:
http://mattgemmell.com/files/source/tuneswindow.tgz
It uses separate images for the borders, corners and center.
Also checkout MAAttachedWindow by Matt Gemmel:
http://mattgemmell.com/files/source/maattachedwindow.zip
Panel similar to the one shown in your question.

Xcode4 "Build Finished" HUD

I'm searching for a library which implements something like Xcode 4's HUD which displays when a build is finished and such things.
Can someone give me a link or some hints how to implement it?
To clarify it, I'm searching for something like MBProgressHUD
Please don't suggest Growl, it's not appropriate for my utilisation.
To clarify it: I'm searching for a Mac OS X (Cocoa/Quartz) library, not for iOS.
I don't know of any libraries, but it would be fairly straightforward to do it yourself. Create a borderless, non-opaque, floating window and set your own custom NSView subclass as its content view.
You can then use Cocoa's excellent drawing classes to draw the thing. For example [NSBezierPath bezierPathWithRoundedRect] will make a rounded rectangle very easily, then you can fill it with a transparent grey and composite some text and an image with shadows and so on, in a few lines of code.
It's a bit of work, but maybe not as much as you might think.
ATMHud may fit your needs (source).

Cocoa: How to morph a drag image while dragging

In Interface Builder.app (and some other cocoa apps), image dragging has a very nice/sexy effect of morphing the drag image while you drag a draggable item out of its window.
For example in Interface Buildler.app:
Show the Library Palette (⇧⌘L, or Tools Menu -> Library)
Drag an item out of the Library palette
NOTE: as you drag the item out of the Library Palette window, it morphs from an image of the original list item to an image of the icon of the dragged item.
I have fully implemented drag and drop in my Application using the normal Cocoa NSDragSource/NSDragDestination facilities.
However, I can't find a hook for doing this image morph while dragging. I'm returning the initial drag image by overriding
-[NSView dragImage:at:offset:event:pasteboard:source:slideBack:]
But this is only called at the beginning of the drag.
How do you signal that you would like to replace the current drag image (ideally using the sexy morph effect).
You guys beat me to it. :-)
Yes, JLNDragEffectManager is open source (with attribution in your apps, please) and available on my blog. It should work fine as-is with no modification back to 10.5, but I'm not sure back any further. Others linked to it (and it's easily googleable), so to avoid self-congratulatory blog linking, I'll leave it at that.
Issues: One developer commented on (and submitted code to fix) the lack of dragging offset support. I've just not gotten around to posting the update. That's the only outstanding issue I'm aware of.
Improvements: I'd like to add multiple "zones" (say, one per document, so dragging from doc to doc keeps table rows looking like table rows, but anywhere outside doc windows turns them into a file icon a la HFS Promise Drag). Some day ...
Design: The post itself details the reasoning behind the design and the relatively simple morphing effect (cross-fade plus size are animated using basic NSAnimation, etc.). The code (the class as well as the demo app) is thoroughly blocked out and commented.
Won't link to my own post but would love the karma of upvotes for my effort. ;-)
UPDATE: Similar (but better-integrated) functionality is available as of 10.7. If you are targeting 10.7 or higher, it's best to use the new API. JLNDragEffectManager works fine on 10.7, so it can be used for earlier-targeted versions.
JNLDragEffectManager does exactly that. :)
The API does not support this well. Joshua Nozzi gives a method that looks reasonable in this weblog post.
IB's effect isn't that fancy. It's a crossfade and scale. Hold down shift to see it more clearly.
As of 10.7+ the current approach is to use the
enumerateDraggingItemsWithOptions:
forView:
classes:
searchOptions:
usingBlock:
API on NSDraggingInfo. The documentation is really poor but the ADC samples like MultiPhotoFrame or TableViewPlayground can give a good idea on how to use the new mechanism.