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

Posts under General subtopic

Post

Replies

Boosts

Views

Activity

Apple Pay guidelines clarification
Hello there, I have a couple of question about Apple Pay guidelines: • if we offer Apple Pay payment method in our app, can we disable the selection (I mean the method selection NOT the Payment button!) IF certain condition happens? E.g. the user cannot select apple pay payment method because our basket is not ready yet. • Are we forced to move the apple pay payment method on the top of our selection? E.g. Cards, Cash On Delivery, Coupon, Apple Pay --> Apple Pay, Cards, Cash On Delivery, Coupon One last technical question: • when we start the payment process we are gonna create the request and present the sheet BUT we have to call our backend for pre-authorization, is it allowed? @objc private func applePayButtonTapped(sender: UIButton) { // TODO: Is it allowed? // We need to ask to our backend a pre-authorization and THEN procced with Apple Pay flow // but this could be done ONLY after the user TAP on BUY with APPLE PAY and BEFORE // paymentAuthorizationViewController is called. // Are we compliant to do that? if PKPaymentAuthorizationViewController.canMakePayments(usingNetworks: FakeData.paymentInfo()) { let request = PKPaymentRequest() request.blablabla = blabla let authorizationViewController = PKPaymentAuthorizationViewController(paymentRequest: request) if let viewController = authorizationViewController { viewController.delegate = self present(viewController, animated: true, completion: nil) } } } Thanks in advance :)
1
0
1k
Nov ’24
Custom Button Image Sizing Issue
Hello, Im new to Xcode, ive been taking some classes and watching YouTube videos as well as using AI. Im having an issue I cannot find a video on, and AI just keeps screwing up my layout and sizing. Here is the issue, I have a Custom Made Image for my Sign In button, for my log in page on Xcode. The issue being that I can barely see the button and when I go to adjust the size the whole layout gets screwed up. My Logo Image (supposed to take up the top 50% of the screen) takes over the whole Botton of the screen and I loose my username and password Text threads and images. I guess my question is, is this an issue with the size of image ive uploaded or is this an issue with my code? I changed the size of the Image I created in Canva to 900pixles for the width and 300pixals for the height and that did absolutely nothing to my image in Xcode. Below is the Button and Create Account section in my code that seems to be having issues. Ppppplease help me. var body: some View { NavigationStack(path: $navigationPath) { ZStack { // Background image Image("Background1") .resizable() .scaledToFill() .ignoresSafeArea() .clipped() // Main content ScrollView { VStack(spacing: 20) { // Logo Image("DynastyStatDropLogo") .resizable() .scaledToFit() .padding(.top, -160) .padding(.bottom, -30) // Form elements // Username field ZStack { Image("UsernameBar") .resizable() .aspectRatio(contentMode: .fill) .padding() TextField("UserName:", text: $textInput) .padding(.horizontal, 75) .background(Color.clear) .foregroundColor(.red) .focused($focus, equals: .username) .submitLabel(.next) .onSubmit { focus = .password } } .frame(height: 50) .clipShape(RoundedRectangle(cornerRadius: 10)) .padding(.horizontal) // Password field and Forgot Password link VStack(spacing: 20) { ZStack { Image("PasswordBar") .resizable() .aspectRatio(contentMode: .fill) .padding() SecureField("Password:", text: $textInput2) .padding(.horizontal, 75) .background(Color.clear) .foregroundColor(.red) .focused($focus, equals: .password) .submitLabel(.go) .onSubmit { submitForm() } } .frame(height: 50) .clipShape(RoundedRectangle(cornerRadius: 10)) .padding(.horizontal) // Forgot Password link (right-aligned) HStack { Spacer() Text("Forgot Password?") .foregroundColor(.blue) .onTapGesture { navigationPath.append("passwordRecovery") } } .padding(.horizontal, 90) } Spacer(minLength: -110) // SignIn Button - Explicitly showing it HStack { Spacer() Button { submitForm() } label: { Image("signinButton") .resizable() .frame(width: 500, height: 400) } Spacer() } Spacer(minLength: -300) // Create Account (centered) HStack { Spacer() Text("Create Account") .foregroundColor(.blue) .onTapGesture { navigationPath.append("accountCreation") } Spacer() } .padding(.bottom, -10) } } } .onAppear { focus = .username } .navigationDestination(for: String.self) { destination in switch destination { case "dashboard": DSDDashboard() case "passwordRecovery": PasswordRecoveryView() case "accountCreation": AccountCreationView() default: EmptyView() } } .alert(isPresented: $showAlert) { Alert( title: Text("Missing Information"), message: Text("Enter UserName and Password to continue to DSD"), dismissButton: .default(Text("OK")) ) } } } // Function to handle form submission func submitForm() { focus = nil if textInput.isEmpty || textInput2.isEmpty { showAlert = true } else { print("Login with username: \(textInput), password: \(textInput2)") navigationPath.append("dashboard") } } // Enum to manage focus states enum FormFieldFocus: Hashable { case username, password } }
Topic: Design SubTopic: General
1
0
76
Mar ’25
Picker and DatePicker selection confusion
I have a multi view app I am trying to develop as my first app. I have gone through much of HackingwithSwiftui Xcode 16.1 SwiftUI on a MacAir The prior views in the app store various information. golf Course info in one and Golfers info in another. This third view is to record rounds of golf played. I started it simple with me entering input manually and that worked. I then decided to start using pickers with the first two being a DatePicker and the second pulling in the nickname(Handle) for players to select from. in a Handle Picker. Following is my code. I can select a date as of Now and prior for date played and also the second picker does pull in the all the Handles from my prior view and I can select a Handle of the player for the round. I then fill in all the other information. When I exit the view I do see that the Round is created but the Date always defaults to Now and the Handle stays blank. When i go back in to edit the round I can change the date and select a Handle but can get them to save. I have tried many things and searched for days on the web for examples with no luck. I am sure its something simple. Any help is appreciated as I want to add for pickers for course, tee and other fields. But until I figure out what I am missing the project is at a standstill. import SwiftUI import SwiftData struct RoundsEditDataView: View { @Bindable var roundsdata: RoundsData @Environment(.modelContext) private var modelContext @State private var playDate = Date.now @Query(sort: \PlayerData.playerHandle) private var players: [PlayerData] @State private var selectedHandle: PlayerData? = nil var body: some View { Form { HStack { Text("Course:") TextField("Course Name", text: $roundsdata.roundscourseName) .textContentType(.name) } HStack { DatePicker("Date:", selection: $playDate, in: ...Date(), displayedComponents: .date) } Section { Picker("Handle:", selection: $selectedHandle) { Text("Select a Handle").tag(nil as PlayerData?) ForEach(players, id: \.self) { player in HStack { Text(player.playerHandle) .frame(maxWidth: .infinity, alignment: .leading) .tag(player as PlayerData?) } .frame(maxWidth: .infinity, alignment: .leading) .tag(player as PlayerData?) } } // .pickerStyle(.inline) this does not fix issue or design wise work } The rest of this works fine for now until I decide to convert more to picker lists. HStack { Text("Tee:") TextField("Tee", text: $roundsdata.roundsTee) .textContentType(.name) } HStack { Text("Handicap:") TextField("Handicap", value: $roundsdata.roundsHandicap, format: .number) .textContentType(.name) } HStack { Text("*****:") TextField("*****", value: $roundsdata.roundsGross, format: .number) } HStack { Text("Net:") TextField("Net", value: $roundsdata.roundsNet, format: .number) .textContentType(.name) } HStack { Text("Rating:") TextField("Rating", value: $roundsdata.roundsRating, format: .number) .textContentType(.name) } HStack { Text("Slope:") TextField("Slope", value: $roundsdata.roundsSlope, format: .number) .textContentType(.name) } } } }
Topic: Design SubTopic: General
2
0
477
Dec ’24
CloudKit not storing or updating public data in real time.
My newly released App Snapshot-Chess-Move, #1592848671, is not creating a public database of chess moves as I expect. What steps do I need to do inorder for my App to be using a public database. It appears as if each of my iOS devices, iPhone, iPad and Mac mini each have a private database of chess moves. When I change my data on the iPad, I expect the new data to appear (with slight delays) on the Mac.. I do not know what to do next. Please help me. This was working in Development mode but not in Production when I submitted my App for release. UPDATE: The cloud data is copied locally to a @Quary variable and updated by using .insert, .delete and .save commands. So, I deleted and re-downloaded my apps on each device, iPad, iPhone, and Mac and obtained the same cloud data. So how do users get the most recent copy of the cloud. Do they need to delete their App and start over? Is there a .update command that can do this updating for me? Also, I pushed the App out of the background and restarted the App to obtain the updated cloud data.
Topic: Design SubTopic: General Tags:
3
0
112
Apr ’25
Getting original LocationNode from hit tested SCNNode
I would like to modify the content of a published LocationNode upon been clicked by the user. But unfortunately: func hitTest(_ point: CGPoint, options: [SCNHitTestOption : Any]? = nil) -> [SCNHitTestResult] returns an SCNNode array from which it is impossible to retrieve the original LocationNode being inserted in order to be able to modify it. Of course the solution would be to either insert the SCNNode corresponding to the inserted LocationNode in a custom class or conversely insert the identifier of the custom object as a tag of the LocationNode, in order to solve the issue. But both options seem impossible to implement. May anyone help me?
1
0
59
Apr ’25
WebView some of fonts became too small on ios 18.4 and on latest safari
Below is the sample css code where I render a web page in my webview screens fonts became too small after 18.4 and its so hard to read when I launch my app . Any workarounds to address this issue .sg-labels-canvas { font-size: 15px; display: flex; flex-direction: column; font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Roboto, sans-serif; font-style: normal; }
Topic: Design SubTopic: General
1
0
64
Apr ’25
Hardware needed for BLE pairing with iOS
Hi there, I'm working on a product which needs to pair with an iOS device (only iPad and iPhone) via Bluetooth. I already have the device pairing and operating fully with android or Windows hosts and have implemented BLE. Obviously, iOS isn't as simple as those for pairing. The product type is not listed under the MFi accessories. The question I have is what hardware and or firmware needs does the product needs to fulfil in order to pair/bond fully. I've seen some devices have a MFi security chip, some need to be manufactured in a MFi approved facility, I've no idea on the firmware requirements. We're starting the process of joining the MFi program too. So: Do I need the security chip? Where is the pairing process documented? Can I use BLE or do I need to use classic Bluetooth or core Bluetooth? Any help would be greatly appreciated because I'm kind of lost. Thanks, Louis
4
0
900
Oct ’24
NavigationStack Fatal error: ‘try!
I am struggling to get pickers work in a form. I add NavigationStack and get this error Fatal error: 'try!' expression unexpectedly raised an error: SwiftUI.AnyNavigationPath.Error.comparisonTypeMismatch I have tried most every format or picker setup as well as DatePicker and can’t seem to determine how to get the selected item in a picker list saved. running: Xcode 16.1 import SwiftUI import SwiftData struct RoundsEditView: View { @Bindable var roundsdata: RoundsData @Environment(.modelContext) private var modelContext // @Environment(.dismiss) var dismiss @State private var playDate = Date.now @State private var selectedTee = "Gold" let tees = ["Black", "Blue", "White", "Gold", "Red", "Silver"] @Query(sort: \PlayerData.playerHandle) private var players: [PlayerData] @State private var selectedHandle: PlayerData? = nil var body: some View { NavigationStack { Form { HStack { Text("Course:") TextField("Course Name", text: $roundsdata.roundscourseName) .textContentType(.name) } HStack { // DatePicker("Date:", selection: $playDate, in: ...Date(), DatePicker("Date:", selection: $playDate, displayedComponents: [.date]) // DatePicker("Date:", selection: $playDate, in: ...Date(), // displayedComponents: .date).onChange(of: playDate) { oldState, newState in model.youDidChangeMethod(from: oldState, to: newState) } Section { Picker("Handle:", selection: $selectedHandle) { Text("Select a Handle").tag(nil as PlayerData?) ForEach(players, id: \.self) { player in HStack { Text(player.playerHandle) .frame(maxWidth: .infinity, alignment: .leading) .tag(player as PlayerData?) } .frame(maxWidth: .infinity, alignment: .leading) .tag(player as PlayerData?) } } // .pickerStyle(.inline) this does not fix issue or design wise work } // HStack { // Text("Tee:") // TextField("Tee", text: $roundsdata.roundsTee) // .textContentType(.name) // } HStack { Picker("Tee:", selection: $selectedTee) { ForEach(tees, id: \.self) { Text($0) } } } HStack { Text("Handicap:") TextField("Handicap", value: $roundsdata.roundsHandicap, format: .number) .textContentType(.name) } HStack { Text("*****:") TextField("*****", value: $roundsdata.roundsGross, format: .number) } HStack { Text("Net:") TextField("Net", value: $roundsdata.roundsNet, format: .number) .textContentType(.name) } HStack { Text("Rating:") TextField("Rating", value: $roundsdata.roundsRating, format: .number) .textContentType(.name) } HStack { Text("Slope:") TextField("Slope", value: $roundsdata.roundsSlope, format: .number) .textContentType(.name) } } .navigationTitle("Edit Rounds") } } }
Topic: Design SubTopic: General
10
0
1.2k
Nov ’24
iPad/iPhone - Display best practices….
So…I am hitting a wall here and could use some guidance towards best practice. I’ve developed an app in Xcode/SwiftUI that renders just fine on the iPhone - text, images, buttons, frames…everything is nicely centered on the screen or scrolls where and when I want. The iPad though…not so much. I’m having issues with tops and bottoms being cut off in scrollviews. These are just straight up text screens too - the ones with other elements/controls…they’re rendering fine. I’ve tried a mix of geometry, vstack, scrollview, padding, spacers…the lot of it. Nothing I seem to do works - the views do not want to fill and fit properly. And, of course, the issue becomes worse the moment you flip the iPad into landscape view. Or use the 13” models. I’d imagine others are battling these issues as well and found solutions, so I decided to hit up the brain trust.
3
0
121
Apr ’25
Repost : Analog Clock on lock screen
When we are going to have a real analog clock option on the lock screen. If an apple watch can do it surely its not that difficult. For someone who uses a clock to tell what time it isn't as opposed to what time it is, i’m constantly having to convert a digital image where the image of hands on a dial is so much easier. Surely this isnt because someone has forgotten how to read a clock
Topic: Design SubTopic: General
1
0
85
Apr ’25
Ask about SF symbols
Hi, I would like to make an educational app for helping my students to learn about malaria diagnosis and need to put some animal icon. In the tabview, is it possible to use system images like monkey, bird, mouse. I cannot see these animals in SF symbol list.
Topic: Design SubTopic: General
3
0
126
May ’25
How to use FreePascal with my iMac 27” Intel
I would like to use FreePascal with my iMac 27” - late 2015 - CPU: 3.2 GHz Intel Core i5 quad-core - macOS Monterey 12.7.6. I can't figure out what I need to do to install XCode11 and how I can get the compiler to work. Can anyone help me? Thanks! Vorrei usare FreePascal con il mio iMac 27” - late 2015 - CPU: 3,2 GHz Intel Core i5 quad-core - macOS Monterey 12.7.6. Non riesco a capire cosa devo fare per installare XCode11 e come posso fare per far funzionare il compilatore. Qualcuno può aiutarmi? Grazie!
Topic: Design SubTopic: General
2
0
442
Dec ’24
Picker list based on a selection from another Picker list
I have come quite far with my first app and have various picker lists working well. However, I am stuck thinking through how to do this next picker. My data model has Golf Course name and Tee. For each golf course there are multiple Tees and not all the same across the Courses. Example of Data CourseA RedTee CourseA GreenTee CourseA BlueTee CouseB RedTee CourseB YellowTee CourseB WhiteTee I first give the client the ability to Pick a Course from a picker list. That works fine. Now I want to create a Picker list of Tees but only for that selected Course. So if the client selected CourseB they would be presented with these Tees to select from RedTee YellowTee WhiteTee How do I limit the second picker to only show the Tees for the selected Course? Then in an associated question, once i have the Course and the Tee, I want to Auto fill the rest of a form with Slope, Rating and Yardage. @Model class ScorecardData { var scorecardcourseName: String var scorecardTee: String var scorecardSlope: Double var scorecardRating: Double var scorecardYardage: Int Here is my code for the Course Picker List Picker("", selection: $selectedCourse) { Text("Select a Course").tag(" ") ForEach(courses, id: \.self) { course in Text(course.courseName) .tag(course.courseName) } } .onChange(of: selectedCourse) { if(selectedCourse != nil) { roundsdata.roundscourseName = selectedCourse! } } Here is my current Picker list but its pulling all Tees for all Courses Picker("", selection: $selectedTee) { Text("Select Tee").tag(" ") ForEach (tees, id: \.self) { tee in Text(tee.scorecardTee) .tag(tee.scorecardTee) } } .onChange(of: selectedTee) { if(selectedTee != nil) { roundsdata.roundsTee = selectedTee! } } My @State and @Query statements are as follows in case there is a change there that is needed as well, @State private var selectedTee: String? = "Select Tee" @Query(sort: \ScorecardData.scorecardcourseName) private var tees: [ScorecardData] @State private var selectedCourse: String? = "Select Course" @Query(sort: \CourseData.courseName) private var courses: [CourseData]
Topic: Design SubTopic: General
3
0
461
Dec ’24
UITabBarController with sidebar on iPadOS 18
When I create a tab group for the sidebar on iPad, the title and disclosure triangle act like a single control. Every time I tap the section title, the disclosure triangle for that section activates and hides or exposes that section's children and actions. I want the section title to behave like Photos, where tapping a section title just displays its view controller, and the disclosure triangle is a separate control that must be tapped to hide and show children and actions. I did not see any delegate methods that would let me control this behavior. Is this supported?
1
0
147
May ’25
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
456
Oct ’24
Meetings color in calendar
Hi, starting from iOS18, it is impossible to differentiate between completed meetings and future meetings in calendar - almost the same color (unless I switch to dark mode). Is there a way to fix it or is it a human engineering bug?
Topic: Design SubTopic: General Tags:
2
0
493
Oct ’24