WebView in SpriteKit - sprite-kit

Working on MacOS and SpriteKit and looking to add a WKWebView. I would think that you could just add one like so.
webView = WKWebView(frame: NSRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height))
let url = URL(string: "http://www.llbean.com")
let request = URLRequest(url: url!)
webView.load(request)
view.addSubview(web)
Doing that in the top level ViewController doesn't do anything. Is there a better way to float a WebView above the SKView?

This question is at the center of my goal to convert my Game website to an iOS App.
So, I also need to insert my WKWebView into a new empty SKScene and that I do this creation within Xcode’s GameViewController routine loadView(). It is here I need to create my empty SKScene.
And this precisely what I do not know how to do.
It’s essential I do this because then I can use
myEmptyScene.sceneDidLoad() {
// the above URL code here
checkGamePadConnection() // my custom method
}
The reason I insert the above URL code into the SKScene is that others insist that each SKScene has its own WKWebView, not just the top ViewController.
Until I solve this, I am at a standstill

Related

How can I get the safeAreaLayout info for my GameScene?

Am trying to develop a game and am not using storyboard at all. Am building it all via code.
I know how to get the safeAreaLayout info, thanks to this forum) for a UIViewController. My thought was I'd be able to attach my GameScene: SKScene to that and go from there. Found out the hard way that's not the case. I have searched so hard and have tried all the example I found find for the likes of
override func viewDidLayoutSubviews()
and
func viewDidAppear(_ animated: Bool)
And every method I've tried returns either sets of 0's, or the full height of the screen 812
I would like to think that there is a proper method for getting the proper safeArea info to the initial GameScene of my app. Is there?
Hei,
You get the 812 pixels height because that's the scene height. In SpriteKit the games are full screen, you don't need to worry about the safe areas.
From GameViewController present the scene you want to display, in my case MainScene.
if let view = self.view as! SKView?
{
// create a new scene of type Main Scene
let scene = MainScene()
// set the new (MainScene) settings
scene.scaleMode = .resizeFill
scene.anchorPoint = CGPoint(x: 0.5, y: 0.5)
// present the scene
view.presentScene(scene)
}
If you want to know the size of the scene in MainScene, just get the values like this.
class MainScene: SKScene
{
override func didMove(to view: SKView)
{
let screenHeight = self.scene!.size.height
let screenWidth = self.scene!.size.width
}
}

Can't hide share button in USDZ + QLPreviewController

I got a project that involves a few USDZ files for the augmented reality features embedded in the app. While this works great, and we're really happy with how it performs, the built-in share button of the QLPreviewController is something that we'd like to remove. Subclassing the object doesn't have any effect, and trying to hide the rightBarButtonItem with the controller returned in delegate method still shows the button when a file is selected. The implementation of USDZ + QLPreviewController we're using is pretty basic. Is there a way around this issue?
func numberOfPreviewItems(in controller: QLPreviewController) -> Int {
return 1
}
func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
let url = Bundle.main.url(forResource: models[selectedObject], withExtension: "usdz")! controller.navigationItem.rirButtonItems = nil.
// <- no effect return url as QLPreviewItem
}
#IBAction func userDidSelectARExperience(_ sender: Any) {
let previewController = QLPreviewController()
previewController.dataSource = self
previewController.delegate = self
present(previewController, animated: true)
}
This is the official answer from Apple.
Use ARQuickLookPreviewItem instead of QLPreviewItem. And set its canonicalWebPageURL to a URL (can be any URL).
func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
guard let path = Bundle.main.path(forResource: "Experience", ofType: "usdz") else { fatalError("Couldn't find the supported input file.") }
let url = URL(fileURLWithPath: path)
if #available(iOS 13.0, *) {
let item = ARQuickLookPreviewItem(fileAt: url)
item.canonicalWebPageURL = URL(string: "http://www.google.com")
return item
} else { }
return url as QLPreviewItem
}
The version check is optional.
My approach is to add the QLPreviewController as an subview.
container is an UIView in storyboard.
let preview = QLPreviewController()
preview.dataSource = self
preview.view.frame = CGRect(origin: CGPoint(x: 0, y: -45), size: CGSize(width: container.frame.size.width, height: container.frame.size.height+45) )
container.addSubview(preview.view)
preview.didMove(toParent: self)
The y offset of the frame's origin and size may vary. This will ensure the AR QuickLook view to be the same size as the UIView, and hide the buttons (unfortunately, all of them) at the same time.
Instead of returning QLPreviewItem, use ARQuickLookPreviewItem which conforms to this protocol.
https://developer.apple.com/documentation/arkit/arquicklookpreviewitem
Then, assign a url that you would want to share (that will appear in share sheet) in canonicalWebPageURL property. By default, this property shares the file url (in this case, the USDZ file url). Doing so would not expose your file URL(s).
TLDR: I don't think you can.
I haven't seen any of the WWDC session even mention this and I can't seem to find any supporting developer documentation. I'm pretty sure the point of the ARKit QLPreviewController is so you don't have to do any actual coding on the AR side. I can see the appeal for this and for customisation in general, however, I'd suggest instead looking at some of the other ARKit projects that Apple has released and attempting to re-create those from the ground up as opposed to stripping this apart.
Please advise if this changes as I'd like to do something similar, especially within Safari.
I couldn't get to the share button at all to hide or disable it. Spent days to overcome this. I did rather unprofessional way of overcoming it. Subview QLPreviewController to a ViewController and subview a button or view on top of image view on top of share button and setting my company logo as image. It will be there all the time, even the top bar hides on full screen in AR mode. Not a clean solution. But works.

