Add SwiftUI home screen with 2-column grid layout for micro utility apps

[Copilot]

Implements a home screen displaying utility apps in a 2-column grid with center-aligned icons and labels. Each icon navigates to its corresponding utility screen.

Core Implementation

• HomeView: LazyVGrid with 2 flexible columns, NavigationStack-based routing
• HomeItemView: Reusable component with 80×80pt icon frame, 16pt corner radius, center-aligned text
• HomeItem: Data model mapping SF Symbol icons to enum-based destinations
• 6 utility screens: Calculator, Notes, Weather, Timer, Settings, Calendar (placeholder implementations)

struct HomeView: View {
    let columns = [GridItem(.flexible()), GridItem(.flexible())]
    
    var body: some View {
        NavigationStack {
            ScrollView {
                LazyVGrid(columns: columns, spacing: 20) {
                    ForEach(items) { item in
                        NavigationLink(destination: destinationView(for: item.destination)) {
                            HomeItemView(item: item)
                        }
                    }
                }
            }
        }
    }
}

Architecture

• Type-safe navigation via UtilityDestination enum with @ViewBuilder switch
• Modular design: 4-step process to add new utilities (enum case, view file, items array entry, routing case)
• iOS 16.0+ minimum (NavigationStack requirement)

Project Structure

• Xcode project with proper target configuration
• Asset catalogs for app icon and accent color
• Preview content for SwiftUI previews

Original prompt

Add a home screen in the application which shows a row of items and each row with two items. Each row should have an icon and a text below it. Both icon and text must be center aligned. When clicking on each of the icon it should take you to the individual screen. Each of the icon is a micro utility program and this application consists of many such micro utility applications.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.