Getting proper centering/spacing for multiple UIButton's in obj-c programatically

Question

solution: add them to a uistackview and hope and pray that code on the internet ends up looking good, in this case it did. edit; seems like the spacing doesnt really work though when adding another (not proper spaced, will update if i figure it out)

    if (self) {
        //CGFloat width = [UIScreen mainScreen].bounds.size.width;
     //CGPoint point = [self convertPoint:self.center fromView:self.superview];

        // button 1
        UIImage *bugImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/Bug.png", kSelfBundlePath]];
         //UIButton *bugbutton = [[UIButton alloc] initWithFrame:CGRectMake(point.x+(width/4),point.y, 70, 70)];
            UIButton *bugbutton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 70, 70)];
    [bugbutton setImage:bugImage forState:UIControlStateNormal];
    [bugbutton addTarget:self action:@selector(bugButton) forControlEvents:UIControlEventTouchUpInside];
        [bugbutton.heightAnchor constraintEqualToConstant:100].active = true;
     [bugbutton.widthAnchor constraintEqualToConstant:100].active = true;
  //  [self addSubview:bugbutton];


        //button 2
        UIImage *paypalImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/Paypal.png", kSelfBundlePath]];
       //UIButton *paypalbutton = [[UIButton alloc] initWithFrame:CGRectMake(point.x+(width/8),point.y, 70, 70)];
            UIButton *paypalbutton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 70, 70)];
    [paypalbutton setImage:paypalImage forState:UIControlStateNormal];
    [paypalbutton addTarget:self action:@selector(paypalButton) forControlEvents:UIControlEventTouchUpInside];

     [paypalbutton.heightAnchor constraintEqualToConstant:100].active = true;
    [paypalbutton.widthAnchor constraintEqualToConstant:100].active = true;
  //  [self addSubview:paypalbutton];

        //button 3
        UIImage *btcImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/bitcoin.png", kSelfBundlePath]];
      //UIButton *btcbutton = [[UIButton alloc] initWithFrame:CGRectMake(point.x+(width/16),point.y, 70, 70)];
        UIButton *btcbutton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 70, 70)];
        [btcbutton setImage:btcImage forState:UIControlStateNormal];
        //[btcbutton setTitle:@"Send BTC" forState:UIControlStateNormal];
        //[btcbutton.titleLabel setTextAlignment: NSTextAlignmentCenter];
        [btcbutton addTarget:self action:@selector(btcButton) forControlEvents:UIControlEventTouchUpInside];
        [btcbutton.heightAnchor constraintEqualToConstant:100].active = true;
     [btcbutton.widthAnchor constraintEqualToConstant:100].active = true;
    //  [self addSubview:btcbutton];

        //Stack View
    UIStackView *stackView = [[UIStackView alloc] init];

    stackView.axis = UILayoutConstraintAxisHorizontal;
    stackView.distribution = UIStackViewDistributionEqualSpacing;
    stackView.alignment = UIStackViewAlignmentCenter;
    stackView.spacing = 60;

    [stackView addArrangedSubview:bugbutton];
     [stackView addArrangedSubview:paypalbutton];
     [stackView addArrangedSubview:btcbutton];

     stackView.translatesAutoresizingMaskIntoConstraints = false;
     [self addSubview:stackView];
    }

so currently I have two buttons with appear in a custom button cell, they work pretty well except for the fact they overlap.

I want them to space evenly from the center (and would prefer if I could implement it in a way that would allow me to add/remove buttons without ruining the spacing).

Found a piece of code that looks like it does what I want it to but I can't seem to get it working, pretty new to coding so not sure if it's because I've written it in wrong

button.center = [self convertPoint:self.center fromView:self.superview];

Any suggestions on how I can go about this? Here's what I have below , thanks for any ideas/help

 - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(id)reuseIdentifier specifier:(id)specifier {
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier specifier:specifier];



    if (self) {

        // buttons
                UIImage *bugImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/Bug.png", kSelfBundlePath]];
    UIButton *bugbutton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 70, 70)];
[bugbutton setImage:bugImage forState:UIControlStateNormal];
[bugbutton addTarget:self action:@selector(bugButton) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:bugbutton];
    bugbutton.center = [self convertPoint:self.center fromView:self.superview];


    UIImage *paypalImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/Paypal.png", kSelfBundlePath]];
    UIButton *paypalbutton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 70, 70)];
[paypalbutton setImage:paypalImage forState:UIControlStateNormal];
[paypalbutton addTarget:self action:@selector(paypalButton) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:paypalbutton];
    paypalbutton.center = [self convertPoint:self.center fromView:self.superview];


    }

    return self;
     }

     - (instancetype)initWithSpecifier:(PSSpecifier *)specifier {
    return [self initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"harpButtonCell" specifier:specifier];
     }