Swift Mac OS - How to play another video/change the URL of the video with AVPlayer upon a button click?

I am new to swift and I am trying to make a Mac OS app that loops a video from the app's resources using AVPlayer as the background of the window once the app has been launched. When the user selects a menu item/clicks a button the background video will instantly change to a different video from the app's resources and start looping that video as the window's background.
I was able to play the first video once the app launches following this tutorial: (https://youtu.be/QgeQc587w70) and I also successfully made the video loop itself seamlessly following this post: (Looping AVPlayer seamlessly).
The problem I am now facing is changing the video to the other one once a menu item was selected/a button was clicked. The approach I was going for is to change the url and create a new AVPlayer using the new URL and affect it to the playerView.player following this post: (Swift How to update url of video in AVPlayer when clicking on a button?). However every time the menu item is selected the app crashes with the error "thread 1 exc_bad_instruction (code=exc_i386_invop subcode=0x0)". This is apparently caused by the value of playerView being nil. I don't really understand the reason for this as playerView is an AVPlayerView object that I created using the xib file and linked to the swift file by control-dragging and I couldn't seem to find another appropriate method of doing the thing I wanted to do. If you know the reason for this and the way of fixing it please provide me some help or if you know a better method of doing what I've mention above please tell me as well. Any help would be much appreciated!
My code is as follow, the line that crashes the app is at the bottom:
import Cocoa
import AppKit
import AVKit
import AVFoundation
struct videoVariables {
static var videoName = "Test_Video" //declaring the video name as a global variable
}
var videoIsPlaying = true
var theURL = Bundle.main.url(forResource:videoVariables.videoName, withExtension: "mp4") //creating the video url
var player = AVPlayer.init(url: theURL!)
class BackgroundWindow: NSWindowController {
#IBOutlet weak var playerView: AVPlayerView! // AVPlayerView Linked using control-drag from xib file
#IBOutlet var mainWindow: NSWindow!
#IBOutlet weak var TempBG: NSImageView!
override var windowNibName : String! {
return "BackgroundWindow"
}
//function used for resizing the temporary background image and the playerView to the window’s size
func resizeBG() {
var scrn: NSScreen = NSScreen.main()!
var rect: NSRect = scrn.frame
var height = rect.size.height
var width = rect.size.width
TempBG.setFrameSize(NSSize(width: Int(width), height: Int(height)))
TempBG.frame.origin = CGPoint(x: 0, y: 0)
playerView!.setFrameSize(NSSize(width: Int(width), height: Int(height)))
playerView!.frame.origin = CGPoint(x: 0, y: 0)
}
override func windowDidLoad() {
super.windowDidLoad()
self.window?.titleVisibility = NSWindowTitleVisibility.hidden //hide window’s title
self.window?.styleMask = NSBorderlessWindowMask //hide window’s border
self.window?.hasShadow = false //hide window’s shadow
self.window?.level = Int(CGWindowLevelForKey(CGWindowLevelKey.desktopWindow)) //set window’s layer as desktopWindow layer
self.window?.center()
self.window?.makeKeyAndOrderFront(nil)
NSApp.activate(ignoringOtherApps: true)
if let screen = NSScreen.main() {
self.window?.setFrame(screen.visibleFrame, display: true, animate: false) //resizing the window to cover the whole screen
}
resizeBG() //resizing the temporary background image and the playerView to the window’s size
startVideo() //start playing and loop the first video as the window’s background
}
//function used for starting the video again once it has been played fully
func playerItemDidReachEnd(notification: NSNotification) {
playerView.player?.seek(to: kCMTimeZero)
playerView.player?.play()
}
//function used for starting and looping the video
func startVideo() {
//set the seeking time to be 2ms ahead to prevent a black screen every time the video loops
let playAhead = CMTimeMake(2, 100);
//loops the video
NotificationCenter.default.addObserver(forName: .AVPlayerItemDidPlayToEndTime, object:
playerView.player?.currentItem, queue: nil, using: { (_) in
DispatchQueue.main.async {
self.playerView.player?.seek(to: playAhead)
self.playerView.player?.play()
}
})
var playerLayer: AVPlayerLayer?
playerLayer = AVPlayerLayer(player: player)
playerView?.player = player
print(playerView?.player)
playerLayer?.videoGravity = AVLayerVideoGravityResizeAspectFill
player.play()
}
//changing the url to the new url and create a new AVPlayer then affect it to the playerView.player once the menu item is being selected
#IBAction func renderBG(_ sender: NSMenuItem) {
videoVariables.videoName = "Test_Video_2"
var theNewURL = Bundle.main.url(forResource:videoVariables.videoName, withExtension: "mp4")
player = AVPlayer.init(url: theNewURL!)
//!!this line crashes the app with the error "thread 1 exc_bad_instruction (code=exc_i386_invop subcode=0x0)" every time the menu item is being selected!!
playerView.player = player
}
}
Additionally, the background video is not supposed to be interactive(E.g. User cannot pause/ fast-forward the video), so any issues that might be caused by user interactivity can be ignored. The purpose of the app is to play a video on the user's desktop creating the exact same effect of running the command:
"/System/Library/Frameworks/ScreenSaver.framework/Resources/
ScreenSaverEngine.app/Contents/MacOS/ScreenSaverEngine -background" in terminal.
Any help would be much appreciated!
You don't need to create AVPlayer from url. There is AVPlayerItem class to manipulate player playback queue.
let firstAsset = AVURLAsset(url: firstVideoUrl)
let firstPlayerItem = AVPlayerItem(asset: firstAsset)
let player = AVPlayer(playerItem: firstPlayerItem)
let secondAsset = AVURLAsset(url: secondVideoUrl)
let secondPlayerItem = AVPlayerItem(asset: secondAsset)
player.replaceCurrentItem(with: secondPlayerItem)
Docs about AVPlayerItem

