Is it possible to rotate an image in Storyboard or do you have to do it programmatically?

Question

Assume you have a triangle image you want to use at different angles (e.g., 180 degrees, 90 degrees).

Is it possible to rotate the triangle image within Storyboard, or do you need to do it programmatically?

Vestibule

Answer 1

You could probably create an IBDesignable & IBInspectable UIView subclass that had a rotation angle property, and applied a transform to the image it contained.

IBInspectable allows you to expose custom properties of your custom views in IB's Attributes inspector.

Making a view IBDesignable allows you to view a preview of your custom view object in IB.

Edit:

This is a very old thread, but I decided to implement a custom UIView that allows rotation, as I described. Since it's now 2021, I used Swift:

@IBDesignable class RotatableView: UIView {

    @objc @IBInspectable var rotationDegrees: Float = 0 {
        didSet {
            print("Setting angle to \(rotationDegrees)")
            let angle = NSNumber(value: rotationDegrees / 180.0 * Float.pi)
            layer.setValue(angle, forKeyPath: "transform.rotation.z")
        }
    }
}

That yields the following in Interface Builder:

Masbate

Note that it's a little "squirrely". If you change the angle, the Xcode preview may offset the label from where it should really be placed, etc. Also note that setting the z rotation of a transform is only valid if the transform is not "skewed" (Stretched out of square.) – Masbate

How would I do this on LaunchScreen? How would the new view even be added ot it? – Nephoscope

You can’t modify a launch screen at all. Those get displayed by the system before your code executes. A launch screen will only display a static image. – Masbate

I advise against adding new questions as comments on old answers. You should create a new question. – Masbate

Sorry, I decided to use on main screen. I copied and pasted the IBinspectable but I don't see the designable on my imageview in xcode. When I run it, it stays stuck on launchscreen for some reason. (this is a problem with the answer, so I don't think it needs a new question, right?) I also took out a new UIView to see if it's on that one, but it's not on that one either. – Nephoscope

Answer 2

YES. You can this only in the Storyboard (Interface Builder) cause it's layer related properties.

Just click on your view, go to User Defined Runtime Attributes and add the key path like so:

layer.transform.rotation.z 1.57

NOTICE:

• The value is in radians. For instance, to rotate 90 degrees put 1.57.
• You will only see the changes during runtime.

Abbreviate

Answer 3

It is possible to set layer.transform.rotation.z in User Defined Runtime Attributes. Check this answer: https://mcmap.net/q/892323/-rotate-angle-a-uiview-using-user-defined-runtime-attributes

Hahnke

Answer 4

Programmatically some thing like this can help:

//rotate rect
    myImageView.transform = CGAffineTransformMakeRotation(M_PI_2); //90 degree//rotation in radians

//For 180 degree use M_PI

Or make a macro like this:

#define DEGREES_TO_RADIANS(degree) (M_PI * (degree) / 180.0)

and use this way:

CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(90));//here may be anything you want 45/90/180/270 etc.

More here : apple link

Brachylogy

Latest version of swift: myImageView.transform = CGAffineTransform(rotationAngle: CGFloat(M_PI_2 * 3)) – Aleedis