PHP WEBSITE TO IOS APP
IDE
Integrated Development Environment
Programming Language
Programming language for iOS, iPadOS, macOS, tvOS, and watchOS.
User Interface
SwiftUI is a user interface (UI) framework
Step-by-Step: WebView Wrapper for iOS (SwiftUI)
1. Project Setup
First, create a new Xcode project:
2. App Icon Setup
Create an app icon (1024x1024px) and add it to Assets.xcassets:
Prepare your icon in various sizes or use App Icon Generator
In Xcode, open Assets.xcassets
Right-click → New App Icon
Drag all generated sizes into their slots
1. ContentView.swift
This is where you’ll place the main view that loads your website.
import SwiftUI
import WebKit
// MARK: – WebView Wrapper
struct WebView: UIViewRepresentable {
let url: URL
func makeUIView(context: Context) -> WKWebView {
let webView = WKWebView()
webView.navigationDelegate = context.coordinator
return webView
}
func updateUIView(_ uiView: WKWebView, context: Context) {
let request = URLRequest(url: url)
uiView.load(request)
}
func makeCoordinator() -> Coordinator {
Coordinator()
}
// MARK: – Coordinator for Loading Events (Optional)
class Coordinator: NSObject, WKNavigationDelegate {
// You can use this to track loading state if needed
func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
print(“Started loading…”)
}
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
print(“Finished loading.”)
}
}
}
// MARK: – Main ContentView
struct ContentView: View {
var body: some View {
WebView(url: URL(string: “https://rsportfolio.com/”)!)
.edgesIgnoringSafeArea(.all)
}
}
2. RS_ProfileApp.swift
This file is your app’s entry point. It should already look like this:
import SwiftUI
@main
struct RS_ProfileApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
3. Info.plist
This file is your app’s entry point. It should already look like this:
Steps to edit:
Click on
Info.plistin the project navigator.Add the following inside the root dictionary:
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
4. SwiftUI Splash Screen (Donot Add This File)
Press Cmd n and choose SwiftUI. Give name SplashScreenView
First, add Icons: in the Assets folder
import SwiftUI
struct SplashScreenView: View {
@State private var animate = false
@State private var showMainView = false
var body: some View {
ZStack {
if showMainView {
ContentView() // Your main app view
} else {
VStack {
Image(“AppLogo”) // Add your logo to Assets.xcassets
.resizable()
.frame(width: animate ? 150 : 100, height: animate ? 150 : 100)
.scaleEffect(animate ? 1.2 : 1.0)
.animation(.easeInOut(duration: 1.2), value: animate)
Text(“Indus Footwear”)
.font(.title)
.bold()
.opacity(animate ? 1 : 0)
.animation(.easeIn(duration: 1.0), value: animate)
}
.onAppear {
animate = true
DispatchQueue.main.asyncAfter(deadline: .now() + 2.5) {
showMainView = true
}
}
}
}
}
}