Resize WebView for ipad swift 3

I have a First View, where when I click on one button, it opens an UIWebView,
I want this webView to take only 3/4 of my view when I look at it from an Ipad, if it's an Iphone I want to get a full screen view.
Here is my code :
override func loadView() {
let webConfiguration = WKWebViewConfiguration()
webView = WKWebView(frame: .zero, configuration: webConfiguration)
webView.uiDelegate = self
view = webView
}
I try the method init with arbitrary values frame: .init(x: 20, y: 20, width: 20, height: 20)
But it's still taking full screen, for detect if it's an Ipad I use this condition
if (UIScreen.main.traitCollection.userInterfaceIdiom.rawValue == 1)
{
// if here I'm an Ipad I can resize my webview
webView.frame.size.height = view.frame.height - // some number
}
Isn't this exactly what adaptive user interfaces and size classes in Interface Builder is for? Have a look at this WWDC video from 2014.

How to add an overlay start scene in swift?

can someone code for me please how to add an overlay start scene in swift?
I want to add a startMenu like in Flappy Bird, and then when you click play it just moves/fades away and the game begins.
Can someone help me achieve this effect?
Looking to achieve this.
I will be more than thankful!
Try to post some code of what you have tried so far when asking a question on stack overflow, people tend to not write code for you.
You can basically do this 2 ways.
1)
Either create a StartScene and transition to GameScene with your preferred SKTransition when the play button is pressed e.g SKTransition.crossFade
2)
If you want to do it in the same scene you can just create a SKNode/SKSpriteNode class to use as a menu.
class Menu: SKSpriteNode {
lazy var playLabel: SKLabelNode = {
let label = SKLabelNode(fontNamed: "HelveticaNeue")
label.text = "Play"
label.fontSize = 22
label.fontColor = .yellow
label.position = CGPoint(x: self.frame.midX, y: self.frame.midY)
return label
}()
/// Init with size
init(size: CGSize) {
super.init(texture: nil, color: .red, size: size)
addChild(playLabel)
}
}
}
Than in your GameScene Scene you can add the menu like so with your preferred size, in this example the size of the scene.
class GameScene: SKScene {
lazy var menu: Menu = Menu(size: self.size)
override func didMove(to view: SKView) {
addChild(menu)
}
}
You can add other nodes for UI, including sprites for buttons etc, to that menu class.
Than in GameScene in touches Began you can look for nodes that are touched, e.g the play button and than do your thing e.g to animate out the menu
let action1 = SKAction.fadeAlpha(to: 0, duration: 0.5)
let action2 = SKAction.removeFromParent()
let sequence = SKAction.sequence([action1, action2])
menu.run(sequence)
If you stuck there and want more coding samples you should google how to do this, is basic SpriteKit stuff that you need to know and there is plenty tutorials available. This includes samples of how to make button subclasses using SKSpriteNodes.
Hope this helps