iOS: change the height of UISegmentedcontrol

Question

I am trying to change the height of UISegmentedcontrol, but it is not allowed in the Interface Builder. Is there any way to change or it is impossible?

Thanks

score 148 · Answer 1 · edited Aug 01 '14 at 08:34

148

Adding a constraint in IB will also do the trick:

Constraint in IB

edited Aug 01 '14 at 08:34

The Paramagnetic Croissant

9,223
3
25
38

answered Jul 11 '13 at 20:19

Ji Fang

3,288
1
21
18

How do you add "blue" constraints – Van Du Tran Dec 06 '13 at 23:13
1

Select the Segmented Control in the XIB, Editor->Pin->height – Ji Fang Dec 06 '13 at 23:29
Works for iOS8+ but not for iOS7.0+. In my app the segmented control sometimes changes its height back to the default value 28. I have also implemented - (CGSize) intrinsicContentSize { CGSize defaultSize = [super intrinsicContentSize]; return CGSizeMake(defaultSize.width, 35); } with the height 35 (so that NSContentSizeLayoutConstraint for height is the same as NSLayoutConstraint) but still the control sometimes jumps back to the default height 28. – Vladimír Slavík Nov 20 '14 at 14:15
This is the best Answer. I tried it on 8.4 and 9.0, and they both worked! Many thanks – Septronic Oct 13 '15 at 10:46
1

Right underneath the storyboard screen itself, next to w Any hAny, there are 4 bottoms. Click on the second one from the right and set height as a different value. Then reset frames for that object using the first one from the right. Then you see the segmented control's height has been adjusted in Storyboard. – coolcool1994 Sep 08 '16 at 15:37
The problem with this implementation is that no matter how high the segmented control is, the text in the segment will not go on the second line, 3rd. It will be truncated. – bibscy Jun 06 '19 at 19:36

score 84 · Accepted Answer · answered Aug 19 '12 at 15:51

84

Yes, you can use [mySegmentedControl setFrame:frame] in code. It is unfortunate that you can't do this in IB.

So, if you just want to change the height:

CGRect frame= mySegmentedControl.frame;
[mySegmentedControl setFrame:CGRectMake(frame.origin.x, frame.origin.y, frame.size.width, fNewHeight)];

answered Aug 19 '12 at 15:51

Luke

7,110
6
45
74

8

Works fine in IOS7 as long as you do it in viewDidLayoutSubviews (or, presumably, later), not in viewDidLoad. – Thunk Mar 02 '14 at 19:19
3

Not working on iOS 7.1 - I've tried it out in boath viewDidLayoutSubviews and viewDidLoad – GangstaGraham Apr 21 '14 at 21:27
Heh..., works in iOS 7.1.1 and also in viewDidLoad. The only option if you don't want to use auto layout. – Krzysztof Przygoda May 05 '14 at 21:31
it's doesnt work in ios 7.1 . it's good to see any with solution of it. – Vishal Sharma Jun 03 '14 at 08:57
Excellent - any mechanism that helps me avoid setting constraints is a plus. – Nostradamus May 11 '22 at 19:02

score 27 · Answer 3 · edited Oct 27 '15 at 17:12

27

Add a new height constraint and set its value.

edited Oct 27 '15 at 17:12

josliber

43,891
12
98
133

answered Oct 27 '15 at 16:47

naveed148

548
5
8

score 12 · Answer 4 · edited May 23 '17 at 12:26

If you are using Auto Layout and are having trouble with Luke's answer, this worked perfectly for me:

NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:mySegmentedControl
                                     attribute:NSLayoutAttributeHeight 
                                     relatedBy:NSLayoutRelationEqual
                                     toItem:nil
                                     attribute:NSLayoutAttributeNotAnAttribute
                                     multiplier:1 
                                     constant:fNewHeight];
[mySegmentedControl addConstraint:constraint];

This one is the only one that worked for me in iOS 7.1. Awesome answer! — GangstaGraham, Apr 21 '14 at 21:35

score 10 · Answer 5 · answered Aug 30 '14 at 21:32

10

To do it inside Interface Builder you can select the control and add frame attribute under "User Defined Runtime Attributes"

add frame attribute inside IB

answered Aug 30 '14 at 21:32

Shaz

958
7
9

score 9 · Answer 6 · edited Dec 06 '16 at 07:44

9

Best and simple way to do is set height constraint to segmented control and increase its value as you needed.

edited Dec 06 '16 at 07:44

Guillaume

10,463
1
33
47

answered Dec 06 '16 at 07:20

Arshad Shaik

1,095
12
18

The problem with this implementation is that no matter how high the segmented control is the text in the segment will not go on the second line. It will be truncated. – bibscy Jun 06 '19 at 19:35

score 7 · Answer 7 · answered Jan 27 '17 at 07:52

7

Swift 3 IBInspectable Solution :

@IBDesignable class MySegmentedControl: UISegmentedControl {

    @IBInspectable var height: CGFloat = 29 {
        didSet {
            let centerSave = center
            frame = CGRect(x: frame.minX, y: frame.minY, width: frame.width, height: height)
            center = centerSave
        }
    }
}

