Флажок в приложении IOS

голоса
34

Мне нужно, чтобы добавить элементы управления флажок в моей форме. Я знаю, что нет такого контроля в IOS SDK. Как я могу это сделать?

Задан 16/03/2009 в 13:05
источник пользователем
На других языках...                            


13 ответов

голоса
31

это сводит меня с ума тоже, и я нашел другое решение, которое работает хорошо для меня, и избавляет от необходимости использовать изображения.

  1. Добавить новый объект ярлыка к Interface Builder.
  2. Создать свойство IBOutlet в Xcode и подключить к нему. В коде ниже я назвал его «fullyPaid», как я хочу знать, если кто-то полностью заплатил сумму денег.
  3. Добавьте 2 функции ниже. В «» touchesBegan функция проверяет, если вы коснулись где-то внутри объекта на ярлык «fullyPaid», и если да, то она вызывает функцию «togglePaidStatus». Функция «togglePaidStatus» устанавливает две строки, которые имеют символы Юникода, представляющие пустое поле (\ u2610) и проверяемое поле (\ u2611) соответственно. Затем он сравнивает то, что в данный момент объект «fullyPaid» и переключает его с другой строкой.

Вы можете вызвать функцию togglePaidStatus в функции viewDidLoad, чтобы установить его в пустую строку изначально.

Очевидно, что вы можете добавить дополнительные проверки, чтобы запретить пользователям переключая флажок, если метка не включена, но это не показано ниже.

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];   
    if (CGRectContainsPoint([fullyPaid frame], [touch locationInView:self.view]))
    {
        [self togglePaidStatus];
    }
}
-(void) togglePaidStatus
{
    NSString *untickedBoxStr = [[NSString alloc] initWithString:@"\u2610"];
    NSString *tickedBoxStr = [[NSString alloc] initWithString:@"\u2611"];   

    if ([fullyPaid.text isEqualToString:tickedBoxStr])
    {
        fullyPaid.text = untickedBoxStr;
    }
    else
    {
        fullyPaid.text = tickedBoxStr;
    }

    [tickedBoxStr release];
    [untickedBoxStr release];
}
Ответил 10/04/2010 в 22:23
источник пользователем

голоса
26

Как правило, вы бы использовать UISwitch для CheckBox подобных функциональных возможностей.

Вы можете свернуть свой собственный, хотя с помощью элемента управления изображения с двумя изображениями (проверено / снят) и переключение изображения, когда они касаются управления /

Ответил 16/03/2009 в 13:12
источник пользователем

голоса
10

Если вы показываете группу параметров, и пользователь может выбрать один из них, используйте TableView с галочкой аксессуаров и другого цвета текста на выбранной строке.

Если у вас есть один вариант, лучше всего использовать переключатель. Если вы не можете или не хотите, используйте кнопку, установив нормальное изображение на пустое поле и выбранное изображение в клетчатом поле. Вы должны будете сделать эти двух изображений самостоятельно или найти акции графику, чтобы использовать для них.

Ответил 16/03/2009 в 13:33
источник пользователем

голоса
8

Расширение к идее Адреан в , я уже достиг этого , используя очень простой подход.
Моя идея заключается в том, чтобы изменить кнопку (позволяет говорить checkBtn) текст в зависимости от его состояния, а затем изменить состояние кнопки в ее IBAction.
Ниже приведен код , как я сделал это:

- (void)viewDidLoad
{
    [super viewDidLoad];

    [checkBtn setTitle:@"\u2610" forState:UIControlStateNormal];    // uncheck the button in normal state
    [checkBtn setTitle:@"\u2611" forState:UIControlStateSelected];  // check the button in selected state
}

- (IBAction)checkButtonTapped:(UIButton*)sender {
    sender.selected = !sender.selected;    // toggle button's selected state  

    if (sender.state == UIControlStateSelected) {    
        // do something when button is checked 
    } else {
        // do something when button is unchecked
    }
}
Ответил 19/03/2014 в 05:17
источник пользователем

голоса
6

Вот моя версия флажка для Айфона.

Это единственный класс, который расширяет UIButton. Это просто так я вставлю его здесь.

содержимое файла CheckBoxButton.h

#import <UIKit/UIKit.h>

@interface CheckBoxButton : UIButton

@property(nonatomic,assign)IBInspectable BOOL isChecked;

@end

содержимое файла CheckBoxButton.m

#import "CheckBoxButton.h"

@interface CheckBoxButton()

