How to Rotate Text for Uibutton and Uilabel in Swift

How can you rotate text for UIButton and UILabel in Swift?

I am putting my answer in a similar format to this answer.

Here is the original label:

Rotate 90 degrees clockwise:

yourLabelName.transform = CGAffineTransform(rotationAngle: CGFloat.pi / 2)

Rotate 180 degrees:

yourLabelName.transform = CGAffineTransform(rotationAngle: CGFloat.pi)

Rotate 90 degrees counterclockwise:

yourLabelName.transform = CGAffineTransform(rotationAngle: -CGFloat.pi / 2)

Do the same thing to rotate a button. Thankfully the touch events also get rotated so the button is still clickable in its new bounds without having to do anything extra.

yourButtonName.transform = CGAffineTransform(rotationAngle: CGFloat.pi / 2)

Notes:

Documentation for CGAffineTransform

The basic format is CGAffineTransform(rotationAngle: CGFloat) where rotationAngle is in radians, not degrees.

There are 2π radians in a full circle (360 degrees). Swift includes the useful constant CGFloat.pi.

• CGFloat.pi = π = 180 degrees
• CGFloat.pi / 2 = π/2 = 90 degrees

Auto Layout:

Auto layout does not work with rotated views. (See Frame vs Bounds for an explanation why.) This problem can be solved by creating a custom view. This answer shows how to do it for a UITextView, but it is the same basic concept for a label or button. (Note that you will have to remove the CGAffineTransformScale line in that answer since you don't need to mirror the text.)

Related

• How to do transforms on a CALayer?
• How to apply multiple transforms in Swift
• CTM transforms vs Affine Transforms in iOS (for translate, rotate, scale)

How can you rotate text for UIButton and UILabel in Objective-C?

[*yourlabelname* setTransform:CGAffineTransformMakeRotation(-M_PI / 2)];

rotated image

pervious image

How can you rotate Text, Button, Rectangle in SwiftUI?

Use any one of the .rotationEffect() methods to rotate any View clockwise, including Button and Text.

For example, this rotates Text about its origin (the center of its frame):

Text("Turtle Rock")
.rotationEffect(Angle(degrees: 90)))

Use the overloaded method with an anchor argument to rotate around a different point.

For example, this rotates Text about the bottom left point of its frame:

Text("Turtle Rock")
.rotationEffect(Angle(degrees: 90), anchor: .bottomLeading)

You can also use radians for rotation:

Text("Turtle Rock")
.rotationEffect(radians: Double.pi / 2)

Is there any way to rotate only the text of button in ios

You can access button.titleLabel

example:

button.titleLabel?.transform = CGAffineTransform(rotationAngle: CGFloat.pi / 2)

opposite angle

button.titleLabel?.transform = CGAffineTransform(rotationAngle: -CGFloat.pi / 2)

rotating button titleLabel text

I added this code in cellForRowAt indexPath

 cell.btnApply.titleLabel?.transform = CGAffineTransform(rotationAngle: -(CGFloat.pi / 2))
    cell.btnApply.titleLabel?.textAlignment = .center
    cell.btnApply.titleLabel!.numberOfLines = 1

and change alignment of button from storyboard like this and it worked.

Rotate UIButton titleLabel without clipping

For anyone coming to this in the future, I ended up creating a new UIView (the blue rectangle) which contained the UIButton (the white '+'). I then disabled used interaction on the UIButton, and added a gesture recogniser to the UIView. When I wanted to rotate the '+', I rotated the whole UIButton (but not the containing UIView).

Vertical text in a Horizontal UIButton

You can add a Label on button and rotate the label as below:

UILabel *lbl= [[UILabel alloc] initWithFrame:CGRectMake(button.frame.size.width*.3, button.frame.size.height*.5, button.frame.size.width,button.frame.size.height)];
lbl.transform = CGAffineTransformMakeRotation(M_PI / 2);
lbl.textColor =[UIColor whiteColor];
lbl.backgroundColor =[UIColor clearColor];
[button addSubview:lbl];

Turn some parts of UILabel to act like a UIButton?

I recommend you try this library out

https://github.com/null09264/FRHyperLabel

Great library, easy to use and has few built in examples for you to try out. Examples are in both Objective-c and Swift

Example in Swift

 let str = "This is a random bit of text"
        let attributes = [NSForegroundColorAttributeName: UIColor.blackColor(),
                          NSFontAttributeName: UIFont.systemFontOfSize(15)]
        confirmLabel.attributedText = NSAttributedString(string: str, attributes: attributes)

        let handler = {
            (hyperLabel: FRHyperLabel!, substring: String!) -> Void in

            //action here
        }
        //Step 3: Add link substrings
        confirmLabel.setLinksForSubstrings(["random"], withLinkHandler: handler)

Edit:

If you want to get rid of the underline, best way to do this is to follow the advice that DeyaEldeen gave in the comment.

If you go to the .m file of FRHyperLabel, go to this method

- (void)checkInitialization {
    if (!self.handlerDictionary) {
        self.handlerDictionary = [NSMutableDictionary new];
    }

    if (!self.userInteractionEnabled) {
        self.userInteractionEnabled = YES;
    }

    if (!self.linkAttributeDefault) {
        self.linkAttributeDefault = @{NSForegroundColorAttributeName: FRHyperLabelLinkColorDefault,
                                      NSUnderlineStyleAttributeName: @(NSUnderlineStyleSingle)};
    }

    if (!self.linkAttributeHighlight) {
        self.linkAttributeHighlight = @{NSForegroundColorAttributeName: FRHyperLabelLinkColorHighlight,
                                        NSUnderlineStyleAttributeName: @(NSUnderlineStyleSingle)};
    }
}

And you can just remove this

NSUnderlineStyleAttributeName: @(NSUnderlineStyleSingle)

from the attributes

How to angle a uilabel in ios

Your label shrinks due to setting wrong frame. You should place your label into the UIView and rotate this view instead of label. And also check your UIView have no any autoresizing anchors enabled.

---

Related Topics