使用滑动手势控制UIButton

Question

我想制作一个UIButton控件，使用滑动来填充和弹出，如下图所示。

它在经济学人的GMAT Tutor应用程序中使用。有什么提示吗？

Answer 1

Download Code

我猜你可以使用UIPanGestureRecognizer，但是试试UIView而不是UIButton那么，你使用Core Graphics根据运动填充（绘制）颜色手指

使用UILabel

显示答案时使用UIView

For UIPanGestureRecognizer Tutorial

//Color Filling
//Add This code to UIView subClass that you will use instead of `UIButton`
- (void)drawRect:(CGRect)rect 
{
    CGContextRef context = UIGraphicsGetCurrentContext ();

    // The color to fill the rectangle (in this case black)
    CGContextSetRGBFillColor(context, 0.0, 0.0, 0.0, 1.0);

    // draw the filled rectangle
    CGRect fillRect = CGRectMake(0,0,FingerPositionInView,self.bounds.size.height)
    CGContextFillRect (context, fillRect);
}

//最终代码

.h File
#import <UIKit/UIKit.h>

@interface MHAnswerView : UIView
{
    float fingerPositionInView;
}
- (id)initWithFrame:(CGRect)frame andAnswer:(NSString*)answer;

@end

.m File

#import "MHAnswerView.h"

@implementation MHAnswerView

- (id)initWithFrame:(CGRect)frame andAnswer:(NSString*)answer
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        [self.layer setBorderColor:[UIColor colorWithRed:185.0f/255.0f green:224.0f/255.0f blue:231.0f/255.0f alpha:1.0f].CGColor];
        [self.layer setBorderWidth:2.0f];
        [self.layer setCornerRadius:2.0f];
        [self setBackgroundColor:[UIColor whiteColor]];
        UILabel* lblAnswer = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height)];
        lblAnswer.textAlignment = NSTextAlignmentCenter;
        lblAnswer.text = answer;
        [self addSubview:lblAnswer];

        UIPanGestureRecognizer* panGesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(move:)];
        [self addGestureRecognizer:panGesture];
        [NSTimer scheduledTimerWithTimeInterval:1.0f/60.0f target:self selector:@selector(updateProgressView) userInfo:nil repeats:YES];

    }
    return self;
}
-(void)updateProgressView
{
      [self setNeedsDisplayInRect:self.bounds];
}

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
    // Drawing code
    CGContextRef context = UIGraphicsGetCurrentContext ();

    // The color to fill the rectangle (in this case black)
    CGContextSetRGBFillColor(context,185.0f/255.0f,224.0f/255.0f,231.0f/255.0f,1.0);
    //CGContextSetRGBFillColor(context,0.0,0.0f,0.0f,1.0);
    // draw the filled rectangle
    CGRect fillRect = CGRectMake(0,0,fingerPositionInView,self.bounds.size.height);
    CGContextFillRect (context, fillRect);
}
-(void)move:(UIPanGestureRecognizer*)sender
{
    CGPoint translation = [sender translationInView:self];
    NSLog(@"%f", translation.x+self.frame.origin.x);
    fingerPositionInView = translation.x + self.frame.origin.x;

}

//Adding MHView to View Controller 
MHAnswerView* mhview = [[MHAnswerView alloc] initWithFrame:CGRectMake(20, 20, 280, 100) andAnswer:@"Answer"];
    [self.view addSubview:mhview];

Answer 2

将手势识别器附加到视图：

UIPanGestureRecognizer* pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)];
[view addGestureRecognizer:pan];

处理程序中的

检索手指的x位置：

- (void)handlePan:(UIPanGestureRecognizer*)sender
{   
    CGPoint translation = [sender translationInView:[view superview]];
    NSLog(@"%f", translation.x)
}