Smart way to get "etched" borders in Leopard

  • Can someone tell me what the smart way to get etched (not sure if that's
    the right term) borders for a Leopard only app. My app will used a
    Textured Window, and I want to have borders that look like the borders in
    iChat at the top and bottom of the scroll view.

    Do I still need to do a custom subclass of NSBox for that sort of
    behavior? Or is there some way to configure existing classes to draw like
    that? Thanks for any pointers.
  • On Nov 4, 2007, at 9:33 AM, <jesse...> wrote:

    > Can someone tell me what the smart way to get etched (not sure if
    > that's
    > the right term) borders for a Leopard only app. My app will used a
    > Textured Window, and I want to have borders that look like the
    > borders in
    > iChat at the top and bottom of the scroll view.

    Like in the bottom bar of Address Book, too?

    This is documented in the Application Kit Release Notes (10.5) under
    "Text and image effects: -[NSCell backgroundStyle]":

    > For example, if you place an borderless NSTextField directly on the
    > window surface you will likely want to have a controller call
    > setBackgroundStyle:NSBackgroundStyleRaised on the text cell to get
    > engraved text.

    Hope this helps!

      -- Chris
  • On 05/11/2007, at 3:33 AM, <jesse...> wrote:

    > Can someone tell me what the smart way to get etched (not sure if
    > that's
    > the right term) borders for a Leopard only app. My app will used a
    > Textured Window, and I want to have borders that look like the
    > borders in
    > iChat at the top and bottom of the scroll view.

    I know you can do this with non-textured windows by calling:

    [self setContentBorderThickness:<bottom border width>
    forEdge:NSMinYEdge];

    in the -initWithContentRect:styleMask:backing:defer: method of an
    NSWindow subclass.

    This will give you a nice beveled bottom bar on the window.

    Since textured and non-textured windows are essentially the same in
    Leopard except for the dark gray background this may be an option for
    you.

    --
    Rob Keniger
  • Chris,

    Thanks for your response. I got busy and then was away, so I didn't
    have time to try things out until today. The good news is that
    [NSCell backgroundStyle] looks really useful, but unfortunately it
    doesn't do what I want in this case.

    I'll try to explain myself better this time. Here's a Leopard
    screenshot of the bottom of a safari window. You can see that right
    below the scroll view there are two lines that form a etching of some
    sort. From top to bottom, a dark (black?) line followed by a lighter
    line.

    http://hogbaysoftware.com/files/leapardscreen.png

    You see these lines all over the place in apples new iLife, iCal,
    etc. I've done these "etched" borders before by subclassing NSBox I
    think, but that seems pretty heavy weight. And I was always left
    guessing on the exact colors that I should use.

    So I'm wondering what the best way to achieve this effect in a
    Leopard only app is. Does anyone have suggestions?

    Thanks,
    Jesse

    On Nov 4, 2007, at 7:00 PM, Chris Hanson wrote:

    > On Nov 4, 2007, at 9:33 AM, <jesse...> wrote:
    >
    >> Can someone tell me what the smart way to get etched (not sure if
    >> that's
    >> the right term) borders for a Leopard only app. My app will used a
    >> Textured Window, and I want to have borders that look like the
    >> borders in
    >> iChat at the top and bottom of the scroll view.
    >
    > Like in the bottom bar of Address Book, too?
    >
    > This is documented in the Application Kit Release Notes (10.5)
    > under "Text and image effects: -[NSCell backgroundStyle]":
    >
    >> For example, if you place an borderless NSTextField directly on
    >> the window surface you will likely want to have a controller call
    >> setBackgroundStyle:NSBackgroundStyleRaised on the text cell to get
    >> engraved text.
    >
    > Hope this helps!
    >
    > -- Chris
    >
  • Hi Jesse,

    > You can see that right
    > below the scroll view there are two lines that form a etching of some
    > sort. From top to bottom, a dark (black?) line followed by a lighter
    > line.
    >
    > http://hogbaysoftware.com/files/leapardscreen.png

    Yes, there is something new here.  Take a look at -[NSWindow
    contentBorderThicknessForEdge:] and friends.

    http://developer.apple.com/releasenotes/Cocoa/AppKit.html#NSWindow

    -Ken
    Cocoa Frameworks
  • On Nov 8, 2007, at 5:00 PM, Ken Ferry wrote:

    > Hi Jesse,
    >
    >> You can see that right
    >> below the scroll view there are two lines that form a etching of some
    >> sort. From top to bottom, a dark (black?) line followed by a lighter
    >> line.
    >>
    >> http://hogbaysoftware.com/files/leapardscreen.png
    >
    > Yes, there is something new here.  Take a look at -[NSWindow
    > contentBorderThicknessForEdge:] and friends.
    >
    > http://developer.apple.com/releasenotes/Cocoa/AppKit.html#NSWindow
    >

    I'm trying to get that look in my main window too - and unfortunately
    nothing I've tried seems to work.

    The window is a textured window it has a large view under the content
    view which in turn contains some smaller views, a sibling to this view
    is a button, a progress bar and a text field. I have approx 20-30
    pixels of space above and below the large view (which contains the
    other sibling views).

    The large view has no 'etching' around it at all. Adding :

      [[self window] setAutorecalculatesContentBorderThickness:NO
    forEdge:NSMinYEdge | NSMaxYEdge];
      [[self window] setContentBorderThickness:10.0 forEdge:NSMinYEdge |
    NSMaxYEdge];        // Try 10.0 just to get an effect

    To my windowcontrollers awakeFromNib doesn't make any difference either.

    I don't see what else is needed from my reading of the Release notes.

    Any other pointers ?

    > -Ken
    > Cocoa Frameworks

    Andrew 8-)

    P.S. You can see a screenshot of the incorrect look at http://awkward.org/downloads/window_no_etching.png
  • I'm trying to get that look in my main window too - and unfortunately
    > nothing I've tried seems to work.
    >
    > The window is a textured window

    Yes, you won't see the separator in textured windows.  The bottom
    gradient goes in a different direction, and the separator isn't
    appropriate.  Here's the relevant paragraph from the release notes:

    "The behavior of -setContentBorderThickness:forEdge:NSMinYEdge and
    -setAutorecalculatesContentBorderThickness:NO forEdge:NSMinYEdge for
    non-textured windows will do the following: The top gradient will be
    repeated in the bottom border, separator lines will be drawn between
    the content and the bottom border, and the bottom corner will be
    rounded. Other methods on non-textured windows or unused edges will
    return 0.0 or YES."

    -Ken
    Cocoa Frameworks

    On Nov 9, 2007 1:42 PM, Andrew Kimpton <awk...> wrote:
    >
    >
    >
    > On Nov 8, 2007, at 5:00 PM, Ken Ferry wrote:
    > Hi Jesse,
    >
    > You can see that right
    > below the scroll view there are two lines that form a etching of some
    > sort. From top to bottom, a dark (black?) line followed by a lighter
    > line.
    >
    > http://hogbaysoftware.com/files/leapardscreen.png
    >
    > Yes, there is something new here.  Take a look at -[NSWindow
    > contentBorderThicknessForEdge:] and friends.
    >
    > http://developer.apple.com/releasenotes/Cocoa/AppKit.html#NSWindow
    >
    >
    > I'm trying to get that look in my main window too - and unfortunately
    > nothing I've tried seems to work.
    >
    > The window is a textured window it has a large view under the content view
    > which in turn contains some smaller views, a sibling to this view is a
    > button, a progress bar and a text field. I have approx 20-30 pixels of space
    > above and below the large view (which contains the other sibling views).
    >
    > The large view has no 'etching' around it at all. Adding :
    >
    >
    > [[self window] setAutorecalculatesContentBorderThickness:NO
    > forEdge:NSMinYEdge | NSMaxYEdge];
    > [[self window] setContentBorderThickness:10.0 forEdge:NSMinYEdge |
    > NSMaxYEdge]; // Try 10.0 just to get an effect
    >
    > To my windowcontrollers awakeFromNib doesn't make any difference either.
    >
    > I don't see what else is needed from my reading of the Release notes.
    >
    > Any other pointers ?
    >
    >
    > -Ken
    > Cocoa Frameworks
    >
    > Andrew 8-)
    >
    > P.S. You can see a screenshot of the incorrect look at
    > http://awkward.org/downloads/window_no_etching.png
    >
    >
    >
  • On Nov 9, 2007, at 8:10 PM, Ken Ferry wrote:

    > I'm trying to get that look in my main window too - and unfortunately
    >> nothing I've tried seems to work.
    >>
    >> The window is a textured window
    >
    > Yes, you won't see the separator in textured windows.  The bottom
    > gradient goes in a different direction, and the separator isn't
    > appropriate.  Here's the relevant paragraph from the release notes:
    >
    > "The behavior of -setContentBorderThickness:forEdge:NSMinYEdge and
    > -setAutorecalculatesContentBorderThickness:NO forEdge:NSMinYEdge for
    > non-textured windows will do the following: The top gradient will be
    > repeated in the bottom border, separator lines will be drawn between
    > the content and the bottom border, and the bottom corner will be
    > rounded. Other methods on non-textured windows or unused edges will
    > return 0.0 or YES."
    >

    OK - then I must be very confused by what this API is for ? If you
    look at the top and bottom of iPhoto you'll see a single pixel dark
    line (across the top) and a single pixel dark line with and additional
    single pixel gray line (bottom). The pictures at http://awkward.org/downloads/iPhoto_TopLeft.png
      and http://awkward.org/downloads/iPhoto_BottomRight.png show what I
    mean.

    Are those lines being produced because the bulk of the window
    (excluding the zoom control, segment control etc. at the bottom) is
    contained inside an NSBox ? How do you get an NSBox to produce a
    different appearance for top vs. bottom ? Isn't iPhoto using a
    Textured window ? Virtually every Leopard app (except mine 8-) has at
    least the black line seperating the top wide textured section
    (sometimes containing a tool bar sometimes not - look at IB) and the
    'content' area (list, table collection etc.)

    Thanks

    > -Ken
    > Cocoa Frameworks

    Andrew 8-)
  • Ken,

    We are probably driving you nuts with our stupidity, but I'm also
    still having a hard time getting this to work. For a textured window
    I the call setContentBorderThickness:forEdge: does seem to make a
    difference in the background, but as you say no black line is drawn
    in that case. But when I try
    setContentBorderThickness:forEdge:NSMinYEdge on a normal non textured
    window I don't see any change in it's appearance at all.

    Thanks again for your help, I'm sure the answer is sitting right
    there, I just can't seem to get it.

    Can someone walk me through how to make this work the really slow way :)

    Jesse

    On Nov 9, 2007, at 10:41 PM, Andrew Kimpton wrote:

    >
    > On Nov 9, 2007, at 8:10 PM, Ken Ferry wrote:
    >
    >> I'm trying to get that look in my main window too - and unfortunately
    >>> nothing I've tried seems to work.
    >>>
    >>> The window is a textured window
    >>
    >> Yes, you won't see the separator in textured windows.  The bottom
    >> gradient goes in a different direction, and the separator isn't
    >> appropriate.  Here's the relevant paragraph from the release notes:
    >>
    >> "The behavior of -setContentBorderThickness:forEdge:NSMinYEdge and
    >> -setAutorecalculatesContentBorderThickness:NO forEdge:NSMinYEdge for
    >> non-textured windows will do the following: The top gradient will be
    >> repeated in the bottom border, separator lines will be drawn between
    >> the content and the bottom border, and the bottom corner will be
    >> rounded. Other methods on non-textured windows or unused edges will
    >> return 0.0 or YES."
    >>
    >
    > OK - then I must be very confused by what this API is for ? If you
    > look at the top and bottom of iPhoto you'll see a single pixel dark
    > line (across the top) and a single pixel dark line with and
    > additional single pixel gray line (bottom). The pictures at http://
    > awkward.org/downloads/iPhoto_TopLeft.png and http://awkward.org/
    > downloads/iPhoto_BottomRight.png show what I mean.
    >
    > Are those lines being produced because the bulk of the window
    > (excluding the zoom control, segment control etc. at the bottom) is
    > contained inside an NSBox ? How do you get an NSBox to produce a
    > different appearance for top vs. bottom ? Isn't iPhoto using a
    > Textured window ? Virtually every Leopard app (except mine 8-) has
    > at least the black line seperating the top wide textured section
    > (sometimes containing a tool bar sometimes not - look at IB) and
    > the 'content' area (list, table collection etc.)
    >
    > Thanks
    >
    >> -Ken
    >> Cocoa Frameworks
    >
    > Andrew 8-)
  • On 10 Nov 2007, at 04:30, Jesse Grosjean wrote:

    > We are probably driving you nuts with our stupidity, but I'm also
    > still having a hard time getting this to work. For a textured window
    > I the call setContentBorderThickness:forEdge: does seem to make a
    > difference in the background, but as you say no black line is drawn
    > in that case. But when I try
    > setContentBorderThickness:forEdge:NSMinYEdge on a normal non
    > textured window I don't see any change in it's appearance at all.
    >
    > Thanks again for your help, I'm sure the answer is sitting right
    > there, I just can't seem to get it.
    >
    > Can someone walk me through how to make this work the really slow
    > way :)

    The way I understood and implemented it, you have place this call at
    the right moment. What I did is to create an NSWindow subclass and put
    the code in initWithContentRect:styleMask:backing:defer:

    E.g:

    @implementation MyNSWindowSubclass

    - (id)initWithContentRect:(NSRect)contentRect styleMask:
    (NSUInteger)windowStyle backing:(NSBackingStoreType)bufferingType
    defer:(BOOL)deferCreation
    {
    self = [super initWithContentRect:contentRect styleMask:windowStyle
    backing:bufferingType defer:deferCreation];

    if (self) {
      [self setContentBorderThickness:20.0 forEdge:NSMinYEdge];
    }

    return self;
    }

    @end

    The window is not textured.

    Good luck!

    -António

    --------------------------------------------
    I try to take one day at a time, but sometimes, several days attack me
    all at once!
    --------------------------------------------
  • Thanks that did it!

    Jesse

    On Nov 10, 2007, at 2:41 AM, Antonio Nunes wrote:

    > On 10 Nov 2007, at 04:30, Jesse Grosjean wrote:
    >
    >> We are probably driving you nuts with our stupidity, but I'm also
    >> still having a hard time getting this to work. For a textured
    >> window I the call setContentBorderThickness:forEdge: does seem to
    >> make a difference in the background, but as you say no black line
    >> is drawn in that case. But when I try
    >> setContentBorderThickness:forEdge:NSMinYEdge on a normal non
    >> textured window I don't see any change in it's appearance at all.
    >>
    >> Thanks again for your help, I'm sure the answer is sitting right
    >> there, I just can't seem to get it.
    >>
    >> Can someone walk me through how to make this work the really slow
    >> way :)
    >
    >
    > The way I understood and implemented it, you have place this call
    > at the right moment. What I did is to create an NSWindow subclass
    > and put the code in initWithContentRect:styleMask:backing:defer:
    >
    > E.g:
    >
    > @implementation MyNSWindowSubclass
    >
    > - (id)initWithContentRect:(NSRect)contentRect styleMask:(NSUInteger)
    > windowStyle backing:(NSBackingStoreType)bufferingType defer:(BOOL)
    > deferCreation
    > {
    > self = [super initWithContentRect:contentRect
    > styleMask:windowStyle backing:bufferingType defer:deferCreation];
    >
    > if (self) {
    > [self setContentBorderThickness:20.0 forEdge:NSMinYEdge];
    > }
    >
    > return self;
    > }
    >
    > @end
    >
    > The window is not textured.
    >
    > Good luck!
    >
    > -António
    >
    > --------------------------------------------
    > I try to take one day at a time, but sometimes, several days attack
    > me all at once!
    > --------------------------------------------
    >
    >
previous month november 2007 next month
MTWTFSS
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    
Go to today