方向改变时，在同一位置旋转图像90度 [英] Rotating an image 90 degrees on same position when orientation changes

问题描述

结束这样做：
支持多个方向的最简单方法？如何在应用程序处于横向时加载自定义NIB？工作精湛！

我已经制作了一个图像我想在我的iPad应用程序中用作信息屏幕背景的Photoshop。该图像还包含文本和一些图标。在图像周围，我有一个绿色的边框。

I have made an image in Photoshop which I want to use as background for my info-screen in my iPad application. The image contains text and some icons also. Around the image I have a border which is green.

我想要达到的效果是：

当用户从纵向朝向横向时，我希望图像（只是框架和图标）旋转90度，使图像以横向模式显示，而不是在横向上显示框架的纵向视图。文本和图标是分离的（我在不同的UIImageView中组织的不同图层）它们将旋转90度。

When the user goes from the portrait orientation to landscape orientation I want the image (just the frame and the icons) to rotate 90 degrees so the image appear in landscape mode, instead of having a portrait view of the frame in landscape. The text and icons are decoupled (different layers which I have organized in different UIImageView's)they shall rotate 90 degrees.

我已经完成的工作如下：

What I have done already is the following:

使用此方法进行了一些实验：

Experimented a bit with this method:

- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation duration:

并尝试这样做：

self.btnFacebook.transform = CGAffineTransformMakeRotation(1.5707964);

我认为将btnFacebook属性向右旋转90度（如果我错了，请纠正我）因为它指定正弧度。我似乎无法让它正常工作。难道这不能将按钮绕框架中心坐标旋转90度吗？这不会导致按钮位置发生变化（按钮是正方形）？

which I think will rotate the btnFacebook property 90 degrees to the right (correct me if I am wrong) since it specifies positive radians. I can't seem to get it to work correctly though. Should'nt this rotate the button 90 degrees around its center coordinate in the frame? That wouldn't cause a change in the position of the button (the button is square)?

制作图像：

由于图像显示图像背景（其中一些自定义图形在两个方向看起来都很好）从纵向到横向并旋转，因此它不会显示为纵向风景，图标与背景分离，因此它们也需要旋转，因为它们需要处于正确的方向（它是社交图标）。然而，文本位于相同的位置，它只旋转90度而没有重新定位。

As the image shows the image background (some custom graphics on it which looks good in both orientations) goes from portrait to landscape and rotates so it does not appear as portrait in landscape, the icons are decoupled from the background so they need to rotate as well because they need to be in the right orientation (it is social icons). The text however are on the same position, it only rotates 90 degrees without repositioning.

推荐答案

我理解你的问题是因为你是试图不要整个旋转界面，而是单独旋转紫色和红色方块。

I understand your question as that you are trying to not to rotate the interface as whole but to rotate the purple and red squares individually.

我创建了一个 UIViewController 类似于你的布局。

I created a UIViewController that resembles your layout.

黑色正方形是一个UIView，白色正方形只有这样才能让我知道黑色视图何时旋转。此视图连接到控制器上的 view1 属性。

The black square is a UIView and the white square is there only so that I can tell when the black view rotates. This view is wired to view1 property on the controller.

有4个按钮连接到 btnx （x运行1到4）属性。

There are 4 buttons that are wired to btnx (x runs 1 through 4) properties.

因为我不想再自动旋转界面我只支持肖像方向。

Since I no longer want to auto rotate the interface I only support the portrait orientation.

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    // Return YES for supported orientations
    return (interfaceOrientation == UIInterfaceOrientationPortrait);
}

为了手动进行旋转，我向ViewController添加了一个方法。它确定将组件从纵向旋转到当前方向所需的角度，创建旋转变换并将其应用于所有出口。

To do the rotation manually, I added a method to the ViewController. It determines the angle it needs to rotate the components from portrait to current orientation, creates a rotation transform and applies it to all outlets.

- (void)deviceDidRotate:(NSNotification *)notification
{
    UIDeviceOrientation currentOrientation = [[UIDevice currentDevice] orientation];
    double rotation = 0;
    UIInterfaceOrientation statusBarOrientation;
    switch (currentOrientation) {
        case UIDeviceOrientationFaceDown:
        case UIDeviceOrientationFaceUp:
        case UIDeviceOrientationUnknown:
            return;
        case UIDeviceOrientationPortrait:
            rotation = 0;
            statusBarOrientation = UIInterfaceOrientationPortrait;
            break;
        case UIDeviceOrientationPortraitUpsideDown:   
            rotation = -M_PI;
            statusBarOrientation = UIInterfaceOrientationPortraitUpsideDown;
            break;     
        case UIDeviceOrientationLandscapeLeft:     
            rotation = M_PI_2;   
            statusBarOrientation = UIInterfaceOrientationLandscapeRight;
            break;  
        case UIDeviceOrientationLandscapeRight:    
            rotation = -M_PI_2;
            statusBarOrientation = UIInterfaceOrientationLandscapeLeft;
            break;
    }
    CGAffineTransform transform = CGAffineTransformMakeRotation(rotation);
    [UIView animateWithDuration:0.4 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
        [self.btn1 setTransform:transform];
        [self.btn2 setTransform:transform];
        [self.btn3 setTransform:transform];
        [self.btn4 setTransform:transform];
        [self.view1 setTransform:transform];
        [[UIApplication sharedApplication] setStatusBarOrientation:statusBarOrientation];
    } completion:nil];
}

最后要做的是让操作系统调用我的方法。为此，我将以下代码添加到AppDelegate中的应用程序：didFinishLaunchingWithOptions：。

The last thing to do is to get the OS to call my method. To achieve that I added the following code to application:didFinishLaunchingWithOptions: in the AppDelegate.

[[UIDevice currentDevice] beginGeneratingDeviceOrientationNotifications];
[[NSNotificationCenter defaultCenter] addObserver:self.viewController selector:@selector(deviceDidRotate:) name:UIDeviceOrientationDidChangeNotification object:nil];

我不确定这是不是你想要的但我相信它至少是相似的所以你可以从中获得一些想法如何解决您的问题。我可以为我创建的工作iPad应用程序提供源代码来说明这一点。

I am not sure whether this is exactly what you wanted but I believe it is at least similar so you can get some ideas from it how to solve your problem. I can provide source code for a working iPad application that I created to illustrate this.

这篇关于方向改变时，在同一位置旋转图像90度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！