web-dev-qa-db-fra.com

Augmenter une "zone de clic" dans UISlider

Je crée un UISlider personnalisé et je me demande comment augmenter la "zone de clic" d'une image du pouce. Le code ci-dessous fonctionne très bien, sauf que la "zone de clic" du pouce reste inchangée. Si je ne me trompe pas, je crois que la zone du pouce standard est de 19 px? Disons que je voudrais l'augmenter à 35 pixels avec le code suivant ci-dessous, quelles étapes dois-je suivre? N'oubliez pas que je ne suis pas du tout un expert dans ce domaine. 

EDIT Le code ci-dessous est corrigé et prêt pour la copie de pâtes! J'espère que ça vous aide!

main.h

#import "MyUISlider.h"

@interface main : MLUIViewController <UITableViewDelegate, UITableViewDataSource, UISearchBarDelegate, UIActionSheetDelegate, UIAlertViewDelegate, MFMailComposeViewControllerDelegate, UIGestureRecognizerDelegate, MLSearchTaskDelegate, MLDeactivateDelegate, MLReceiptDelegate>
{
  ..........

}

- (void)create_Custom_UISlider;

main.m

- (void)viewDidLoad
{

[self create_Custom_UISlider];
[self.view addSubview: customSlider];

}

- (void)create_Custom_UISlider
{
CGRect frame = CGRectMake(20.0, 320.0, 280, 0.0);


customSlider = [[MyUISlider alloc] initWithFrame:frame];

[customSlider addTarget:self action:@selector(sliderAction:) forControlEvents:UIControlEventValueChanged];
// in case the parent view draws with a custom color or gradient, use a transparent color

customSlider.backgroundColor = [UIColor clearColor];

UIImage *stetchLeftTrack = [[UIImage imageNamed:@"blue_slider08.png"]
           stretchableImageWithLeftCapWidth: 10.0 topCapHeight:0.0];
UIImage *stetchRightTrack = [[UIImage imageNamed:@"blue_slider08.png"]
            stretchableImageWithLeftCapWidth: 260.0 topCapHeight:0.0];


[customSlider setThumbImage: [UIImage imageNamed:@"slider_button00"] forState:UIControlStateNormal];
[customSlider setMinimumTrackImage:stetchLeftTrack forState:UIControlStateNormal];
[customSlider setMaximumTrackImage:stetchRightTrack forState:UIControlStateNormal];


                    customSlider.minimumValue = 0.0;
                    customSlider.maximumValue = 1.0;
                    customSlider.continuous = NO;
                    customSlider.value = 0.00;

}

-(void) sliderAction: (UISlider *) sender{

if(sender.value !=1.0){
 [sender setValue: 0.00 animated: YES];
}
else{
[sender setValue 0.00 animated: YES];
 // add some code here depending on what you want to do!
  }
}

EDIT(en essayant de sous-classer avec le code ci-dessous)

MyUISlider.h

#import <UIKit/UIKit.h>

@interface MyUISlider : UISlider {

}

@end

MyUISlider.m

#import "MyUISlider.h"

@implementation MyUISlider



- (CGRect)thumbRectForBounds:(CGRect)bounds trackRect:(CGRect)rect value:(float)value
{


return CGRectInset ([super thumbRectForBounds:bounds trackRect:rect value:value], 10 , 10);

}


@end
21
user1293618

Vous devez remplacerthumbRectForBounds:trackRect:value: dans une sous-classe personnalisée (au lieu de appeler la méthode vous-même, comme vous le faites dans votre code, ce qui ne fait que renvoyer une valeur que vous ne même pas la peine de récupérer).

thumbRectForBounds:trackRect:value: n'est pas une méthode pour set tumb rect, mais pour get it. Le curseur appelle en interne cette méthode thumbRectForBounds:trackRect:value: pour savoir où dessiner une image miniature. Vous devez donc la remplacer - comme expliqué dans la documentation - pour renvoyer la CGRect de votre choix (afin qu'elle soit au format 35x35px à votre guise).

12
AliSoftware

Mise à jour pour Swift 3.0 et iOS 10

private func generateHandleImage(with color: UIColor) -> UIImage {
    let rect = CGRect(x: 0, y: 0, width: self.bounds.size.height + 20, height: self.bounds.size.height + 20)

    return UIGraphicsImageRenderer(size: rect.size).image { (imageContext) in
        imageContext.cgContext.setFillColor(color.cgColor)
        imageContext.cgContext.fill(rect.insetBy(dx: 10, dy: 10))
    }
}

Appel:

self.sliderView.setThumbImage(self.generateHandleImage(with: .white), for: .normal)

Réponse originale:

De loin, la méthode la plus simple consiste simplement à augmenter la taille de l’image de pouce entourée d’une bordure invisible:

- (UIImage *)generateHandleImageWithColor:(UIColor *)color
{
    CGRect rect = CGRectMake(0.0f, 0.0f, self.bounds.size.height + 20.f, self.bounds.size.height + 20.f);
    UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0.f);
    CGContextRef context = UIGraphicsGetCurrentContext();

    CGContextSetFillColorWithColor(context, color.CGColor);
    CGContextFillRect(context, CGRectInset(rect, 10.f, 10.f));

    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

Et que d'ajouter cette image au curseur:

[self.sliderView setThumbImage:[self generateHandleImageWithColor:[UIColor redColor]] forState:UIControlStateNormal];
11
Borut Tomazin

pourquoi vous voulez choisir un curseur personnalisé alors que vous pouvez modifier la zone d’un curseur par défaut;)

jetez un oeil à ce code, il a fonctionné pour moi pour augmenter la zone tactile de mon UISlider j'espère que cela vous aidera aussi

CGRect sliderFrame = yourSlider.frame;
sliderFrame.size.height = 70.0;
[yourSlider setFrame:sliderFrame];
0
D-eptdeveloper

Vous pouvez vérifier mon double curseur projet

En résumé, j'ai mis en œuvre la méthode de test hit donc le beginTrackingWithTouch est appelé.

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
    if (CGRectContainsPoint(self.leftHandler.frame, point) || CGRectContainsPoint(self.rightHandler.frame, point)) {
        return self;
    }

    return [super hitTest:point withEvent:event];
}

Vérifiez la classe pour plus de détails 

0
Raphael Oliveira

J'ai aussi eu ce problème et je l'ai résolu en écrasant 

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

méthode. Vous pouvez retourner OUI pour les points sur lesquels vous souhaitez être touché.

0
Yerkezhan