ScrollView Auto Layout for SignUp in 600*600 wCompact hCompact

UIScrollView, UITextField, NSNotificationCenter, UITapGestureRecognizer, PassData

In storyboard click on wCompact hCompact

Select Top Left side first four Block

Add ScrollView X = 0, Y = 0, 600*600 and add below pin

ScrollView Auto Layout for SignUp1

Add UIView X = 0, Y = 0, 600*600 and set below pin

ScrollView Auto Layout for SignUp2

Control + click Drag and drop View to ScrollView Add below constraints

ScrollView Auto Layout for SignUp3

Add view on First view X = 0, Y = 0, 600*50 and add below pin

ScrollView Auto Layout for SignUp4

Control + click Drag and drop view to first view select equal height constraints

ScrollView Auto Layout for SignUp5

go to show size inspector click on Equal Height double click on that

add multiplier 50/600

ScrollView Auto Layout for SignUp6

Add view on First view X = 0, Y = 50, 600*500 and add below pin

ScrollView Auto Layout for SignUp7

Control + click Drag and drop view to first view select equal height constraints

ScrollView Auto Layout for SignUp8

go to show size inspector click on Equal Height double click on that

add multiplier 500/600

ScrollView Auto Layout for SignUp9

Add view on First view X = 0, Y = 550, 600*50 and add below pin

ScrollView Auto Layout for SignUp10

View Differanceat with top view, middle view and bottom view for batter understanding

add label (horizontally centre and vertically centre) on top view with text Sign Up

ScrollView Auto Layout for SignUp11

Control + click Drag and drop label to view and set below constraints

ScrollView Auto Layout for SignUp12

Add one view on middle view X = centre horizontally, Y = 0, 50*50

Control + click Drag and drop inside view and select Aspect Ratio

ScrollView Auto Layout for SignUp13

Control + click Drag and drop view to Middle view add below Constraints

ScrollView Auto Layout for SignUp14

go to show size inspector click on Equal Height double click on that

add multiplier 50/500

ScrollView Auto Layout for SignUp15

Add pin on top with middle view

ScrollView Auto Layout for SignUp16

Add one UITextField X = centre horizontally, Y = 50, 400*40

Add below pin with (in middle) first view

ScrollView Auto Layout for SignUp17

ScrollView Auto Layout for SignUp18

Control + click Drag and drop textfield to Middle view add below Constraints

ScrollView Auto Layout for SignUp19

go to show size inspector click on Equal Width double click on that

add multiplier 400/600

ScrollView Auto Layout for SignUp20

go to show size inspector click on Equal Height double click on that

add multiplier 40/500

ScrollView Auto Layout for SignUp21

Add view X = centre horizontally, Y= 90, 50*50 below textfield

Add below pin with (in middle view) first textfield

ScrollView Auto Layout for SignUp22

ScrollView Auto Layout for SignUp23

Control + click Drag and drop view to (in middle view) first view add below Constraints

ScrollView Auto Layout for SignUp24

Add one UITextField X = centre horizontally, Y = 140, 400*40

Add below pin with (in middle) Second view

ScrollView Auto Layout for SignUp25

ScrollView Auto Layout for SignUp26

Control + click Drag and drop Textfield to (in middle view) first textfield add below constraints

ScrollView Auto Layout for SignUp27

Now add another view and set pin and constraints like (in middle view) Second view

then add another textfield and set pin and constraints like (in middle view) Second textfield

if you change first view height or width it will automatically effect to all view

if you change first textfield height or width it will automatically effect to all textfield

adjust all view and textfield (last view to bottom view distance should be zero ro else set whatever need)

last view set bottom constraints to middle view

ScrollView Auto Layout for SignUp28

remove constraints which is not highlight

bottom view add view X = centre horizontally, Y = Centre vertically, 200*50 inside bottom view (because want to set first button on  X = 1/4 and second button Y = (1/4)*3 if button width == 100 ) and add below Constraints

