UIButton: Rendre le coup plus que la superficie par défaut de la zone frappée par le

Depuis que je suis en utilisant une image de fond, aucune de ces solutions a bien fonctionné pour moi. Voici une solution qui ne prend du plaisir objective-c la magie et offre une goutte dans une solution avec un minimum de code.

Tout d'abord, ajoutez un catégorie à UIButton qui remplace le test de collision et ajoute également une propriété pour l'expansion de la frapper cadre de test.

UIButton+Extensions.h

@interface UIButton (Extensions)

@property(nonatomic, assign) UIEdgeInsets hitTestEdgeInsets;

@end

UIButton+Extensions.m

#import "UIButton+Extensions.h"
#import <objc/runtime.h>

@implementation UIButton (Extensions)

@dynamic hitTestEdgeInsets;

static const NSString *KEY_HIT_TEST_EDGE_INSETS = @"HitTestEdgeInsets";

-(void)setHitTestEdgeInsets:(UIEdgeInsets)hitTestEdgeInsets {
    NSValue *value = [NSValue value:&hitTestEdgeInsets withObjCType:@encode(UIEdgeInsets)];
    objc_setAssociatedObject(self, &KEY_HIT_TEST_EDGE_INSETS, value, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}

-(UIEdgeInsets)hitTestEdgeInsets {
    NSValue *value = objc_getAssociatedObject(self, &KEY_HIT_TEST_EDGE_INSETS);
    if(value) {
        UIEdgeInsets edgeInsets; [value getValue:&edgeInsets]; return edgeInsets;
    }else {
        return UIEdgeInsetsZero;
    }
}

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
    if(UIEdgeInsetsEqualToEdgeInsets(self.hitTestEdgeInsets, UIEdgeInsetsZero) || !self.enabled || self.hidden) {
        return [super pointInside:point withEvent:event];
    }

    CGRect relativeFrame = self.bounds;
    CGRect hitFrame = UIEdgeInsetsInsetRect(relativeFrame, self.hitTestEdgeInsets);

    return CGRectContainsPoint(hitFrame, point);
}

@end

Une fois cette classe est ajouté, tout ce que vous devez faire est de régler le bord des encarts de votre bouton. Notez que j'ai choisi d'ajouter des encarts donc, si vous voulez faire de la zone frappée par le plus grand, vous devez utiliser des nombres négatifs.

[button setHitTestEdgeInsets:UIEdgeInsetsMake(-10, -10, -10, -10)];

Remarque: n'oubliez pas d'importer la catégorie (#import "UIButton+Extensions.h") dans vos classes.

Voici une solution élégante à l'aide des Extensions de Swift. Il donne à tous les UIButtons une zone frappée par au moins 44x44 points, comme par Apple Human Interface Guidelines (https://developer.apple.com/ios/human-interface-guidelines/visual-design/layout/)

Swift 2:

private let minimumHitArea = CGSizeMake(44, 44)

extension UIButton {
    public override func hitTest(point: CGPoint, withEvent event: UIEvent?) -> UIView? {
        //if the button is hidden/disabled/transparent it can't be hit
        if self.hidden || !self.userInteractionEnabled || self.alpha < 0.01 { return nil }

        //increase the hit frame to be at least as big as `minimumHitArea`
        let buttonSize = self.bounds.size
        let widthToAdd = max(minimumHitArea.width - buttonSize.width, 0)
        let heightToAdd = max(minimumHitArea.height - buttonSize.height, 0)
        let largerFrame = CGRectInset(self.bounds, -widthToAdd / 2, -heightToAdd / 2)

        //perform hit test on larger frame
        return (CGRectContainsPoint(largerFrame, point)) ? self : nil
    }
}

Swift 3:

fileprivate let minimumHitArea = CGSize(width: 100, height: 100)

extension UIButton {
    open override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
        //if the button is hidden/disabled/transparent it can't be hit
        if self.isHidden || !self.isUserInteractionEnabled || self.alpha < 0.01 { return nil }

        //increase the hit frame to be at least as big as `minimumHitArea`
        let buttonSize = self.bounds.size
        let widthToAdd = max(minimumHitArea.width - buttonSize.width, 0)
        let heightToAdd = max(minimumHitArea.height - buttonSize.height, 0)
        let largerFrame = self.bounds.insetBy(dx: -widthToAdd / 2, dy: -heightToAdd / 2)

        //perform hit test on larger frame
        return (largerFrame.contains(point)) ? self : nil
    }
}

Voici Chase UIButton+Extensions Swift 3.0.

import UIKit

private var pTouchAreaEdgeInsets: UIEdgeInsets = .zero

extension UIButton {

