XLForm

Published on Thursday, 6 April 2017

https://github.com/xmartlabs/XLForm

XLForm is the most flexible and powerful iOS library to create dynamic table-view forms. The goal of the library is to get the same power of hand-made forms but spending 1/10 of the time.

Image

Add an image to the left of a form input

row = [XLFormRowDescriptor formRowDescriptorWithTag:@"fullname" rowType:XLFormRowDescriptorTypeText];
[row.cellConfigAtConfigure setObject:@"Full Name" forKey:@"textField.placeholder"];
[row.cellConfigAtConfigure setObject:[UIImage imageNamed:@"User"] forKey:@"imageView.image"];
[section addFormRow:row];

Buttons

XLFormRowDescriptor *buttonRow = [XLFormRowDescriptor formRowDescriptorWithTag:kButton rowType:XLFormRowDescriptorTypeButton title:@"A 6 digit verification code has been sent via SMS"];
[buttonRow.cellConfig setObject:[UIColor purpleColor] forKey:@"textLabel.color"];
[buttonRow.cellConfig setObject:[UIFont fontWithName:kFont size:10] forKey:@"textLabel.font"];
buttonRow.cellStyle = UITableViewCellStyleValue1;
buttonRow.value = @"Enter Code";
buttonRow.action.formSelector = @selector(didTouchButton:);
[section addFormRow:buttonRow];

Screenshot

Register


Switch

To turn the switch on

row = [XLFormRowDescriptor formRowDescriptorWithTag:@"switch" rowType:XLFormRowDescriptorTypeBooleanSwitch title:@"Boolean"];
row.value = @1;

Issues

I raised an issue about the Floating Label covering the Image.

Register - JVFloatLabeledTextField (2)

A very quick reply to update

- (NSArray *)layoutConstraints

I added the following:

const static CGFloat kHMargin = 50.0f;

NSDictionary \*metrics = @{@"vMargin":@(kVMargin), @"hMargin":@(kHMargin)};

[result addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(hMargin)-[floatLabeledTextField]-|" options:0 metrics:metrics views:views]];

Register - JVFloatLabeledTextField (4)


Cell Separator

Add in 'viewDidLoad'

self.tableView.separatorColor = [UIColor redColor];

Register - JVFloatLabeledTextField (5)


Section Background Colour

I wished to change the Header/Footer background colour.

Code

- (void)viewDidLoad {
    [[self tableView] registerClass:[UITableViewHeaderFooterView class] forHeaderFooterViewReuseIdentifier:@"headerFooterReuseIdentifier"];
}

Header

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    UITableViewHeaderFooterView *headerFooterView = [[self tableView] dequeueReusableHeaderFooterViewWithIdentifier:@"headerFooterReuseIdentifier"];
    headerFooterView.contentView.backgroundColor = kBackgroundColor;

    return headerFooterView;
}

Footer

-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section {
    UITableViewHeaderFooterView *headerFooterView = [[self tableView] dequeueReusableHeaderFooterViewWithIdentifier:@"headerFooterReuseIdentifier"];
    headerFooterView.contentView.backgroundColor = kBackgroundColor;

    return headerFooterView;
}

FloatLabeledTextFieldCell

Floating Label

There is a property on the TextField you can set to change the colour of the Floating Label

  • floatingLabelActiveTextColor
[row.cellConfig setObject:[UIColor redColor] forKey:@"floatLabeledTextField.floatingLabelActiveTextColor"];

TextField

If you want to change the TextField text colour:

[row.cellConfig setObject:[UIColor whiteColor] forKey:@"floatLabeledTextField.textColor"];

Register - JVFloatLabeledTextField (5)

Didn't change anything:

[row.cellConfig setObject:[UIColor greenColor] forKey:@"textLabel.highlightedTextColor"];

Or

[row.cellConfig setObject:[UIColor redColor] forKey:@"floatLabeledTextField.floatingLabel.textColor"];

Image

Set the "imageView.tintColor"

[row.cellConfigAtConfigure setObject:[UIColor whiteColor] forKey:@"imageView.tintColor"];

Register - JVFloatLabeledTextField (6)


Accessory

- (UIView *)inputAccessoryViewForRowDescriptor:(XLFormRowDescriptor *)rowDescriptor
{
      return nil; //will hide it completely
      // You can use the rowDescriptor parameter to hide/customize the accessory view for a particular rowDescriptor type.
}

Without reading the documentation!!

Adding a Checkmark

XLFormRowDescriptor *row = [XLFormRowDescriptor formRowDescriptorWithTag:@"Check" rowType:XLFormRowDescriptorTypeBooleanCheck title:NSLocalizedString(@"Check", nil)];
[newSection addFormRow:row];

Swap to a different image

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Circle"]];
imageView.tintColor = [UIColor redColor];
[row.cellConfig setObject:imageView forKey:@"accessoryView"];

Now to handle the toggling...

This method isn't being called.

- (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath {
    NSLog(@"Tapped");
}

Dynamically Adding Rows

I'm using segues to move between views.

I'm setting a property - an array of items in the 'prepareForSegue'.

But 'initWithCoder' doesn't have these values set yet.

'viewDidLoad' does so call a method there.

Create your Form, Section(s) and Row(s) in the interface and use them:

[section addFormRow:row beforeRow:buttonRow];

Selected Row Label colour

Tried a couple of options:

[row.cellConfig setObject:[UIColor redColor] forKey:@"textLabel.highlightedTextColor"];

And

[row.cellConfig setObject:[UIColor redColor] forKey:@"textLabel.tintColor"];

Change the cursor colour

  • textField.tintColor
[row.cellConfig setObject:[UIColor greenColor] forKey:@"textField.tintColor"];

Register - JVFloatLabeledTextField (7)



Alternatives

Wordpress Original Link