ScrollView Auto Layout for SignUp29

go to show size inspector click on Equal Width double click on that

add multiplier 200/600

ScrollView Auto Layout for SignUp30

Add submit button X = 100, Y = centre vertically in bottom view, 100*30

Add below pin to button

ScrollView Auto Layout for SignUp31

Control + click Drag and drop button to (in bottom view) view and add below constraints

ScrollView Auto Layout for SignUp32

go to show size inspector click on Equal Width double click on that

add multiplier 100/600

ScrollView Auto Layout for SignUp33

go to show size inspector click on Equal Height double click on that

add multiplier 30/50

ScrollView Auto Layout for SignUp34

Add Cancel button X = 400, Y = centre vertically in bottom view, 100*30

Add below pin to button

ScrollView Auto Layout for SignUp35

Control + click Drag and drop cancel button to submit button and add below Constraints

ScrollView Auto Layout for SignUp36

Set Place holder First Name, Last Name, Phone Number, City

Set tag for all TextField

Set delegate for all Textfield

ViewController.h

#import “NewViewController.h”

#import “UserDetailDataModel.h”

<UITextFieldDelegate>

@property (weak, nonatomic) IBOutlet UITextField *textFieldCurrent;

@property (weak, nonatomic) IBOutlet UITextField *textFieldFirstName;

@property (weak, nonatomic) IBOutlet UITextField *textFieldLastName;

@property (weak, nonatomic) IBOutlet UITextField *textFieldPhoneNumber;

@property (weak, nonatomic) IBOutlet UITextField *textFieldCity;

@property (weak, nonatomic) IBOutlet UIScrollView *scrollViewSignUp;

ViewController.m

– (void)viewDidLoad {

    [super viewDidLoad];

    

    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];

    

    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];

    

    

    UITapGestureRecognizer *aGest = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapDetected)];

    aGest.numberOfTapsRequired = 1;

    [self.view addGestureRecognizer:aGest];

    // Do any additional setup after loading the view, typically from a nib.

}

-(void)viewWillDisappear:(BOOL)animated

{

    [super viewWillDisappear:animated];

    

    [[NSNotificationCenter defaultCenter] removeObserver:self

                                                    name:UIKeyboardWillShowNotification

                                                  object:nil];

    

    [[NSNotificationCenter defaultCenter] removeObserver:self

                                                    name:UIKeyboardWillHideNotification

                                                  object:nil];

}

– (IBAction)buttonActionSubmit:(id)sender

{

    NSLog(@”buttonActionSubmit”);

    

    UserDetailDataModel *aUserDetailDataModel = [UserDetailDataModel new];

    aUserDetailDataModel.FirstName = self.textFieldFirstName.text;

    aUserDetailDataModel.LastName = self.textFieldLastName.text;

    aUserDetailDataModel.PhoneNumber = self.textFieldPhoneNumber.text;

    aUserDetailDataModel.City = self.textFieldCity.text;

    

    NewViewController *aNewViewController = [self.storyboard instantiateViewControllerWithIdentifier:@”NewViewController”];

    aNewViewController.bUserDetailDataModel = aUserDetailDataModel;

    [self.navigationController pushViewController:aNewViewController animated:YES];

}

– (IBAction)buttonActionCancel:(id)sender

{

    NSLog(@”buttonActionCancel”);

    [self resetAllTextField];

}

– (void)resetAllTextField

{

    self.textFieldFirstName.text = nil;

    self.textFieldLastName.text = nil;

    self.textFieldPhoneNumber.text = nil;

    self.textFieldCity.text = nil;

}

#pragma mark – Gester method

– (void)tapDetected {

    

    [self.textFieldCurrent resignFirstResponder];

    

}

#pragma mark – UIKeyboard show/hide notification