    var touchAreaEdgeInsets: UIEdgeInsets {
        get {
            if let value = objc_getAssociatedObject(self, &pTouchAreaEdgeInsets) as? NSValue {
                var edgeInsets: UIEdgeInsets = .zero
                value.getValue(&edgeInsets)
                return edgeInsets
            }
            else {
                return .zero
            }
        }
        set(newValue) {
            var newValueCopy = newValue
            let objCType = NSValue(uiEdgeInsets: .zero).objCType
            let value = NSValue(&newValueCopy, withObjCType: objCType)
            objc_setAssociatedObject(self, &pTouchAreaEdgeInsets, value, .OBJC_ASSOCIATION_RETAIN)
        }
    }

    open override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
        if UIEdgeInsetsEqualToEdgeInsets(self.touchAreaEdgeInsets, .zero) || !self.isEnabled || self.isHidden {
            return super.point(inside: point, with: event)
        }

        let relativeFrame = self.bounds
        let hitFrame = UIEdgeInsetsInsetRect(relativeFrame, self.touchAreaEdgeInsets)

        return hitFrame.contains(point)
    }
}

Pour l'utiliser, vous pouvez:

button.touchAreaEdgeInsets = UIEdgeInsets(top: -10, left: -10, bottom: -10, right: -10)

Je recommande de placer un UIButton avec le type Personnalisé centré sur votre bouton info. Redimensionner le bouton personnalisé à la taille que vous voulez le frapper domaine de l'être. À partir de là, vous avez deux options:

1. Cochez la case " Afficher le toucher de la surbrillance l'option du bouton personnalisé. La lueur blanche apparaît sur le bouton info, mais dans la plupart des cas, les utilisateurs doigt couvre ce et tout ce qu'ils vont voir, c'est la lueur autour de l'extérieur.

2. Configurer un IBOutlet pour la touche info et deux IBActions pour le bouton personnalisé pour un "Touch Down" et une pour la "Touche Jusqu'à l'Intérieur". Puis dans Xcode faire de l'événement touchdown ensemble de la propriété en surbrillance le bouton info pour OUI et le touchupinside événement définissez la propriété sélectionnée ou PAS.

Il n'y a rien de mal avec les réponses présentées; cependant j'ai voulu prolonger jlarjlar réponse car il recèle un potentiel étonnant qui peut ajouter de la valeur pour le même problème avec d'autres contrôles (par exemple barre de recherche). C'est parce que depuis pointInside est attaché à une UIView, on est capable de la sous-classe aucun contrôle pour améliorer la zone tactile. Cette réponse montre un échantillon complet de la façon de mettre en œuvre la solution complète.

Créer une nouvelle sous-classe de votre bouton (ou tout contrôle)

#import <UIKit/UIKit.h>

@interface MNGButton : UIButton

@end

Prochaine remplacer la pointInside méthode dans votre sous-classe de mise en œuvre

@implementation MNGButton


-(BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
{
    //increase touch area for control in all directions by 20
    CGFloat margin = 20.0;
    CGRect area = CGRectInset(self.bounds, -margin, -margin);
    return CGRectContainsPoint(area, point);
}


@end

Sur votre table de montage séquentiel/xib fichier, sélectionnez la commande en question et d'ouvrir l'identité de l'inspecteur et tapez le nom de votre classe personnalisée.

Dans votre classe UIViewController pour la scène contenant le bouton modifier le type de classe pour le bouton sur le nom de votre sous-classe.

@property (weak, nonatomic) IBOutlet MNGButton *helpButton;

Lien de votre table de montage séquentiel/xib bouton de la propriété IBOutlet et votre zone tactile sera élargi pour s'adapter à la zone définie dans la sous-classe.

En plus à la redéfinition de la pointInside méthode avec le CGRectInset et CGRectContainsPoint méthodes, il faut prendre le temps d'examiner les CGGeometry pour l'extension de la rectangulaires zone tactile de toute sous-classe UIView. Vous pouvez aussi trouver des conseils sympas sur CGGeometry cas d'utilisation à NSHipster.

Par exemple on pourrait faire de la zone tactile irrégulière en utilisant les méthodes mentionnées ci-dessus ou tout simplement choisir de faire de la largeur de la zone de toucher deux fois plus grand que l'horizontale de la zone tactile:

CGRect area = CGRectInset(self.bounds, -(2*margin), -margin);

NB: la Substitution de toute INTERFACE de commande de Classe doit produire des résultats similaires sur l'extension de la zone tactile pour les différents contrôles (ou tout sous-classe UIView, comme UIImageView, etc).

De ne pas changer le comportement de UIButton.

@interface ExtendedHitButton: UIButton

+ (instancetype) extendedHitButton;

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event;

@end

@implementation ExtendedHitButton

+ (instancetype) extendedHitButton {
    return (ExtendedHitButton *) [ExtendedHitButton buttonWithType:UIButtonTypeCustom];
}

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
    CGRect relativeFrame = self.bounds;
    UIEdgeInsets hitTestEdgeInsets = UIEdgeInsetsMake(-44, -44, -44, -44);
    CGRect hitFrame = UIEdgeInsetsInsetRect(relativeFrame, hitTestEdgeInsets);
    return CGRectContainsPoint(hitFrame, point);
}

