Matt Legend Gemmell Modesty is Lying

Mac OS X Cocoa and iPhone Development Services available at Instinctive Code.
Favorites icon
Favorites for iPhone
Speed-dial with style.
Mac OS X Cocoa and iPhone Developer for hire

Other Pages

Categories

Posted
15 November 2005 @ 10pm

Categories
Development, Interface

Tags
, , ,

Library panel demo app

Work continues apace on the icon app; this time I’ve been working on the Library panel, which lets the user drag “icon elements” into the canvas area (if that makes no sense, here’s the window mockup I posted previously).

The Library panel looks like this:

Library Panel screenshot

The rows reflow as the panel is resized. Have a play with the demo app, but be aware that it’ll no doubt be flaky and slow to resize at the moment. Requires Tiger or later.

If you encounter any nasty bugs, or have any feedback on the control itself, post a comment below.


8 Comments

Chris Miller
15 November 2005 @ 10pm

Dude, nice work.

Although wouldn’t it be nicer to have the name of the element appear somewhere static so that you don’t get the overspill on the names (especially at the edges when the aligning doesn’t quite look right)? Perhaps at the top right of the panel, right aligned?


Matt
15 November 2005 @ 10pm

Hey dude,

I previously had the names appearing at the bottom left (i.e. left-aligned in the area they appear in now), and if the window was really wide it got quite hard to move the mouse over an item and then glance way over to the left to see what it was called. I’m just experimenting with moving the rollover text right now.

Regarding the alignment looking odd, it tries to center the text under the icon if it has room, but failing that it places it as near as possible, which results in it flowing to the right if you’re over the leftmost icon, and flowing to the left if you’re over the rightmost icon. Best compromise I could come up with without clipping the text.


Erich Kreutzer
15 November 2005 @ 11pm

That looks great, however, there seems to be a problem when resizing starting at a lower page. If the window is increased in size to hold all of the items and then decreased in size to hold a smaller number, the first page automatically appears instead of the last page that was being viewed(in this case the bottom page). I understand this case may not seem all that important, but, if a user increases the size a little too much and then decreases the size to compensate the behavior, to me, would seem incorrect.


kiro
15 November 2005 @ 11pm

Think we could have some source code?


Matt
16 November 2005 @ 12am

Hi Erich,

Well spotted. :) This is deliberate, since it mimics how the Finder behaves if you resize a window in Icon view which is set to “keep arranged by name”. If you try it, you’ll notice that the icons in the window reflow in the same way.

I’m not frankly sure which way is best, though I do see the basic argument for maintaining the row you were at when you started the resizing drag. I’m just not sure what the average user expects in that situation. Hmm.


Chris Miller
16 November 2005 @ 1am

Hey Matt,

I previously had the names appearing at the bottom left (i.e. left-aligned in the area they appear in now), and if the window was really wide it got quite hard to move the mouse over an item and then glance way over to the left to see what it was called. I’m just experimenting with moving the rollover text right now.

I was leaning towards the thinking that the panel you’d be displaying would be small (around 7 items as you’ve shown) with the ability to jump forward/back between any other entries. This’d mean you don’t have the direction between the name and icon so high.

It would then also follow the 7 +/- 2 items rule for presenting menu/list items, which may be a nice feature to hold. I’d assume you’d be able in your implementation (or it would at least be trivial to change) to limit the number of items displayed on one “line” of the panel, and thus you could create a panel with a maximum of say 7 items and the text would always remain within “glancing” distance.

Of course you could always create two versions which could be used for short (i.e. 7 items) with the name in the corner and a long version (i.e. >9-10 items) which would display the names as you currently have them.


Chris Miller
16 November 2005 @ 1am

Erm… direction should really read distance in that last comment I made.

I know you’ll probably update the original and delete this comment. Still, the panel is pretty cool, well done.

Keep it SHEERCORE!
(And on that note, when is the domain becoming active? And when is the next comic coming online? And I think we need to start thinking of names for our pub quiz team, I suggest: “Compsoc vs. SHEERCORE: the gut wrenching, comprehensive parody of Star Wars Episode 3: Revenge of the Sith (Vvvvuuummm!”)


Kevin Ballard
16 November 2005 @ 5am

That’s pretty slick! I will mention that it looks odd to go to the second pane and make it wider, because the wider you make it the fewer items are shown ;) But it makes sense.


Leave a Comment

Proxy drag bug Cocoa Source Code Page