IOS Panorama Tour

Recently I am working on a real estate project, which needs a panoramic effect. A bit of Google led to the library PanoramaGL, but it hasn’t been updated in a while. I tried dragging it into the project, changed some of the parameters for plconstants.h’s maximum picture size, and it worked.

but

Unfortunately, after setting scrollEnable=YES, a slide will keep spinning. Because if you slide, in PLViewBase, you will start a timer/CADisplaylink to refresh and constantly call the drawView exchanges. Then HE decided on a cruel policy and put an end to his power for 0.4 seconds in drawview. But then it stops a little bit suddenly, not smooth enough. ╮(╯▽╰)╭, and do not know how to change the source code, so looking for another solution.

The newly discovered

Again, Google found a pano2VR that could convert panoramic images into HTML and switch smoothly. And then inside your app, you just have a WebView. Just to make fun of it, it’s a paid app, and I can’t find a cracked MAC version, and the MAC trial version is watermarked and unusable. Later cut to win version, the next crack.

Simple and practical

It is very convenient to use, drag the picture in, support a panorama, or 6 stereo. And then I set the parameters, and I don’t really need to set them, I just set the HTML to full screen.

Hotspot can also be set up, and skins can be edited to use custom images. Overall or relatively convenient. Video 1, video 2

Qq has an article about the realization of a panoramic planet, there are more detailed analysis and comparison of various panoramic tools, can be stabbed here.

Access to the app

Actually, at this stage, it’s a little bumpy. The main problem is the image path. Since it is added in a yellow folder, all resources are under the mainbundle and there is no hierarchy, and the image path in the XML it automatically generates is images/xx.jpg. So you need to change the path manually by dropping images/ and referring directly to XX.jpg.

One more thing to note is the setting of baseURL when loading the local HTML. You need to set it to [[NSBundle mainBundle] bundleURL. If set to nil, a prompt appears. Because it doesn’t find JS files and IMG.

This content requires HTML5/CSS3, WebGL, or Adobe Flash Player Version 9 or higher.

  NSString *path = [[NSBundle mainBundle] pathForResource:@"A5_cube" ofType:@"html"];
  NSString *data = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];

  [_webView loadHTMLString:data baseURL:[[NSBundle mainBundle] bundleURL]];Copy the code

Finally, if js is not found or not executed, please check build Phase –>compile source for it. If yes, drag it to the Copy Bundle Resource.

However, I used Xcode 7.3 to drag it in, which is normal.

Ho-ha, pit, finally filled.

The 6.25 update

= = = = = = = Demo here

The 7.25 update

Some time ago, I consulted a senior, about the automatic stop sliding problem. The solution is to set a friction factor (0-1), which is continuously multiplied in sliding to achieve the purpose of slowing down. Simply post the code.

In PLViewBase. M, draw view power

-(void)drawViewInternally { if(scene && ! isValidForFov && ! isSensorialRotationRunning) { PLCamera *camera = scene.currentCamera; [camera rotateWithVelocity:self.velocity]; If (touchStatus==PLTouchEventTypeEnded) {// Define a rotation method in the PLCamera, Fingers left touch screen according to picture according to the speed and direction of the [camera rotateWithVelocity: self. The velocity]; } else { [camera rotateWithStartPoint:startPoint endPoint:endPoint]; } if(delegate && [delegate respondsToSelector:@selector(view:didRotateCamera:rotation:)]) [delegate view:self didRotateCamera:camera rotation:[camera getAbsoluteRotation]]; } if(renderer) [renderer render]; If (touchStatus==PLTouchEventTypeEnded) {float friction = 0.9; if (fabs(self.velocity.x)>1||fabs(self.velocity.y)>1) { self.velocity=CGPointMake(self.velocity.x*friction, self.velocity.y*friction); } else { [self stopAnimationInternally]; }}}Copy the code

Then self.velocity needs to be calculated by itself, dividing the distance moved by the time when moving.

- (CGPoint)calculateVelocity:(NSSet *)touches { UITouch *touch = [touches anyObject]; CGPoint location = [touch locationInView:self]; CGPoint prevLocation = [touch previousLocationInView:self]; CGFloat xDistance = location.x - prevLocation.x; CGFloat yDistance = location.y - prevLocation.y; // self.curTimestamp, self.previousTimestamp self-defined NSTimeInterval time = self.curTimestamp - self.previousTimestamp; if (time ! = 0) { CGFloat xSpeed = xDistance/time; CGFloat ySpeed = yDistance/time; return CGPointMake(xSpeed, ySpeed); } return CGPointZero; }Copy the code

Finally, add rotateWithVelocity methods to the PLObject

-(void)rotateWithVelocity:(CGPoint)velocity
{
    float sensitivity = 900;

    self.pitch += velocity.y/ sensitivity;
    self.yaw += -velocity.x/sensitivity;
}Copy the code