@end

Bien, vous pouvez placer votre UIButton à l'intérieur d'un transparent et un peu plus grand UIView, et ensuite de prendre les événements tactiles sur le UIView exemple comme dans le UIButton. De cette façon, vous aurez toujours votre bouton, mais avec une plus grande zone tactile. Vous manuellement avoir à traiter avec une sélection de & souligné les etats con le bouton si l'utilisateur touche la vue au lieu de la touche.

Autre possibilité consiste à utiliser une UIImage au lieu d'un UIButton.

Je suis en utilisant la classe suivante dans Swift, également activer une Interface Builder propriété pour ajuster la marge:

@IBDesignable
class ALExtendedButton: UIButton {
@IBInspectable var touchMargin:CGFloat = 20.0
override func pointInside(point: CGPoint, withEvent event: UIEvent?) -> Bool {
var extendedArea = CGRectInset(self.bounds, -touchMargin, -touchMargin)
return CGRectContainsPoint(extendedArea, point)
}
}

Chase d'accès personnalisé test mis en œuvre comme une sous-classe de UIButton. Écrit en Objective-C.

Il semble fonctionner à la fois pour init et buttonWithType: constructeurs. Pour mes besoins c'est parfait, mais depuis le sous-classement UIButton peut être poilu, je serais curieux de savoir si quelqu'un a un problème avec elle.

CustomeHitAreaButton.h

#import <UIKit/UIKit.h>
@interface CustomHitAreaButton : UIButton
- (void)setHitTestEdgeInsets:(UIEdgeInsets)hitTestEdgeInsets;
@end

CustomHitAreaButton.m

#import "CustomHitAreaButton.h"
@interface CustomHitAreaButton()
@property (nonatomic, assign) UIEdgeInsets hitTestEdgeInsets;
@end
@implementation CustomHitAreaButton
- (instancetype)initWithFrame:(CGRect)frame {
if(self = [super initWithFrame:frame]) {
self.hitTestEdgeInsets = UIEdgeInsetsZero;
}
return self;
}
-(void)setHitTestEdgeInsets:(UIEdgeInsets)hitTestEdgeInsets {
self->_hitTestEdgeInsets = hitTestEdgeInsets;
}
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
if(UIEdgeInsetsEqualToEdgeInsets(self.hitTestEdgeInsets, UIEdgeInsetsZero) || !self.enabled || self.hidden) {
return [super pointInside:point withEvent:event];
}
CGRect relativeFrame = self.bounds;
CGRect hitFrame = UIEdgeInsetsInsetRect(relativeFrame, self.hitTestEdgeInsets);
return CGRectContainsPoint(hitFrame, point);
}
@end

WJBackgroundInsetButton.h

#import <UIKit/UIKit.h>
@interface WJBackgroundInsetButton : UIButton {
UIEdgeInsets backgroundEdgeInsets_;
}
@property (nonatomic) UIEdgeInsets backgroundEdgeInsets;
@end

WJBackgroundInsetButton.m

#import "WJBackgroundInsetButton.h"
@implementation WJBackgroundInsetButton
@synthesize backgroundEdgeInsets = backgroundEdgeInsets_;
-(CGRect) backgroundRectForBounds:(CGRect)bounds {
CGRect sup = [super backgroundRectForBounds:bounds];
UIEdgeInsets insets = self.backgroundEdgeInsets;
CGRect r = UIEdgeInsetsInsetRect(sup, insets);
return r;
}
@end

J'ai fait un bibliothèque à cet effet.

Vous pouvez choisir d'utiliser un UIView catégorie, pas de sous-classement requis:

@interface UIView (KGHitTesting)
- (void)setMinimumHitTestWidth:(CGFloat)width height:(CGFloat)height;
@end

Ou vous pouvez votre sous-classe UIView ou UIButton et définir la minimumHitTestWidth et/ou minimumHitTestHeight. Votre bouton hit-zone de test sera alors représenté par ces 2 valeurs.

