CODEWITHSUNDEEP
iosiphonexcodestoryboardautolayout
user2526811
user2526811

Reputation: 1253

Autolayout issue for width equally in iOS iPhone

I have three views as subview as shown below with equal width & height constraint

enter image description here

If view B has no data then it should show as below enter image description here

My try If iset B's width as zero then all views width will be zero.

How to get this?

Thank you

Upvotes: 6

Views: 198

Answers (4)

Inder Kumar Rathore
Inder Kumar Rathore

Reputation: 39988

What can you do is add a width constraint to it (middle one) and make is less than 2000 with priority(1000) greater than equal width(750)

Now make an outlet and the the constant of with constraint(<2000) to zero.

You can find the sample here.

Why I have set the 2000 is because this constraint is only needed to zero the width. It shouldn't affect the width if the width is non-zero. Now as the width are equally (middle view) and it should be less than 2000 thus the view displays equally on the screen. And when I set the width constraint to zero the width of the middle view becomes zero as it's priority is higher than the equal widths.

enter image description here


This code sets the width of middle view to zero.

- (IBAction)btnClick:(id)sender {
  self.widthView2.constant = 0;
}

Output:

enter image description here

Upvotes: 3

Yuyutsu
Yuyutsu

Reputation: 2527

Download the code: set constraints as per your requirements. Click to Download

create NSLayoutConstraint _distance_ViewA_ViewC variable for distance between ViewA to ViewC

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    //when viewB is hidden remove the comments
    _distance_ViewA_ViewC.constant = 8.0f;
    _viewB.hidden = true;

}

OutPut

For viewA, viewB, viewC


enter image description here

enter image description here

for viewA, ViewC and viewB is hidden

enter image description here enter image description here

Upvotes: 0

rob mayoff
rob mayoff

Reputation: 385980

First, make sure your equal-width constraints are set up like this:

A.width == B.width
A.width == C.width

And not like this:

A.width == B.width
C.width == B.width

That is, make sure view B is only involved in one equal-width constraint.

Next, make outlets connected to view B and to the equal-width constraint on view B.

@property (nonatomic, strong) IBOutlet UIView *viewB;
@property (nonatomic, strong) IBOutlet NSLayoutConstraint *bEqualWidthConstraint;

To connect the constraint outlet, you'll need to find the constraint in the storyboard outline. It'll be one of the constraints on the nearest common ancestor of A and B; it won't be on A or B directly. When you find it in the storyboard outline, you can control-drag from it to the outlet in your source code (or you can create a new outlet by control-dragging to anywhere in your @interface).

Add another property to hold another constraint setting B's width to zero:

@property (nonatomic, strong) NSLayoutConstraint *bZeroWidthConstraint;

Initialize bZeroWidthConstraint but don't install it:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.bZeroWidthConstraint = [NSLayoutConstraint
        constraintWithItem:self.viewB attribute:NSLayoutAttributeWidth
        relatedBy:NSLayoutRelationEqual
        toItem:nil attribute:NSLayoutAttributeNotAnAttribute
        multiplier:0 constant:0];
}

When you want to hide view B, uninstall bEqualWidthConstraint and install bZeroWidthConstraint.

On iOS 8.0, you can uninstall a constraint by setting its active property to NO, but on earlier versions, you have to send a message to the view on which the constraint is installed. That's normally the nearest common ancestor of the constrained views. Assuming the common ancestor of A and B is viewB.superview:

- (void)hideB {
    [self.viewB.superview removeConstraint:self.bEqualWidthConstraint];
    [self.viewB addConstraint:self.bZeroWidthConstraint];
}

Note that since bZeroWidthConstraint only constrains view B, you can install it directly on view B.

When you want to show view B again, uninstall bZeroWidthConstraint and reinstall bEqualWidthConstraint:

- (void)showB {
    [self.viewB removeConstraint:self.bZeroWidthConstraint];
    [self.viewB.superview addConstraint:self.bEqualWidthConstraint];
}

Upvotes: 2

danialzahid94
danialzahid94

Reputation: 4223

Firstly, you need to understand that you can give priorities to different constraints in iOS. By default the priority is 1000, which is highest.

Now, you need to give your equalWidth constraints a priority of 750. Secondly, you need to apply horizontal spacing from ViewA to ViewB, and ViewB to ViewC. Ideally the constant for the horizontal spacing should be 0, which will make the sides of the three views stick together.

And now, when you make the width for ViewB equal to 0, your ViewA and ViewC will take up all the space, with equal widths and ViewB will vanish.

Please let me know if you have any confusion in this.

Upvotes: 1

Related Questions