answered Jan 27 '17 at 07:52

Kevin Vacquier

622
6
17

I create new swift file and copy-paste your code. Worked well. Thanks – fozoglu Feb 06 '17 at 08:12

score 5 · Answer 8 · answered Aug 28 '18 at 07:45

5

Just Go to Storyboard where id UisegmentContrrole is located and set height constraint with your custom heights as

answered Aug 28 '18 at 07:45

Rahul Panzade

1,302
15
12

score 4 · Answer 9 · answered Mar 12 '14 at 06:34

Fortunately you can change the height from the xib as well.

You can do so through the xib as well. Just add a segment control into the xib. Then open the xib in TextEdit. There you will find the code :

<segmentedControl opaque="NO" contentMode="scaleToFill" fixedFrame="YES" contentHorizontalAlignment="left" contentVerticalAlignment="top" segmentControlStyle="plain" selectedSegmentIndex="0" translatesAutoresizingMaskIntoConstraints="NO" id="B99-Tt-vJG">

<rect key="frame" x="222" y="82" width="123" height="44"/>

Here you change the height from 44 to any required height. You can change the height of any UIConponent like this. Even for the UIPickerView.

The interface builder shows it with the correct new size, however it returns to its default size on runtime. — Hola Soy Edu Feliz Navidad, Mar 22 '16 at 13:10

score 4 · Answer 10 · answered Mar 05 '15 at 20:28

4

Swift Solution:

segmentedControl.frame = CGRect(x: segmentedControl.frame.origin.x, y: segmentedControl.frame.origin.y, width: segmentedControl.frame.size.width, height: 40);

sets the height of the SegmentedControl to 40.

answered Mar 05 '15 at 20:28

dy_

2,433
24
27

score 2 · Answer 11 · edited Oct 14 '16 at 21:38

Swift Solution:

override func viewDidAppear(animated: Bool) {
    super.viewDidAppear(animated)
    let rect = CGRect(origin: segment.frame.origin, size: CGSize(width: segment.frame.size.width, height: 100))
    segment.frame = rect
}

or

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    let rect = CGRect(origin: segment.frame.origin, size: CGSize(width: segment.frame.size.width, height: 100))
    segment.frame = rect
}

or

    override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    let rect = CGRect(origin: segment.frame.origin, size: CGSize(width: segment.frame.size.width, height: 100))
    segment.frame = rect
}

Sets the height of the SegmentedControl to 100.

score 0 · Answer 12 · answered Dec 11 '13 at 02:04

0

Just do MySegmentedControl.frame = CGRectMake(15,5, 290, 50); and just change coordinates to fit it for your view (This is updated for iOS 7)

answered Dec 11 '13 at 02:04

Jacobanks

127
2
12

score 0 · Answer 13 · edited Dec 11 '15 at 01:44

0

If you select the "Use Auto Layout" , reset frame doesn't work, you should change the constraints instead. Perhaps it is the reason why the best answer not work for somebody , because it is selected by default in xcode 5

edited Dec 11 '15 at 01:44

Josh Crozier

233,099
56
391
304

answered Sep 16 '14 at 11:59

ken zhou

1
1

score 0 · Answer 14 · answered Nov 20 '14 at 14:33

The solution from Ji Fang did not work for me. I had to subclass the segmented control and add these methods. The solution based on auto layout is not robust in iOS7.0 /7.1. Sometimes it jumps back to the default height.

const static CGFloat kViewHeight = 35;

- (void) layoutSubviews {

    [super layoutSubviews];

    CGRect frame = self.frame;
    [self setFrame:CGRectMake(frame.origin.x, frame.origin.y, frame.size.width, kViewHeight)];

}

- (CGSize) intrinsicContentSize {

    CGSize defaultSize = [super intrinsicContentSize];
    return CGSizeMake(defaultSize.width, kViewHeight);
}

score 0 · Answer 15 · edited Mar 26 '15 at 04:33

0

You can try out the following:

segmentedControll.addConstraint(
        NSLayoutConstraint(
            item: segmentedControll,
            attribute: NSLayoutAttribute.Height,
            relatedBy: NSLayoutRelation.Equal,
            toItem: nil,
            attribute: NSLayoutAttribute.NotAnAttribute,
            multiplier: 1,
            constant: 40.0
        )
    )

edited Mar 26 '15 at 04:33

PatJ

5,996
1
31
37

answered Mar 26 '15 at 03:54

Duy linh Trần

11
1

Code dumping is usually discouraged here on StackOverflow. Some explanation behind what the code is doing wouldn't come amiss. – rayryeng Mar 26 '15 at 04:13

score -1 · Answer 16 · answered Mar 10 '14 at 17:24

-1

For me solution was:-

CGRect frame = CGRectMake (20, 20, 180, 50);
self.segmentedControl.frame = frame;

It works in every version and without even using autoresizing.

answered Mar 10 '14 at 17:24

iosDeveloper

46
6

iOS: change the height of UISegmentedcontrol

16 Answers16

Linked

Related