Are you speechless when you look at the prototype? Huihe is only to show the content of ingredients and whether to check, and self-purchase not only need to display these contents, but also need to input text content and check options operation!

For this kind of, we need to calm down and deal with it calmly first, and communicate with the product whether it can be changed to two interfaces, if it can not be changed, we can only adapt to this situation, now we will buy the interface, the following use MVC design mode to analyze!

##Step1: add the value of text input box valueStr to Model and check whether bool is selected. PS: When the keyboard is not touched, the text input field defaults to the value of the last parameter

#import <Foundation/Foundation.h>@interface XHHPremixModel : NSObject @property (nonatomic, copy) NSString *id; // index @property (nonatomic, copy) NSString *name; // assign component @property (nonatomic, assign)floatvalue; @property (nonatomic, copy) NSString *valueStr; // unit @property (nonatomic, copy) NSString *unit; // Check @property (nonatomic, assign, getter=isSelected) BOOL selected; + (NSArray *)loadPremixInfoFromJson:(NSArray *)array; @endCopy the code
#import "XHHPremixModel.h"
#import "MJExtension.h"

@implementation XHHPremixModel

+ (NSArray *)loadPremixInfoFromJson:(NSArray *)array {
    
    return [self objectArrayWithKeyValuesArray:array].copy;
}

- (NSString *)valueStr {
    
    if ([_valueStr isEqual:[NSNull null]] || _valueStr == nil) {
        _valueStr = [NSString stringWithFormat:@"%.2f", _value];
    }
    
    return _valueStr;
}

@end
Copy the code

##Step2: check whether it is a text input box type or a check item type and create it.

The core code is extracted below: 2.1 What is discussed with the background here is whether 1 is returned through the unit value unit.1 is the check item type, and the other is the text input box type. Set the child control position to pay attention to the display of both.

- (void)layoutSubviews { [super layoutSubviews]; // Set the position of the child control [self setupFrame]; } // Set the child control position - (void)setupFrame {if ([self.model.unit isEqualToString:@"1"]) {
        
        self.elementTextField.hidden = YES;
        self.selectImg.hidden = NO;
    } else{ self.elementTextField.hidden = NO; self.selectImg.hidden = YES; }}Copy the code

2.2 In model assignment, remember to judge: When it is a checked item, valueStr of the assignment text input box is 1 in the selected state, and the selected picture is replaced; In the unselected state, the assignment text input box valueStr is 0, and the unselected image is replaced.

// Model assignment - (void)setModel:(XHHPremixModel *)model {
    
    _model = model;
    
    self.norm.text = model.name;
    self.elementTextField.text = [NSString stringWithFormat:@"%.2f%@", model.value, model.unit];
    
    if ([model.unit isEqualToString:@"1"] {// Check item typeif(model.selected == YES) {// Select model.valuestr = @"1";
            self.selectImg.image = [UIImage imageNamed:@"xz"];
        } else {
            model.valueStr = @"0";
            self.selectImg.image = [UIImage imageNamed:@"wx"]; }}}Copy the code

2.3 Text input box type assignment


#pragma mark- UITextFieldDelegate

- (BOOL)textFieldShouldReturn:(UITextField *)textField {
    if (textField == self.elementTextField) {
        [self.elementTextField resignFirstResponder];
    }
    return YES;
}

- (void)textFieldDidEndEditing:(UITextField *)textField {
    
    self.elementTextField.text = textField.text;
    self.model.valueStr = [NSString stringWithFormat:@"% @", textField.text];

    XHHLog(@"Input component %@", self.elementTextField.text); } / / limit two decimal places - (BOOL) textField: (UITextField at *) textField shouldChangeCharactersInRange (NSRange) range replacementString:(NSString *)string {if ([textField.text containsString:@"."]) {
        if ([string isEqualToString:@"."]) return NO;
        NSRange rangeOfPoint = [textField.text rangeOfString:@"."];
        if (range.location > rangeOfPoint.location + 2) return NO;
    }
    
    return YES;
}
Copy the code

PS: Because the interface contains check items, do not close the keyboard operation in the cell, which will affect the check operation! In other words, don’t set this method: touchesBegan:(NSSet *) Touches withEvent:(UIEvent *) Event, which exits when the current row is selected in the controller.

##Step3: click operation and data echo in Controller

3.1 Selecting and Folding the keyboard Operation At this time, gesture method cannot be used to make the view exit the editing state (folding the keyboard), or because the interface contains the check items, there will be gesture conflict phenomenon.

// Select the current row - (void)tableView (UITableView *)tableView didSelectRowAtIndexPath (NSIndexPath *)indexPath {XHHPremixModel *model = self.list[indexPath.row]; // Handle checkability problem, select the value of 1if ([model.unit isEqualToString:@"1"] {// Select model.selected =! model.selected; [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationFade]; } // Exit the editing state (close the keyboard) [self.view endEditing:YES]; }Copy the code

3.2 Checking reading Data In the output, the originally checked values in the display model can be traversed in the request for reading List data, and the background protocol is. When value is 0, the state is not selected, and other values are selected.

NSArray *currentPageArray = [XHHPremixModel loadPremixInfoFromJson:json[@"data"] [@"list"]]. [weakSelf.list addObjectsFromArray:currentPageArray]; // Iterate over the previously checked values in the display modelfor (XHHPremixModel *model in currentPageArray) {
    if(model.value ! = 0) { model.selected = YES; }else{ model.selected = NO; }}Copy the code

This article is only to introduce ideas, after all, such APP strange page is very few, iOS even less!