iOS 7 ronde encadrée bouton

Question

l'App Store d'iOS a un rond bleu encadrée bouton pour acheter/télécharger des applications.

Dans mon Application, vous pouvez télécharger du contenu supplémentaire et je veux avoir un bouton similaire, juste parce qu'il semble familier à l'utilisateur.

Si vous ne savez pas, ce que je veux dire: ces boutons, comme "$3.99"

Comment est-ce possible?

Answer 1

Vous pouvez manipuler le CALayer de votre bouton pour le faire assez facilement.

// assuming you have a UIButton or more generally a UIView called buyButton

buyButton.layer.cornerRadius = 2;
buyButton.layer.borderWidth = 1;
buyButton.layer.borderColor = [UIColor blueColor].CGColor;
// (note - may prefer to use the tintColor of the control)

vous pouvez modifier chacun de ces pour obtenir la couleur et l'effet de bordure que vous voulez.

Vous devrez aussi ajouter une importation dans un fichier que vous souhaitez utiliser CALayers

#import <QuartzCore/QuartzCore.h>

Answer 2

Si vous êtes un grand fan de l'utilisation des story-boards pour votre conception de l'INTERFACE utilisateur avec iOS.. vous pouvez définir le rayon de l'angle (et selon d'autres paramètres comme indiqué dans le dima réponse , bien que malheureusement pas la couleur, puisque c'est un CGColor et Apple actuellement n'ont pas cette option dans le menu contextuel) en identity inspector->user defined runtime attributes dans le storyboard, comme illustré ici:

bonus: vous utilisez le runtime attributs UIButton de l'espace réservé de texte de couleur (voir ici) et pour modifier les polices de UILabel, UITextField et UIButton (voir ici)

Answer 3

Pour la norme de la recherche et des contrôles, vous devez utiliser le UIView nuance de couleur de la propriété:

buyButton.layer.borderColor = buyButton.tintColor.CGColor;

Answer 4

Pour la simple frontière comme vous l'avez décrit, utilisez la réponse de Dima à l'aide de CALAyer.

Si vous souhaitez de plus, l'e.g un rectangle arrondi avec un dégradé puis utiliser cette approche comme base:

Créer une Vue personnalisée qui dessine un rectangle arrondi et placez-le sur le bouton. Utiliser la fonction de recherche ici à la recherche pour dessiner un rectangle arrondi. Le dessin des œuvres de dessin 4 arcs avec rayon défini (coins) et 4 lignes droites.

---

FTR, voici comment vous faire une UIView avec le bon iOS7 coins arrondis, par Alex et Brian.

Je suis assez sûr que CGPathCreateWithRoundedRect ne pas vous donner la "nouvelle" des coins arrondis. Vous devez utiliser bezierPathWithRoundedRect pour la "nouvelle" coins.

#import "UIViewWithIOS7RoundedCorners.h"
@implementation UIViewWithIOS7RoundedCorners
-(void)drawRect:(CGRect)rect
    {
    // for a filled shape...

    UIBezierPath* path =
        [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:4];
    [[UIColor blueColor] setFill];
    [path fill];

    // for just a border...

    int thickness=2;
    UIBezierPath* path =
        [UIBezierPath bezierPathWithRoundedRect:
            CGRectInset(self.bounds, thickness/2, thickness/2)
            cornerRadius: 4];
    path.lineWidth = thickness;
    [[UIColor blueColor] setStroke];
    [path stroke];
    }

@end
// ps don't forget to set .backgroundColor=[UIColor clearColor]
// perhaps in initWithCoder/initWithFrame

Espérons que cela aide quelqu'un

Answer 5

J'ai mis en œuvre l'AppStore bouton de style ici pour votre référence: ASButton.m

et le projet est ici

Espérons aider :]