– (void)keyboardWillShow:(NSNotification *)iNotification {

    

    NSLog(@”%f”, [iNotification.userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue].size.height);

    

    NSDictionary *aKeyInfo = iNotification.userInfo;

    NSValue *aRectValue = [aKeyInfo valueForKey:UIKeyboardFrameBeginUserInfoKey];

    CGRect aRect = [aRectValue CGRectValue];

    

    if (self.textFieldCurrent.tag == 3 || self.textFieldCurrent.tag == 4)

    {

        self.scrollViewSignUp.contentOffset = CGPointMake(0, (aRect.size.height) – ([UIScreen mainScreen].bounds.size.height / 5.3));

    }

    

}

– (void)keyboardWillHide:(NSNotification *)iNotification  {

    

    self.scrollViewSignUp.contentOffset = CGPointMake(0, 0);

    

}

#pragma mark – UITextField delegate

– (BOOL)textFieldShouldReturn:(UITextField *)textField {

    

    [textField resignFirstResponder];

    return YES;

    

}

– (void)textFieldDidBeginEditing:(UITextField *)textField {

    

    self.textFieldCurrent = textField;

    

}

NewViewController.h

#import “UserDetailDataModel.h”

#import “Utility.h”

@property (strong, nonatomic) UserDetailDataModel *bUserDetailDataModel;

NewViewController.m

– (void)viewDidLoad {

    [super viewDidLoad];

    

    NSLog(@”%@”,self.bUserDetailDataModel);

    NSLog(@”%@”,[self.bUserDetailDataModel asMutableDictionaryUserDetailDataModel]);

    NSLog(@”%@”,[Utility descriptionForObject:self.bUserDetailDataModel]);

    // Do any additional setup after loading the view.

}

UserDetailDataModel.h

#import <Foundation/Foundation.h>

@interface UserDetailDataModel : NSObject

@property (strong, nonatomic) NSString *FirstName;

@property (strong, nonatomic) NSString *LastName;

@property (strong, nonatomic) NSString *PhoneNumber;

@property (strong, nonatomic) NSString *City;

– (NSMutableDictionary *)asMutableDictionaryUserDetailDataModel;

@end

UserDetailDataModel.m

#import “UserDetailDataModel.h”

@implementation UserDetailDataModel

– (NSMutableDictionary *)asMutableDictionaryUserDetailDataModel

{

    NSMutableDictionary *aDictionaryUserDetailDataModel = [NSMutableDictionary new];

    [aDictionaryUserDetailDataModel setObject:(self.FirstName == nil ? @””:self.FirstName) forKey:@”FirstName”];

    [aDictionaryUserDetailDataModel setObject:(self.LastName == nil ? @””:self.LastName) forKey:@”LastName”];

    [aDictionaryUserDetailDataModel setObject:(self.PhoneNumber == nil ? @””:self.PhoneNumber) forKey:@”PhoneNumber”];

    [aDictionaryUserDetailDataModel setObject:(self.City == nil ? @””:self.City) forKey:@”City”];

    

    return aDictionaryUserDetailDataModel;

}

@end

Utility.h

#import <Foundation/Foundation.h>

@interface Utility : NSObject

+(NSString *)descriptionForObject:(id)objct;

@end

Utility.m

#import “Utility.h”

#import <objc/message.h>

@implementation Utility

+(NSString *)descriptionForObject:(id)objct

{

    unsigned int varCount;

    NSMutableString *descriptionString = [[NSMutableString alloc]init];

    

    objc_property_t *vars = class_copyPropertyList(object_getClass(objct), &varCount);

    

    for (int i = 0; i < varCount; i++)

    {

        objc_property_t var = vars[i];

        

        const char* name = property_getName (var);

        

        NSString *keyValueString = [NSString stringWithFormat:@”n%@ = %@”,[NSString stringWithUTF8String:name],[objct valueForKey:[NSString stringWithUTF8String:name]]];

        [descriptionString appendString:keyValueString];

    }

    

    free(vars);

    return descriptionString;

}

@end

Click here to download ScrollView Auto Layout for SignUp in 600*600 wCompact hCompact Sample Project

 

 

Leave a comment