How to make AppStore-like buttons on iPad - objective-c

Question

I can't seem to figure out how to do subject.
What I would like is to have some buttons which are not round-rect buttons.
The iPad AppStore has e.g. the search controls which mimics a dropdown known from e.g. the web select box or dropdown from Windows.
How do I create a button that looks more like a UIBarButtonItem than a RoundRect UIButton, and still being able to place it anywhere?
I'm working in MonoTouch, but answers can come in any flavour, how to do it through Interface builder or programmatically in objective-c or MonoTouch, or even just a pseudo description - im just hoping to get a hint.
Hope someone out there can lead me in the right direction...
/Anders

Answer 1

Just create a custom button. Here's an example to create a real ugly custom button using some features of UIView and CALayer.
var btn = UIButton.FromType(UIButtonType.Custom);
btn.Frame = new RectangleF(100, 100, 150, 30);
btn.SetTitle("Button", UIControlState.Normal);
// Custom backround image.
btn.SetBackgroundImage(UIImage.FromFile("./images/barbuttonbackground.png"), UIControlState.Normal);
// Custom border color.
btn.Layer.BorderColor = UIColor.Orange.CGColor;
// Custom border width.
btn.Layer.BorderWidth = 2.0f;
// Custom rounded corners (does not really work well together with the background image).
btn.Layer.CornerRadius = 10.0f;
// Transparency.
btn.Alpha = 0.6f;
window.AddSubview(btn);
Adjust it to your needs. If you want to have your buttons look differently, go ahead.

Answer 2

There are some custom controls in the web that you can use for your purpose, e.g. MAConfirmButton which replicates the App Store's "Buy Now" buttons.

Answer 3

Heres my sample of how I do it in MonoTouch at the moment.
Since i'm not using colors I have commented out the section with the colorlayer - but kept it for reference.
public static UIButton GetNewButton(RectangleF frame)
{
var btn = UIButton.FromType(UIButtonType.Custom);
btn.Frame = frame;
btn.Layer.BorderWidth = 1.0f;
btn.Layer.BorderColor = UIColor.FromRGB(200,200,200).CGColor;
btn.Layer.CornerRadius = 4.0f;
btn.SetTitleColor(UIColor.Black, UIControlState.Normal);
btn.TitleLabel.TextAlignment = UITextAlignment.Right;
btn.TitleLabel.BackgroundColor = UIColor.Clear;
btn.Layer.NeedsDisplayOnBoundsChange = true;
SetupLayers(btn);
return btn;
}
private static void SetupLayers(UIButton btn){
CAGradientLayer bevelLayer = new CAGradientLayer();
bevelLayer.Frame = new RectangleF(new PointF(0,0), btn.Frame.Size);
bevelLayer.Colors = new CGColor[]{UIColor.White.CGColor, UIColor.FromRGB(218,218,218).CGColor};
bevelLayer.CornerRadius = 4.0f;
bevelLayer.NeedsDisplayOnBoundsChange = true;
/* CALayer colorLayer = new CALayer();
colorLayer.Frame = new RectangleF(0f,1f, btn.Frame.Width, btn.Frame.Height -2);
colorLayer.BorderColor = UIColor.FromWhiteAlpha(0, 0.1f).CGColor;
colorLayer.BackgroundColor = UIColor.FromRGBA(0.220f, 0.357f, 0.608f, 1).CGColor;
colorLayer.BorderWidth = 1.0f;
colorLayer.CornerRadius = 4.0f;
colorLayer.NeedsDisplayOnBoundsChange = true;
*/
CAGradientLayer colorGradient = new CAGradientLayer();
colorGradient.Frame = new RectangleF(0f,1f, btn.Frame.Width, btn.Frame.Height -2);
colorGradient.Colors = new CGColor[]{UIColor.FromWhiteAlpha(1f, 0.1f).CGColor, UIColor.FromWhiteAlpha(0.2f, 0.1f).CGColor/*, null*/};
colorGradient.Locations = new NSNumber[]{NSNumber.FromFloat(0.0f), NSNumber.FromFloat(1.0f)};
colorGradient.CornerRadius = 4.0f;
colorGradient.NeedsDisplayOnBoundsChange = true;
btn.Layer.AddSublayer(bevelLayer);
// btn.Layer.AddSublayer(colorLayer);
btn.Layer.AddSublayer(colorGradient);
btn.BringSubviewToFront(btn.TitleLabel);
}