If you're looking for my color schemes, they're not on this tutorial page.
Calyxa's Button Ring Tutorial

  Lots of scheme designers have a secret problem lurking in their default button rings, so that's where I'm going to start. Before this document gets too old, I should probably let you all know this information applies to Kaleidoscope 1.5.

  As of 11 April 97, I've added some information on alternate button shapes. Beginning to Change Shape shows some unique buttons from Richard Miske's scheme "DeKalb", and the Serious Shapeshifting section explores just how non-standard of a button shape can be made with Kaleidoscope.

 

The Two-State Button
  Your scheme is great, the buttons look fine, ringed or not. But there's a hidden problem, seen only on a button which changes state. FreePPP's Disconnect button is a prime example, so that's the button shown in most of the screen captures on this page. The buttons to the right are from the Apple Grayscale scheme. Up top is the Connect button circled with a default ring. After a connection has been established, the button changes state and becomes a Disconnect button. There's no ring around it because you don't want a careless carriage return to automatically disconnect your modem!
 
 
The Problem
  Here are two different buttons, the problematic Disconnect button and the Modem Setup button, which does not change state nor does it ever have a ring. The different schemes from top to bottom are:
  • BeBox
  • Ice
  • Onyx
  
 
  
 
  
  A related problem is described in the Creating Color Schemes  document shipped with Kaleidoscope 1.5. I say "related" because that document is really refering to the solid mask problem, not the "hole in the mask is too small" problem.
Default Button Rings
Be sure to leave a hole in the default button ring icon mask for the push button itself. Otherwise, the corners of the default button ring overwrite the corners of the push button, resulting in push buttons that have white squares cut out of their corners.
The Masks
  Using the Onyx scheme, I modified the hole in the default ring mask (cicn -10231) one pixel at a time. The first mask is before any changes. The next is what the mask looked like after I had removed enough pixels to uncover one corner of the button. The last picture shows a mask which will correctly render the button with or without a ring, with no drawing errors through state changes. It makes the cicn resource look a little weird, though.

 
 
 

The Solid Mask
  This is what happens to the button when there is no hole at all in the default button ring mask. These are obviously the white squares refered to in the Creating Color Schemes  document.
 
Beginning to Change Shape
  These buttons came from a scheme called DeKalb by Richard Miske (used with permission). They're square on one pair of corners and rounded on the others. The dual shape serves as a perfect example of the button ring problem, since I can show the square and rounded mask fixes in one picture. It also shows that there's an interest in making buttons in shapes beyond just square or rounded.
 
  

 
 
Serious Shapeshifting
  I tried some radical things when I saw how buttons are handled in Kaleidoscope 1.5, but I haven't had much luck with anything other than square or rounded corners. I've finally figured out why, and it again is related to the button ring. These buttons to the right show what happens when the button ring is drawn right up to the center.

  Because of the way the button ring cicn stretches into a button ring, and the button cicn is stretched into a button, these show the "furthest from square" that a button can be made. Then again, I've seen some pretty clever things done with careful coloring, the various Scrollites schemes come to mind here.


 
 
The Limit Explained
  The bright green squares in the three large cicn images below show (in one quadrant only) where the button ring overlaps the button. It is up to and including that overlap area where the hole in the mask needs to be to not erase pixels off the button when the ring is masked out.  
The Button cicn Resource The Button Ring cicn Resource
Close-up of the mask
 
Special Thanks
Many thanks to Brian Hagler who is working on a wonderful Kaleidoscope scheme guide which I have been beta testing. I don't think I'd have figured out the "furthest from square" restrictions on button shapes as quickly without the information in that guide!
Back to Calyxa's Kaleidoscope Schemes