Как сделать AppStore-подобные кнопки на iPad - PullRequest
Новая
       23

Как сделать AppStore-подобные кнопки на iPad

1 голос
/ 21 сентября 2011

Я не могу понять, как сделать предмет.

Я хотел бы иметь несколько кнопок, которые не являются круглыми прямоугольными кнопками.

В iPad AppStore есть, например, элементы управления поиском, которые имитируют выпадающий список, известный, например, из окна веб-выбора или из Windows.

enter image description here

Как создать кнопку, которая больше похожа на UIBarButtonItem, чем на кнопку RoundRect UIB, и при этом я могу разместить ее где угодно?

Яработает в MonoTouch, но ответы могут прийти в любом вкусе, как это сделать через Интерфейсный конструктор или программно в Objective-C или MonoTouch, или даже просто псевдо-описание - я просто надеюсь получить подсказку.

Надеюськто-то может привести меня в правильном направлении ...

/ Андерс

Ответы [ 3 ]

2 голосов
/ 21 сентября 2011

Просто создайте пользовательскую кнопку. Вот пример того, как создать действительно некрасивую пользовательскую кнопку, используя некоторые функции UIView и 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);

Настройте его в соответствии с вашими потребностями. Если вы хотите, чтобы ваши кнопки выглядели по-другому, продолжайте.

1 голос
/ 21 сентября 2011

В сети есть несколько пользовательских элементов управления, которые вы можете использовать для своих целей, например, MAConfirmButton , который дублирует кнопки "Купить сейчас" в App Store.

0 голосов
/ 22 сентября 2011

Вот мой пример того, как я делаю это в MonoTouch в данный момент.Так как я не использую цвета, я закомментировал раздел с помощью colorlayer - но сохранил его для справки.

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);

    }
...