Do not duplicate your own question http://stackoverflow.com/questions/42730753/custom-cell-with-three-buttons-with-icon-in-objective-c - _edit_ the earlier question so that it is a decent question. — matt, Mar 11 '17 at 16:14
Interestingly, you received a perfectly good answer when you posed this question previously: http://stackoverflow.com/a/42731390/341994 But instead of listening or trying to understand, you ask again. — matt, Mar 11 '17 at 16:32
@matt obviously im new & stupid enough to be confused, thanks for trying to make me feel worse i guess — user286152, Mar 11 '17 at 16:37

matt · Accepted Answer · 2017-03-11T16:29:56.433

2

Your image of what you would like is an arrangement that is easily created by using a UIStackView with .equalSpacing distribution. No code needed, except to pin or otherwise position the stack view.

The result works on different screen sizes:

edited Mar 11 '17 at 16:29

answered Mar 11 '17 at 16:18

matt

515,959
87
875
1,141

I'm writing this in atom, not using whatever mockup app that is. I am looking into how to make a UIStackView now, thanks for contributing – user286152 Mar 11 '17 at 16:26
No "mockup app" involved. I'm just showing you what a stack view is. – matt Mar 11 '17 at 16:30
@matt if not was coding, it is great solution :) +1 for you – nikdange_me Mar 11 '17 at 16:40
1

@nikdange_me The stack view can be created and positioned _in code_, thus allowing the buttons (also created and added in code) to be distributed _automatically_. I didn't show that in my answer because I was just showing what a stack view _is_. – matt Mar 11 '17 at 16:51
@matt i knew about stackview but never implemented stack view practically, can you suggest any tut you reffered?? – nikdange_me Mar 11 '17 at 17:03

nikdange_me · Answer 2 · 2017-03-11T16:53:37.987

1

I think you should specify x position then;

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(id)reuseIdentifier specifier:(id)specifier {
            self = [super initWithStyle:style reuseIdentifier:reuseIdentifier specifier:specifier];

if (self) {
     CGFloat width = [UIScreen mainScreen].bounds.size.width;
     CGPoint point = [self convertPoint:self.center fromView:self.superview];

     UIImage *bugImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/Bug.png", kSelfBundlePath]];
     UIButton *bugbutton = [[UIButton alloc] initWithFrame:CGRectMake(point.x+(width/4),point.y, 70, 70)];
     [bugbutton setImage:bugImage forState:UIControlStateNormal];
     [bugbutton addTarget:self action:@selector(bugButton) forControlEvents:UIControlEventTouchUpInside];
     [self addSubview:bugbutton];

     UIImage *paypalImage = [[UIImage alloc] initWithContentsOfFile:[NSString stringWithFormat:@"%@/Paypal.png", kSelfBundlePath]];
     UIButton *paypalbutton = [[UIButton alloc] initWithFrame:CGRectMake(frame.size.width-(width/4), point.y, 70, 70)];
     [paypalbutton setImage:paypalImage forState:UIControlStateNormal];
     [paypalbutton addTarget:self action:@selector(paypalButton) forControlEvents:UIControlEventTouchUpInside];
     [self addSubview:paypalbutton];
     }
return self;
}

edited Mar 11 '17 at 16:53

answered Mar 11 '17 at 16:29

nikdange_me

2,949
2
16
24

one error im still struggling with , any idea? error: no viable conversion from 'CGPoint' to 'CGRect' ...CGRect frame = [self convertPoint:self.center fromView:self.superview]; – user286152 Mar 11 '17 at 16:49
it kinda works, it compiled & moves them in different place which is basically what I wanted, and I think it could be made to work for proper spacing if theres a better way to set the X so i think i should be able to make it work eventually, thanks & if you know a way to set the X so that they will show up spaced properly, feel free to share because currently I'm toying around with the "width/number" part :P – user286152 Mar 11 '17 at 17:07
sure.. i will post answer again but not now .. but still dont be depend on me.. you work on it & inform me if you get any! will be happy to know :) @user286152 – nikdange_me Mar 11 '17 at 17:12
ended up using a uistackview, somehow it ended up working ill post the updated solution code in a sec but heres the link i used https://stackoverflow.com/questions/30728062/add-views-in-uistackview-programmatically ,just trying to center it and stuff before i update – user286152 Mar 11 '17 at 17:19
updated with solution, thanks for the kind vibes and help, hope you have a good day! – user286152 Mar 11 '17 at 17:30
As long answering to kind the question, you have asked! don't you think you should have accept this answer! he introduced you to stack view not answer you! Your Choice ;) – nikdange_me Mar 11 '17 at 21:50

Getting proper centering/spacing for multiple UIButton's in obj-c programatically

2 Answers2