@property(nonatomic,strong)IBInspectable UIImage* checkedStateImage;
@property(nonatomic,strong)IBInspectable UIImage* uncheckedStateImage;

@end

@implementation CheckBoxButton

-(id)init
{
    self = [super init];

    if(self)
    {
        [self addTarget:self action:@selector(switchState) forControlEvents:UIControlEventTouchUpInside];
    }

    return self;
}

-(id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];

    if(self)
    {
        [self addTarget:self action:@selector(switchState) forControlEvents:UIControlEventTouchUpInside];
    }

    return self;
}

-(id)initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];

    if(self)
    {
        [self addTarget:self action:@selector(switchState) forControlEvents:UIControlEventTouchUpInside];
    }

    return self;
}

-(void)setIsChecked:(BOOL)isChecked
{
    _isChecked = isChecked;

    if(isChecked)
    {
        [self setImage:self.checkedStateImage forState:UIControlStateNormal];
    }
    else
    {
        [self setImage:self.uncheckedStateImage forState:UIControlStateNormal];
    }
}

-(void)switchState
{
    self.isChecked = !self.isChecked;
    [self sendActionsForControlEvents:UIControlEventValueChanged];
}

@end

Вы можете настроить изображение для проверяемого / непроверенной, а также IsChecked собственности в атрибуте инспектора визуальной студии.

введите описание изображения здесь

Чтобы добавить CheckBoxButton в раскадровке или XIb, простой надстройкой UIButton и установить пользовательский класс, как на следующем изображении.

введите описание изображения здесь

Кнопка будет отправлять UIControlEventValueChanged событие, каждый раз, когда IsChecked состояние изменяется.

Ответил 31/12/2014 в 13:44
источник пользователем

голоса
6

Я хотел сделать это программно, а также решить проблему, гвоздь область была действительно слишком мала. Это взято из различных источников, включая Майк и комментатор Майка Аг.

В вашем заголовке

@interface YourViewController : UIViewController {
    BOOL checkboxSelected;
    UIButton *checkboxButton;
}

@property BOOL checkboxSelected;;
@property (nonatomic, retain) UIButton *checkboxButton;

-(void)toggleButton:(id)sender;

И в вашей реализации

// put this in your viewDidLoad method. if you put it somewhere else, you'll probably have to change the self.view to something else
// create the checkbox. the width and height are larger than actual image, because we are creating the hit area which also covers the label
UIButton* checkBox = [[UIButton alloc] initWithFrame:CGRectMake(100, 60,120, 44)];  
[checkBox setImage:[UIImage imageNamed:@"checkbox.png"] forState:UIControlStateNormal];
// uncomment below to see the hit area
// [checkBox setBackgroundColor:[UIColor redColor]];
[checkBox addTarget:self action:@selector(toggleButton:) forControlEvents: UIControlEventTouchUpInside];
// make the button's image flush left, and then push the image 20px left
[checkBox setContentHorizontalAlignment:UIControlContentHorizontalAlignmentLeft];
[checkBox setImageEdgeInsets:UIEdgeInsetsMake(0.0, 20.0, 0.0, 0.0)];
[self.view addSubview:checkBox];

// add checkbox text text
UILabel *checkBoxLabel = [[UILabel alloc] initWithFrame:CGRectMake(140, 74,200, 16)];
[checkBoxLabel setFont:[UIFont boldSystemFontOfSize:14]];
[checkBoxLabel setTextColor:[UIColor whiteColor]];
[checkBoxLabel setBackgroundColor:[UIColor clearColor]];
[checkBoxLabel setText:@"Checkbox"];
[self.view addSubview:checkBox];

// release the buttons
[checkBox release];
[checkBoxLabel release];

И поставил этот метод тоже:

- (void)toggleButton: (id) sender
{
    checkboxSelected = !checkboxSelected;
    UIButton* check = (UIButton*) sender;
    if (checkboxSelected == NO)
        [check setImage:[UIImage imageNamed:@"checkbox.png"] forState:UIControlStateNormal];
    else
        [check setImage:[UIImage imageNamed:@"checkbox-checked.png"] forState:UIControlStateNormal];

}
Ответил 21/05/2010 в 17:46
источник пользователем

голоса
4

Всякие код здесь очень длинный, немного грязный, и можно было бы сделать намного проще. У меня есть проект на GitHub этого подкласса UIControl, которые вы можете загрузить и проверить и дает почти родной элемент флажок UI:

https://github.com/Brayden/UICheckbox

Ответил 18/07/2012 в 08:03
источник пользователем

голоса
1