À l'instar d'autres solutions, il utilise le - (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event méthode. La méthode est appelée lors de l'iOS effectue le test d'atteinte. Cette blog a une bonne description sur comment iOS hit-travaux d'essais.

https://github.com/kgaidis/KGHitTestingViews

@interface KGHitTestingButton : UIButton <KGHitTesting>
@property (nonatomic) CGFloat minimumHitTestHeight; 
@property (nonatomic) CGFloat minimumHitTestWidth;
@end

Vous pouvez aussi simplement sous-classe et à utiliser Interface Builder sans écrire de code:

Je vais utiliser cette astuce pour bouton à l'intérieur de tableviewcell.accessoryView pour agrandir sa zone tactile

#pragma mark - Touches
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch                  = [touches anyObject];
CGPoint location                = [touch locationInView:self];
CGRect  accessoryViewTouchRect  = CGRectInset(self.accessoryView.frame, -15, -15);
if(!CGRectContainsPoint(accessoryViewTouchRect, location))
[super touchesBegan:touches withEvent:event];
}
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch                  = [touches anyObject];
CGPoint location                = [touch locationInView:self];
CGRect  accessoryViewTouchRect  = CGRectInset(self.accessoryView.frame, -15, -15);
if(CGRectContainsPoint(accessoryViewTouchRect, location) && [self.accessoryView isKindOfClass:[UIButton class]])
{
[(UIButton *)self.accessoryView sendActionsForControlEvents:UIControlEventTouchUpInside];
}
else
[super touchesEnded:touches withEvent:event];
}

@antoine réponse formatée pour Swift 4

class ExtendedHitButton: UIButton
{
override func point( inside point: CGPoint, with event: UIEvent? ) -> Bool
{
let relativeFrame = self.bounds
let hitTestEdgeInsets = UIEdgeInsetsMake( -44, -44, -44, -44 ) //Apple recommended hit target
let hitFrame = UIEdgeInsetsInsetRect( relativeFrame, hitTestEdgeInsets )
return hitFrame.contains( point );
}
}

Je suis en retard pour ce jeu, mais je voulais peser sur une technique simple qui pourrait résoudre votre problèmes. Voici un exemple typique d'programmatique UIButton extrait pour moi:

UIImage *arrowImage = [UIImage imageNamed:@"leftarrow"];
arrowButton = [[UIButton alloc] initWithFrame:CGRectMake(15.0, self.frame.size.height-35.0, arrowImage.size.width/2, arrowImage.size.height/2)];
[arrowButton setBackgroundImage:arrowImage forState:UIControlStateNormal];
[arrowButton addTarget:self action:@selector(onTouchUp:) forControlEvents:UIControlEventTouchUpOutside];
[arrowButton addTarget:self action:@selector(onTouchDown:) forControlEvents:UIControlEventTouchDown];
[arrowButton addTarget:self action:@selector(onTap:) forControlEvents:UIControlEventTouchUpInside];
[arrowButton addTarget:self action:@selector(onTouchUp:) forControlEvents:UIControlEventTouchDragExit];
[arrowButton setUserInteractionEnabled:TRUE];
[arrowButton setAdjustsImageWhenHighlighted:NO];
[arrowButton setTag:1];
[self addSubview:arrowButton];

Je suis le chargement d'une Image au format png transparent pour mon bouton et le réglage de l'image d'arrière-plan. Je suis réglage de l'image basée sur la UIImage et de mise à l'échelle de 50% pour la rétine. OK, peut-être que vous êtes d'accord avec ce qui précède ou pas, MAIS si vous voulez faire de la zone frappée par le PLUS grand et vous épargner les maux de tête:

Ce que je fais, ouvrez l'image dans photoshop et simplement augmenter la taille du canevas à 120% et économisez. Effectivement tu viens de faire l'image de l'ampleur avec les pixels transparents.

Qu'une démarche.

Aucune réponse fonctionne parfaitement pour moi, parce que je utiliser l'image de fond et un titre sur ce bouton. En outre, le bouton redimensionner, selon la taille de l'écran change.

Au lieu de cela, je agrandir appuyez sur la zone en faisant le png transparent zone plus grande.

Similaire à Zhanserik, avec la variable d'extension et de mise à jour pour Swift 4.2:

class ButtonWithExtendedHitArea: UIButton {
var extention: CGFloat
required init(extendBy: CGFloat) {
extention = extendBy
super.init(frame: .zero)
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override open func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
let relativeFrame = self.bounds
let hitTestEdgeInsets = UIEdgeInsets(top: -extention, left: -extention, bottom: -extention, right: -extention)
let hitFrame = relativeFrame.inset(by: hitTestEdgeInsets)
return hitFrame.contains(point)
}
}

Swift:

override func viewWillAppear(animated: Bool) {
self.sampleButton.frame = CGRectInset(self.sampleButton.frame, -10, -10);
}

• Sans écraser dans des catégories ou des extensions de
• 44x44 minimum par les lignes directrices

De mon point de vue:

open class MinimumTouchAreaButton: UIButton {
open override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
guard !self.isHidden, self.isUserInteractionEnabled, self.alpha > 0 else { return nil }
let expandedBounds = bounds.insetBy(dx: min(bounds.width - 44, 0), dy: min(bounds.height - 44, 0))
return expandedBounds.contains(point) ? self : nil
}
}