Close Menu
  • Home
  • AI
  • Big Data
  • Cloud Computing
  • iOS Development
  • IoT
  • IT/ Cybersecurity
  • Tech
    • Nanotechnology
    • Green Technology
    • Apple
    • Software Development
    • Software Engineering

Subscribe to Updates

Get the latest technology news from Bigteetechhub about IT, Cybersecurity and Big Data.

    What's Hot

    AI swarms could hijack democracy without anyone noticing

    April 30, 2026

    Will Sentance on JS Modernization – Software Engineering Radio

    April 30, 2026

    True Cost of HVAC Service in Charlotte: A No-Surprises Guide for Homeowners

    April 30, 2026
    Facebook X (Twitter) Instagram
    Facebook X (Twitter) Instagram
    Big Tee Tech Hub
    • Home
    • AI
    • Big Data
    • Cloud Computing
    • iOS Development
    • IoT
    • IT/ Cybersecurity
    • Tech
      • Nanotechnology
      • Green Technology
      • Apple
      • Software Development
      • Software Engineering
    Big Tee Tech Hub
    Home»iOS Development»ios – SwiftUI Menu always appears at top of label – how to show it at center of tappable area?
    iOS Development

    ios – SwiftUI Menu always appears at top of label – how to show it at center of tappable area?

    big tee tech hubBy big tee tech hubDecember 13, 2025032 Mins Read
    Share Facebook Twitter Pinterest Copy Link LinkedIn Tumblr Email Telegram WhatsApp
    Follow Us
    Google News Flipboard
    ios – SwiftUI Menu always appears at top of label – how to show it at center of tappable area?
    Share
    Facebook Twitter LinkedIn Pinterest Email Copy Link


    I’m building a photo upload component in SwiftUI where the entire rectangular area should be tappable to show a Menu with options (Photo Library / Camera).

    The problem: No matter what I try, the Menu popup always appears anchored to the TOP of the label, but I need it to appear at the CENTER of my tappable rectangle.

    Current behavior:

    SCREENSHOT 1 - menu appearing at top

    Expected behavior: Menu should appear in the center of this area:

    [SCREENSHOT 2 - empty upload area]

    My current code:

    import SwiftUI
    import PhotosUI
    
    struct PhotoUploaderExample: View {
        @State private var selectedImage: UIImage?
        @State private var showingImagePicker = false
        @State private var showingCamera = false
        
        private let placeholderSide: CGFloat = UIScreen.main.bounds.width - 32
        
        var body: some View {
            VStack(alignment: .leading, spacing: 12) {
                Text("Add a photo")
                    .font(.system(size: 20, weight: .semibold))
                
                photoUploadArea
            }
            .padding(.horizontal, 16)
            .sheet(isPresented: $showingImagePicker) {
                // Photo library picker
            }
            .fullScreenCover(isPresented: $showingCamera) {
                // Camera
            }
        }
        
        var photoUploadArea: some View {
            ZStack {
                // Background rectangle with dashed border
                RoundedRectangle(cornerRadius: 24)
                    .fill(Color.gray.opacity(0.05))
                    .strokeBorder(
                        Color.gray.opacity(0.3),
                        style: StrokeStyle(lineWidth: 2, dash: [8, 5])
                    )
                    .frame(width: placeholderSide, height: placeholderSide)
                
                // Content overlay - icon and button
                VStack(spacing: 12) {
                    Image(systemName: "photo.badge.plus.fill")
                        .resizable()
                        .scaledToFit()
                        .frame(width: 48, height: 48)
                    
                    Text("Add a photo")
                        .font(.system(size: 15, weight: .medium))
                        .padding(.horizontal, 20)
                        .padding(.vertical, 8)
                        .background(Color.gray.opacity(0.1))
                        .clipShape(Capsule())
                }
                
                // Menu - stretched to fill entire area
                Menu {
                    Button(action: {
                        showingImagePicker = true
                    }) {
                        Label("Photo Library", systemImage: "photo.on.rectangle")
                    }
                    
                    Button(action: {
                        showingCamera = true
                    }) {
                        Label("Camera", systemImage: "camera")
                    }
                } label: {
                    Color.clear
                        .contentShape(Rectangle())
                }
                .frame(width: placeholderSide, height: placeholderSide)
            }
        }
    }
    
    #Preview {
        PhotoUploaderExample()
    }
    

    What I’ve tried:

    • Wrapping Menu in different container views
    • Using Color.clear as label with .contentShape(Rectangle())
    • Placing a small invisible anchor at center

    Questions:

    • Is there any native way to control Menu popup anchor position?
      Looking for native SwiftUI solutions only – no third-party libraries please.

    Goal: Tapping anywhere inside the rectangle (not just the icon/button) should show the Menu centered within that area.



    Source link

    appears area Center iOS label Menu Show SwiftUI tappable Top
    Follow on Google News Follow on Flipboard
    Share. Facebook Twitter Pinterest LinkedIn Tumblr Email Copy Link
    tonirufai
    big tee tech hub
    • Website

    Related Posts

    ios – AppShortcut is shown in Shortcuts app but not in Spotlight

    April 30, 2026

    ios – In Swift I’m trying to understand the flow of logic when using Sendable, nonisolated, and Actors

    April 29, 2026

    Introducing SwiftBash | Cocoanetics

    April 28, 2026
    Add A Comment
    Leave A Reply Cancel Reply

    Editors Picks

    AI swarms could hijack democracy without anyone noticing

    April 30, 2026

    Will Sentance on JS Modernization – Software Engineering Radio

    April 30, 2026

    True Cost of HVAC Service in Charlotte: A No-Surprises Guide for Homeowners

    April 30, 2026

    What the Data Actually Shows |

    April 30, 2026
    Timer Code
    15 Second Timer for Articles
    20
    About Us
    About Us

    Welcome To big tee tech hub. Big tee tech hub is a Professional seo tools Platform. Here we will provide you only interesting content, which you will like very much. We’re dedicated to providing you the best of seo tools, with a focus on dependability and tools. We’re working to turn our passion for seo tools into a booming online website. We hope you enjoy our seo tools as much as we enjoy offering them to you.

    Don't Miss!

    AI swarms could hijack democracy without anyone noticing

    April 30, 2026

    Will Sentance on JS Modernization – Software Engineering Radio

    April 30, 2026

    Subscribe to Updates

    Get the latest technology news from Bigteetechhub about IT, Cybersecurity and Big Data.

      • About Us
      • Contact Us
      • Disclaimer
      • Privacy Policy
      • Terms and Conditions
      © 2026 bigteetechhub.All Right Reserved

      Type above and press Enter to search. Press Esc to cancel.