Explore the art and science of app design. Discuss user interface (UI) design principles, user experience (UX) best practices, and share design resources and inspiration.

Learn about designing great app and game experiences

Post

Replies

Boosts

Views

Activity

Buttons in NavigationBar
Hi Guys, I saw in iOS 18 (Photos App) that there are buttons (in an scrollview) below the navigation title and inside the navigation bar. Is there an new API or an method to "clone" this UI without using: .safeAreaInset(edge: .top, content: { }) Thanks in advance for any feedback and help!
0
0
192
2w
iOS 18 (22A3354) icons dark/light swapping
I am seeing a bug with the use of iOS 18’s Customize Automatic setting. When swiping from page view to page view forward and back, the apps’ icon version of dark or light change with each return to that page, constantly…first view the app’s icon is light, return view and it’s dark, then return a next time and it’s back to light. Going further, switching the Customize dark/normal background setting (the sun icon in top left) resolves once clicked.
0
0
734
2w
Video Playback on iOS 18 public release is seriously flawed
Video Playback on iOS 18 public release is asinine. I use video playback to show slow-motion video frame by frame to my students and the video can only be shown at like 3/5 of the screen size (just like Apple fouled up screenshot editing about a year ago) If you try to view video in the full screen you can’t scrub through and see time stamps or play frame by frame sliding left to right. It’s absolutely ridiculous. 2 out of 3x the video timeline finishes fully right and I haven’t watched the full clip. Here’s a video showing the issue how at the small default size I can see the entire timeline and play the full video from beginning to end, but when I go to full screen and/or zoom in or move the screen around the timeline doesn’t work and you can’t scroll through the full video! Need the video to not condense in size on the screen and play the full height / width of the screen. Also not have the text of the location showing above the screen. Way too much clutter. The reduced size of the video for editing issue started with photos several updates ago and now Apple idiotically brought a terrible flaw from photos to videos as well. Ugh.
5
6
654
2w
Menu in SwifUI
Hi, i´m trying to get a menu with three rows. The top one should be a HStack with three RoundedRectangle (Red, Yellow and Green). The second row and the third one (both separated with a Divider from the top one) are for edit and delete. But I get five rows, three empty rows plus the edit row and the delete row. The three first rows are empty but they execute the moveTask function correctly. I don't know how to solve this. Can anybody help please? struct TaskView: View { @EnvironmentObject var viewModel: BoardViewModel @EnvironmentObject var languageManager: LanguageManager @State private var isEditing = false let task: Task var body: some View { HStack(alignment: .center, spacing: 8) { Text(task.title) .font(.system(size: 16, weight: .medium)) .foregroundColor(.primary) .lineLimit(4) .multilineTextAlignment(.leading) .fixedSize(horizontal: false, vertical: true) Spacer(minLength: 0) Menu { ColorButtonsView(task: task, viewModel: viewModel) Divider() Button(action: { self.isEditing = true }) { Label(languageManager.localizedString("edit"), systemImage: "pencil") } Button(action: { viewModel.deleteTask(task) }) { Label(languageManager.localizedString("delete"), systemImage: "trash") } } label: { Image(systemName: "ellipsis") .font(.system(size: 20)) .foregroundColor(.gray) .frame(width: 30, height: 30) } } .padding(.vertical, 8) .padding(.horizontal, 12) .background(Color.white) .cornerRadius(10) .shadow(color: Color.black.opacity(0.1), radius: 3, x: 0, y: 1) .sheet(isPresented: $isEditing) { EditTaskView(task: task, viewModel: viewModel) } } } struct ColorButtonsView: View { let task: Task let viewModel: BoardViewModel var body: some View { HStack(spacing: 10) { ForEach(Column.allCases, id: \.self) { column in Button(action: { viewModel.moveTask(task, to: column) }) { RoundedRectangle(cornerRadius: 5) .fill(colorForColumn(column)) .frame(width: 30, height: 30) } } } } private func colorForColumn(_ column: Column) -> Color { switch column { case .toDo: return .red case .inProgress: return .yellow case .done: return .green } } }
0
0
151
2w
iOS 18 Search Bar Bug
Hello, Whenever I swipe down on the homepage to pull up the search bar, and go to type something in it, it’s really glitchy and buggy. Oftentimes the search bar keeps reloading and I can’t seem to type more than one letter at a time without an issue. Please look into this.
0
1
332
2w
iOS 18 Photo Gallery
Who on Earth okayed this new photo gallery design? I can’t find anything, scrolling is not smooth, there’s a bunch of content categories I will literally never view that I can’t remove from the gallery, this is EXTREMELY frustrating. How can I revert back to iOS 17?
1
0
276
2w
[iOS 18] Is there an SF Symbol of the new icon in Safari's address bar?
The following icon has been introduced in Safari's address bar for iOS 18: I’d like to use it in my app to guide users on how to enable my Safari extension, but I couldn’t find it in SF Symbols beta 6.0 (99). Is this because it’s still in beta and will be available for third-party use later, or is it a private icon that only Apple can use? I hope I just overlooked something.
1
0
252
2w
Improvement to Future IPhones and Apple Watches
It would be a great innovation to incorporate a Card Reader into both iPhones and Apple Watches. The user could open the card reader app on his watch or phone, enter the amount to be paid into his nominated bank account (eg £15) ready for the purchaser/customer to tap his card to make the contactless payment. It would simplify my everyday life enormously because I hardly ever carry cash these days.
0
0
144
1w
iOS 18 dark mode
Hello, I am a UI designer. I am trying to modify our app's icon to accommodate Apple's iOS 18 dark mode. Our app icon is quite complex in shape, making it difficult to recognize in dark mode. Is it okay if the shape differs slightly between light mode and dark mode? Or should I just change the color?
0
0
206
1w
Is it possible to display three lines within a row of a list view
Following is a row item within a section of CPListTemplate, CPListItem(text: "Station 1", detailText: "Details\nforStation 1") In the above, is it possible to display data in three lines? I have seen couple of CarPlay apps that do it within a list. However, I am not sure how this can be done. Kindly suggest some ideas Currently I have the below, I want to achieve the below, three lines with a row
1
0
114
1w
iOS 18 Underlined Feature 😭
Dear Apple, I’m loving the IOS 18 update so fa; everything is awesome. However could you please takeoff the underlined feature. It’s makes text so difficult to look at and disrupts the simplistic nature of an iPhone. 🥹😭🙏
2
0
141
1w
New ios 18 update
Hi apple I love the new update but one thing that bothers me is that when we are customizing the app colors it only lets us do the black or white background for it and in order to do that your whole phone has to be on light or dark mode. id like to make a suggestion to let us change the background and logo on the app. thank you
0
0
172
1w
App swiftui no funciona en ios 18
Hola, cree una app en swiftui, la version minima de ios 16.2, la desarrolle en xcode 15 sin problema, funcionaba hasta ios 17 sin inconvenientes, actualice a xcode 16 ahora que la ejecuto en ios 18 presenta problemas en varios elementos de la interfaz, por ejemplo cuando toco un boton no desencadena una acción inmediata, tengo que sostener el toque en el boton para que reaccione y asi varios elementos que necesito tocar para llamar una acción, probe la app y funciona correctamente en dispositivos con ios desde el 16.2 al 17, intente modificar el código de los elementos para mejorar el gesto de tocar, pero no funciona, no se porque pasa esto en IOS 18, alguna sugerencia para resolver esto, gracias.
1
0
180
1w
MapAnnotation Position
I am working on a MapView with MapAnnotation on the Map and am having difficulty getting the MapAnnotation to function properly when selected. In my code, I want the MapAnnotation selected to be to the front if it is behind or partially blocked by another annotation. I have tried using a zIndex but this does not appear to work. Below is my MapView code along with a screenshot of the issue. Any help would be greatly appreciated. struct HospitalMapView: View { @StateObject var viewModel = HospitalViewModel() @State private var showSearchView = false @State private var showListView = false @State private var selectedTab: Int = 0 var body: some View { ZStack { VStack(spacing: 0) { TopTabView() // Map that updates the visible hospitals when the user moves or adjusts the map Map(coordinateRegion: $viewModel.region, interactionModes: .all, annotationItems: viewModel.filteredHospitals) { hospital in MapAnnotation(coordinate: CLLocationCoordinate2D(latitude: hospital.latitude, longitude: hospital.longitude)) { RoundedRectangle(cornerRadius: 40) .fill(viewModel.colorForPercentile(viewModel.calculatePercentile(for: hospital, in: viewModel.filteredHospitals))) .frame(width: 70, height: 30) // Maintain consistent size, adjust if necessary .overlay( Text("$\(Int(hospital.baseCharge / 1000))K") .foregroundColor(.white) .bold() ) .overlay( RoundedRectangle(cornerRadius: 40) .stroke(Color.blue, lineWidth: viewModel.selectedHospital == hospital ? 3 : 0) ) .onTapGesture { viewModel.selectHospital(hospital) // Move the selected hospital to the end of the list to bring it to the front viewModel.bringHospitalToFront(hospital) viewModel.showBottomSheet = true } .scaleEffect(viewModel.selectedHospital == hospital ? 1.1 : 1.0) // Highlight the selected hospital .zIndex(viewModel.selectedHospital == hospital ? 1 : 0) // Set the zIndex higher for the selected hospital .animation(.easeInOut, value: viewModel.selectedHospital) // Smooth transition } } .onAppear { // Initial update of visible hospitals when the map appears viewModel.updateFilteredHospitals() } .onChange(of: viewModel.region) { _ in // Update the visible hospitals as the user changes the map region viewModel.updateFilteredHospitals() } .edgesIgnoringSafeArea(.all) } // Hospital count display hovering over the map Text("\(viewModel.filteredHospitals.count) Hospitals") .font(.subheadline) .foregroundColor(.white) .padding(8) .background(Color.black.opacity(0.6)) .cornerRadius(10) .padding(.top, -315) // Adjust padding to position correctly below the TopTabView .zIndex(1) // Ensure it's above the map if let selectedHospital = viewModel.selectedHospital, viewModel.showBottomSheet { BottomSheetView(isOpen: $viewModel.showBottomSheet, maxHeight: UIScreen.main.bounds.height * 0.3) { SummaryTabView(selectedHospital: Binding( get: { selectedHospital }, set: { newValue in viewModel.selectHospital(newValue) } )) } .transition(.move(edge: .bottom)) .animation(.spring()) } } .safeAreaInset(edge: .bottom) { BottomTabView(selectedTab: $selectedTab, showListView: $showListView, showSearchView: $showSearchView, onSearchSelected: { showSearchView = true showListView = false }, onHomeSelected: { showSearchView = false showListView = false }, onListSelected: { showListView = true showSearchView = false }) } .fullScreenCover(isPresented: $showSearchView) { SearchView(viewModel: viewModel, showSearchView: $showSearchView, selectedTab: $selectedTab, showListView: $showListView) } .fullScreenCover(isPresented: $showListView) { ListView(selectedTab: $selectedTab, showListView: $showListView, showSearchView: $showSearchView) .environmentObject(viewModel) } .environmentObject(viewModel) } }
0
0
150
1w
Should my app use Apple's in-app purchase (b2b app)?
Hi, Our application is a B2B app, supporting users from companies that own our equipment (print industry). We want to allow company stakeholders to have a "Premium Plan" that will provide their company with numerous advantages in different aspects (service, training, data visibility) Some features in our app will be locked/hidden if the company is not part of the Premium Plan. We want to allow authorized users to activate the Premium plan for their entire company. We already have our website, where we already have a marketplace that allows web users to do this (using their company service agreement). In term of complying with Apple's in-app purchase Policy, is it ok to tell users in the app to go to this marketplace if they want these features (and more)? Thank you
1
0
182
1w
Background modes in Flutter project (Android Studio)
Hello, I'm developing an iOS app in Flutter, but I'm having trouble enabling Background Mode. I added the following configuration to Info.plist and Runner.entitlements: <key>UIBackgroundModes</key> <array> <string>processing</string> <string>fetch</string> <string>location</string> </array> However, the Background Mode option doesn't appear in my App ID to be enabled. And the build fails with the message: Provisioning profile "Ready Response ios_app_store ..." doesn't include the UIBackgroundModes entitlement. How can I enable this option in my App ID? Note: I'm using Android Studio and publishing through Codemagic.
2
0
265
1w