Подкласс UIButton, уронить кнопку для просмотра контроллера, выберите его и изменить имя класса CheckBox в инспекторе идентичности.

#import "CheckBox.h"

@implementation CheckBox

#define checked_icon @"checked_box_icon.png"
#define empty_icon @"empty_box_icon.png"

- (id)initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];
    if (self)
    {
        [self setImage:[UIImage imageNamed:empty_icon] forState:UIControlStateNormal];
        [self addTarget:self action:@selector(didTouchButton) forControlEvents:UIControlEventTouchUpInside];
    }
    return self;
}

- (void)didTouchButton {
    selected = !selected;
    if (selected)
        [self setImage:[UIImage imageNamed:checked_icon] forState:UIControlStateNormal];
    else
        [self setImage:[UIImage imageNamed:empty_icon] forState:UIControlStateNormal];
}

@end
Ответил 13/05/2015 в 11:59
источник пользователем

голоса
1

Я сделал это с UITextField, чтобы избежать ничего странного рисования, но я любил положить внутри как текст клеща Юникод (Unicode Character «галочка» (U + 2713)) для NSString: @ «\ u2713».

Таким образом, в моем файле .h (реализации протокола для «UITextFieldDelegate» в UITextField):

UITextField * myCheckBox;

В моей viewDidLoad или функции для подготовки пользовательского интерфейса:

...
myCheckBox = [[UITextField alloc] initWithFrame:aFrame];
myCheckBox.borderStyle = UITextBorderStyleRoundedRect; // System look like
myCheckBox.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
myCheckBox.textAlignment = NSTextAlignmentLeft;
myCheckBox.delegate = self;
myCheckBox.text = @" -"; // Initial text of the checkbox... editable!
...

Затем добавить селектор событий для ОЗДАНИЯ сенсорного события и вызова события «responseSelected»:

...
UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(checkboxSelected)];
[myCheckBox addGestureRecognizer:tapGesture];
...

Наконец ответить на этот селектор

-(void) checkboxSelected
{
    if ([self isChecked])
    {
        // Uncheck the selection
        myCheckBox.text = @" -";
    }else{
       //Check the selection
       myCheckBox.text = @"\u2713";
    }
}

Функция «IsChecked» только проверяет, если текст является @ «\ u2713» галочка. Чтобы предотвратить показ клавиатуры, когда текстовое поле выбрано использовать событие «textFieldShouldBeginEditing» в UITextField и добавить селектор событий для управления выбором:

-(BOOL)textFieldShouldBeginEditing:(UITextField *)textField
{
    // Question selected form the checkbox
    [self checkboxSelected];

    // Hide both keyboard and blinking cursor.
    return NO;
}
Ответил 07/10/2014 в 12:13
источник пользователем

голоса
1

в файле .h

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController
{
    BOOL isChecked;
    UIImageView * checkBoxIV;
}
@end

И .m файл

- (void)viewDidLoad
{
    [super viewDidLoad];
    isChecked = NO;

    //change this property according to your need
    checkBoxIV = [[UIImageView alloc] initWithFrame:CGRectMake(10, 10, 15, 15)]; 
    checkBoxIV.image =[UIImage imageNamed:@"checkbox_unchecked.png"]; 

    checkBoxIV.userInteractionEnabled = YES;
    UITapGestureRecognizer *checkBoxIVTapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handlecheckBoxIVTapGestureTap:)];
    checkBoxIVTapGesture.numberOfTapsRequired = 1;
    [checkBoxIV addGestureRecognizer:checkBoxIVTapGesture];
}

- (void)handlecheckBoxIVTapGestureTap:(UITapGestureRecognizer *)recognizer {
    if (isChecked) {
        isChecked = NO;
        checkBoxIV.image =[UIImage imageNamed:@"checkbox_unchecked.png"];
    }else{
        isChecked = YES;
        checkBoxIV.image =[UIImage imageNamed:@"checkbox_checked.png"];   
    }
}

Это будет делать трюк ...

Ответил 14/06/2013 в 11:12
источник пользователем

голоса
1

Мне нравится идея Adrian использовать символы, а не образы. Но я не люблю коробку, это нужно только сам галочка (@ «\ u2713»). Я рисую коробку (закругленный ящик) программно и разместить UILabel содержит метку внутри него. Такой способ реализации позволяет легко использовать настраиваемое представление в любом приложении, не заботясь о каком-либо зависимом ресурсе. Вы также можете настроить цвет галочки, закругленную коробку и фон с легкостью. Вот полный код:

#import <UIKit/UIKit.h>

@class CheckBoxView;

@protocol CheckBoxViewDelegate
- (void) checkBoxValueChanged:(CheckBoxView *) cview;
@end

@interface CheckBoxView : UIView {
    UILabel *checkMark;
    bool isOn;
    UIColor *color;
    NSObject<CheckBoxViewDelegate> *delegate;
}
@property(readonly) bool isOn;
@property(assign) NSObject<CheckBoxViewDelegate> *delegate;

- (void) drawRoundedRect:(CGRect) rect inContext:(CGContextRef) context;
@end



#import "CheckBoxView.h"

#define SIZE 30.0
#define STROKE_WIDTH 2.0
#define ALPHA .6
#define RADIUS 5.0

@implementation CheckBoxView
@synthesize isOn, delegate;

- (id)initWithFrame:(CGRect)frame {
    if ((self = [super initWithFrame:CGRectMake(frame.origin.x, frame.origin.y, SIZE, SIZE)])) {
        // Initialization code
    }
    //UIColor *color = [UIColor blackColor];
    color = [[UIColor alloc] initWithWhite:.0 alpha:ALPHA];

    self.backgroundColor = [UIColor clearColor];
    checkMark = [[UILabel alloc] initWithFrame:CGRectMake(STROKE_WIDTH, STROKE_WIDTH, SIZE - 2 * STROKE_WIDTH, SIZE - 2*STROKE_WIDTH)];
    checkMark.font = [UIFont systemFontOfSize:25.];
    checkMark.text = @"\u2713";
    checkMark.backgroundColor = [UIColor clearColor];
    checkMark.textAlignment = UITextAlignmentCenter;
    //checkMark.textColor = [UIColor redColor];
    [self addSubview:checkMark];
    [checkMark setHidden:TRUE];
    isOn = FALSE;
    return self;
}


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
    CGRect _rect = CGRectMake(STROKE_WIDTH, STROKE_WIDTH, SIZE - 2 * STROKE_WIDTH, SIZE - 2*STROKE_WIDTH);
    [self drawRoundedRect:_rect inContext:UIGraphicsGetCurrentContext()];
    [checkMark setHidden:!isOn];
}


- (void)dealloc {
    [checkMark release];
    [color release];
    [super dealloc];
}

- (void) drawRoundedRect:(CGRect) rect inContext:(CGContextRef) context{
    CGContextBeginPath(context);
    CGContextSetLineWidth(context, STROKE_WIDTH);
    CGContextSetStrokeColorWithColor(context, [color CGColor]);
    CGContextMoveToPoint(context, CGRectGetMinX(rect) + RADIUS, CGRectGetMinY(rect));
    CGContextAddArc(context, CGRectGetMaxX(rect) - RADIUS, CGRectGetMinY(rect) + RADIUS, RADIUS, 3 * M_PI / 2, 0, 0);
    CGContextAddArc(context, CGRectGetMaxX(rect) - RADIUS, CGRectGetMaxY(rect) - RADIUS, RADIUS, 0, M_PI / 2, 0);
    CGContextAddArc(context, CGRectGetMinX(rect) + RADIUS, CGRectGetMaxY(rect) - RADIUS, RADIUS, M_PI / 2, M_PI, 0);
    CGContextAddArc(context, CGRectGetMinX(rect) + RADIUS, CGRectGetMinY(rect) + RADIUS, RADIUS, M_PI, 3 * M_PI / 2, 0);
    CGContextClosePath(context);
    CGContextStrokePath(context);
}

#pragma mark Touch
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event{
    UITouch *touch = [touches anyObject];
    CGPoint loc = [touch locationInView:self];
    if(CGRectContainsPoint(self.bounds, loc)){
        isOn = !isOn;
        //[self setNeedsDisplay];
        [checkMark setHidden:!isOn];
        if([delegate respondsToSelector:@selector(checkBoxValueChanged:)]){
            [delegate checkBoxValueChanged:self];
        }
    }
}
Ответил 23/07/2010 в 10:41
источник пользователем

голоса
0

Я сделал один недавно. Бесплатно получить от GitHub. Смотрите , если это поможет. Эффект подобен

введите описание изображения здесь

Ответил 01/04/2019 в 20:36
источник пользователем

голоса
0

Пользователь Аруна Lakmal; FYI, когда вы добавляете этот код в IB, как вы описываете initWithFrame не называется, initWithCoder есть. Реализовать initWithCoder и он будет работать, как вы описываете.

Ответил 20/01/2013 в 04:15
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more