Create elegant and intuitive apps that integrate seamlessly with Apple platforms.

All subtopics
Posts under Design topic

Post

Replies

Boosts

Views

Activity

MusicKit design guidelines
Hi community, I have a question regarding MusicKit, is it necessary to follow a design guideline to integrate this framework into my App? Also, when no music is reproducing in MusicKit which placeholder we should show, do you provide the resource? Or can we create our own placeholder? Thanks for all, David.
1
0
615
Feb ’25
Correct way to label TextField inside Form in SwiftUI
Hello everyone. I'm building a simple Form in a Multiplatform App with SwiftUI. Originally I had something like this. import SwiftUI struct OnboardingForm: View { @State var firstName: String = "" @State var lastName: String = "" @State var email: String = "" @State var job: String = "" @State var role: String = "" var body: some View { Form { TextField("First Name", text: $firstName, prompt: Text("Required")) TextField("Last Name", text: $lastName, prompt: Text("Required")) TextField("Email", text: $email, prompt: Text("Required")) TextField("Job", text: $job, prompt: Text("Required")) TextField("Role", text: $role, prompt: Text("Required")) } } } #Preview { OnboardingForm() } In macOS it looks ok but then in iOS it looks like this: and it's impossible to know what each field is for if all the prompts are the same. I tried adding LabeledContent around each text field and that solves it for iOS but then on macOS it looks like this: The labels are shown twice and the columns are out of alignment. I think I could get around it by doing something like this: #if os(iOS) LabeledContent { TextField("First Name", text: $firstName, prompt: Text("Required")) } label: { Text("First Name") } #else TextField("First Name", text: $firstName, prompt: Text("Required")) #endif but it seems to me like reinventing the wheel. Is there a "correct" way to declare TextFields with labels that works for both iOS and macOS?
2
0
950
Feb ’25
Email icons
The most recent update included coloured icons for grouping of emails anybody previously needing to group emails we’re able to achieve this alphabetically by simply searching for what you were looking for. These icons clutter the page with totally unnecessary screen pollution. if you want to persist with this folly can you please provide a classic display option for those of us who have happily survived using email for 30 years without this fluff.
Topic: Design SubTopic: General Tags:
2
0
610
Feb ’25
My iOS game is compatible with visionOS and MacOS
I already have an opinion ( I should never release to a platform without testing on a physical platform device ) on this but wanted to learn from experience and expertise and see if there were any viable options. My hybrid casual puzzle game is released on the App Store for iOS. (Whew!) Apparently it is compatible to both Mac OS and VisionOS I would love to make it available everywhere however, I am not sure it is best to do so without testing on these physical devices. Which could also mean making the design adjustments for those devices, having test devices ready etc. and I would have to update my Laptop to silicon. Has anyone tried this without testing on physical devices? What are your thoughts/best suggestions? Thanks in advance!
2
0
382
Mar ’25
Removing Grid Lines from Charts in SwiftUI
Hi, I have created a line graph using LineMark in Charts, which by default includes grid lines and axes lines. My requirement is to remove the grid lines but retain the axes lines and the values. I have tried the following code: .chartXAxis { AxisMarks(preset: .extended, values: .stride(by: 2), stroke: StrokeStyle(lineWidth: 0)) } This is removing grid lines as well as axes lines. How to retain axes lines while removing grid lines ?
2
0
335
Feb ’25
Design-Copycats Rejection
Hi, Since last week, I’ve been trying to publish the new version of my Voxel game, which aims to fix many bugs and significantly optimize the game. This update is very important for improving the overall quality of the game. Unfortunately, this version is not being accepted on the App Store due to a Design - Copycats issue related to guideline 4.1. I’ve tried everything to resolve the problem by changing the screenshots, app preview, description, game name, icons, and even all metadata that could cause issues in the build. But nothing seems to work. I keep receiving the same rejection just a few minutes after submitting my build for review. Here is the full warning message: —————— “Guideline 4.1 - Design - Copycats This app or its metadata appears to be misrepresenting itself as another popular app or game already available on the App Store, from a developer's website or distribution source, or from a third-party platform. Apps should be unique and should not attempt to deceive users into thinking they are downloading something they are not.” Next Steps Learn more about requirements to prevent apps from impersonating other apps or services in guideline 4.1. Revise the app to comply with these requirements. Once the app is fully compliant, resubmit the app for review. —————— Also I've already tried contaction the Apple Developer team but I got no answer. I don't know what to do. Thanks
2
0
494
Oct ’25
Image & Text inside picker.
Hi, I am trying to use a flag image inside a picker like this: Picker("Title: ", selection: $selection){ ForEach(datas, id: \.self){ data in HStack{ Text(data.name) if condition { Image(systemName: "globe") }else { Image(img) } } .tag(data.name) .padding() } } All images are loading successfully but only system images are resized correctly. Images loaded from Assets are appearing in their default size. I have tried to size the images with frames, etc but with no luck. Any idea, help will be much appreciated. Thanks in advance!
2
0
341
Feb ’25
Guideline 4.3(a) - Design - Spam
Dear App Review team, My app Goodie AI (Apple ID 6741483227) has been flagged as violating Guideline 4.3(a) - Design - Spam. I thought I would reach out to the team to explain that Goodie AI is an entirely original concept, and would seek guidance on if we misunderstood what specifically the problem with the submission is. DESCRIPTION Please suggest next steps? We've already appealed, and have resubmitted the app. Thanks! SCREENSHOTS ATTACHED
3
0
607
Mar ’25
MacOS: Spacing between NavigationLink-s in a sidebar with NavigationView.
How can I put one list item at the top and another one at the bottom, retaining the NavigationView functionality? Here is a simple app: struct ContentView: View { var body: some View { NavigationView { Sidebar() } } } struct Sidebar: View { @State private var isActive = true var body: some View { List { NavigationLink(isActive: $isActive) { HomeView() } label: { Text("Home") } NavigationLink { SettingsView() } label: { Text("Settings") } } } } struct HomeView: View { var body: some View { VStack {} .navigationTitle("Home") } } struct SettingsView: View { var body: some View { VStack {} .navigationTitle("Settings") } } Which looks like this: My initial though was to put a Spacer() between each NavigationLink, but it results in an unexpected view: What i can do: Place an empty VStack between each NavigationLink with a hard-coded height like this: VStack {}.frame(height: 275) Which looks like this: But it wouldn't work if a user would want to increase the height of a window. I could disable window resizing which is kind of fine, but not the most optimal. Another obvious option was to replace the List with a VStack, but with this approach the styling of the NavigationLink gets broken and it does not get highlighted when I click on it. It looks like this: P.S. I know that NavigationView is deprecated, but i want to support macOS 12.0.
1
0
323
Mar ’25
I found SwiftUI SF Symbols bug from WWDC24
Summary: At WWDC24, a new transition was introduced by the Apple Design team (.contentTransition(.symbolEffect(.replace))) I was writing a post about it on my LinkedIn (https://www.linkedin.com/in/alex-fila/), and out of curiosity I tried multiple symbols with slashes. Many of them were not well center aligned during a new symbol effect. Some of the examples are: "speaker.fill" : "speaker.slash.fill”, "eye.fill" : "eye.slash.fill”. Please check the attached Swift file for more details and full SwiftUI View with issues. Steps to Reproduce: Create a new IOS App project in XCode. Create a new SwiftUI File. Initiate state variable: @State private var isSpeakerOn = true. Create a new image with transition: Image(systemName: isSpeakerOn ? "speaker.fill" : "speaker.slash.fill") .contentTransition(.symbolEffect(.replace)). 5. Create a switcher or set a timer with a constant variable to toggle isSpeakerOn value (see attachment file). 6. Toggle isSpeakerOn value. 7. Observe the issue (2 symbols are not well center aligned during transition). Expected Results: During transition .contentTransition(.symbolEffect(.replace)) 2 SF symbols ("speaker.fill" : "speaker.slash.fill”) are well center aligned. Actual Results: During transition (when slash slowly appears on top of SF symbol), the main symbol is moved a few points up, creating a decentralized effect and making the user experience feel inconsistent. Notes: There are 200 SF Symbols with .slash that might be affected. It happens on latest Xcode and macOS versions, and could be a top priority for the Apple Design Team. import SwiftUI struct BUG: View { @State private var isSpeakerOn = true let timer = Timer.publish(every: 1.5, on: .main, in: .common).autoconnect() let columns = [ GridItem(.flexible(), spacing: 20), GridItem(.flexible(), spacing: 20) ] var body: some View { LazyVGrid(columns: columns, spacing: 60) { Text("❌").font(.system(size: 100)) Image(systemName: isSpeakerOn ? "speaker.fill" : "speaker.slash.fill") .font(.system(size: 200)) .frame(width: 200, height: 100, alignment: .center) .contentTransition(.symbolEffect(.replace)) .symbolRenderingMode(.palette) .foregroundStyle( Color.primary, Color.accentColor) .onReceive(timer) { _ in withAnimation(.spring(response: 0.3, dampingFraction: 0.7)) {isSpeakerOn.toggle()}} Text("✅").font(.system(size: 100)) Image(systemName: isSpeakerOn ? "bell.fill" : "bell.slash.fill") .font(.system(size: 170)) .frame(width: 150, height: 150, alignment: .center) .contentTransition(.symbolEffect(.replace)) .symbolRenderingMode(.palette) .foregroundStyle( Color.primary, Color.accentColor) .onReceive(timer) { _ in withAnimation(.spring(response: 0.3, dampingFraction: 0.7)) {isSpeakerOn.toggle()}} Text("❌").font(.system(size: 100)) Image(systemName: isSpeakerOn ? "eye.fill" : "eye.slash.fill") .font(.system(size: 150)) .frame(width: 200, height: 100, alignment: .center) .contentTransition(.symbolEffect(.replace)) .symbolRenderingMode(.palette) .foregroundStyle( Color.primary, Color.accentColor) .onReceive(timer) { _ in withAnimation(.spring(response: 0.3, dampingFraction: 0.7)) {isSpeakerOn.toggle()}} } .padding(40) }} #Preview { BUG() }
2
0
310
Mar ’25
Codesign Error When Publishing iOS MAUI App in Visual Studio Code
I am experiencing an issue when publishing my .NET MAUI application for iOS using Visual Studio Code. During the publishing process, I encountered a codesign error. Hope someone can help me. This is the error: Warning: unable to build chain to self-signed root for signer "Apple Distribution: SOFTBUILDER SDN. BHD. (********)" /Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/bin/Release/net8.0-ios/ios-arm64/MLBusinessCafe_Maui.app: errSecInternalComponent /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : /usr/bin/codesign exited with code 1: [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios] /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : Warning: unable to build chain to self-signed root for signer "Apple Distribution: SOFTBUILDER SDN. BHD. (U44UY7DYY7)" [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios] /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : /Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/bin/Release/net8.0-ios/ios-arm64/MLBusinessCafe_Maui.app: errSecInternalComponent [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios] /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : Failed to codesign '/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/bin/Release/net8.0-ios/ios-arm64/MLBusinessCafe_Maui.app': Warning: unable to build chain to self-signed root for signer "Apple Distribution: SOFTBUILDER SDN. BHD. (U44UY7DYY7)" [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios] /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : /Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/bin/Release/net8.0-ios/ios-arm64/MLBusinessCafe_Maui.app: errSecInternalComponent [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios] /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios] /usr/local/share/dotnet/packs/Microsoft.iOS.Sdk.net8.0_18.0/18.0.8316/tools/msbuild/iOS/Xamarin.Shared.targets(2335,3): error : [/Users/frankongthuanhong/Desktop/App/MLBusinessCafe_Maui/MLBusinessCafe_Maui/MLBusinessCafe_Maui.csproj::TargetFramework=net8.0-ios]
2
0
344
Mar ’25
4.3(a) - Design
Hello, Appeal Ticket: APL149985 Thank you for your patience as we considered your appeal. The App Review Board determined that the original rejection feedback was valid. Your app does not comply with: 4.3(a) - Design During our review, we found that this app duplicates the content and functionality of other apps submitted to the App Store, which is considered a form of spam and not appropriate for the App Store. Apps submitted to the App Store should be unique and should not duplicate other apps. We encourage you to create a unique app to submit to the App Store. For more information about developing apps for the App Store, visit the Develop section of the Apple Developer website. We appreciate your efforts to resolve this issue and look forward to reviewing your revised submission. Best regards, Leo App Review Board BlockQuote a Blockchain based slg game got 4.3 a, I think the reviewer should know some thing about blockchain. 您好,我已经重新提交了一个版本的应用,和之前版本已经不同了,目前游戏的所有代码都是我自己写的,第三方的所有代码都被我移除了,所以代码上重复了其他游戏的是完全不存在的。 至于游戏玩法上,新的自定义技能冲榜系统,玩家可以通过“抽卡-编辑阵容-连续挑战”的方式,在遇到瓶颈时自定义技能突破关卡,这个玩法绝对是开创性的,因为已知的所有slg游戏的技能都是官方设计决定的,但是在我设计的这个玩法上,理论上所有的技能都将由玩家设计出来,这差别之大,正如区块链开创了一种崭新的去中心化的时代,和原有中心化的模式是完全不同的,据我所知,目前市面上不存在任何一款去中心化的slg游戏。但是您,尊贵的审核人员居然认为这样一款开创性的游戏是和其他中心化游戏是一样的,类同的,我相信苹果作为全球最伟大的科技公司,官方工作人员都是很专业的,都是很有见识的,都是主张创新的,主张玩家能获得独特的高质量的体验,但是这个拒绝让我疑惑。
1
0
207
Apr ’25
Game Rejected as Spam
My app is being rejected and all I'm being told is that it is spam. I've tried improving various aspects of the game, but I just receive the same copy and paste rejection message each time. I have no idea if I'm moving in the right direction or what part of my game needs to be changed or improved. Is there a game quality benchmark document or some kind of resource I can use to better understand why my game is being rejected and how to bring it to a level that meets apple's standards.
1
0
96
Apr ’25
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
143
Apr ’25
Cannot configure contentShape for final preview of .contextMenu(menuItems: , preview: )
Without using a custom preview, you can set .contentShape(RoundedRectangle(cornerRadius: 30)) so that in the "zoomed in" preview of the contextMenu you can have a custom cornerRadius. However, this does not work if you create a custom preview, because then the ContentShape gets applied only to the LIFT PREVIEW, and not to the FINAL PREVIEW state. Heres a sample code - I'd love some support! :) import SwiftUI struct ContentView: View { var body: some View { VStack { Rectangle() .fill(Color.blue) .frame(width: 300, height: 300) .cornerRadius(30) .contentShape(.contextMenuPreview, RoundedRectangle(cornerRadius: 30)) .contextMenu { Button("Hello") {} Button("Goofy") {} } preview: { Rectangle() .fill(Color.blue) .frame(width: 300, height: 300) .cornerRadius(30) //.contentShape(RoundedRectangle(cornerRadius: 30)) //.contentShape(.contextMenuPreview, RoundedRectangle(cornerRadius: 30)) } Text("contextMenu item with large cornerRadius is not working as expected... No way to set contentShape to custom corner radius for final preview - not the lift preview") } } }
1
0
88
May ’25
Reset SwiftUI animation for another step.
I was trying to move from appkit to swiftUI. As a learning project I am building a cellular automata style project based on Pattersons Worms.. I am trying something similar to the EA game Worms? for the Commodore 64. There is a video on YouTube of the game running, but I'm not allowed to link it here. The problem I have is that the animation is driven by a ruleset. When the automata hits a configuration that is not in the ruleset it is supposed to stop and ask the user. For each step the model returns either the next move, or nil to indicate the user need to make a choice that will be sent back to the model to be added to the ruleset. My current approach, and I might be following the wrong path, is a ZStack where the bottom level is the grid, the middle level is the established worm segments and the top level is either the animation of the next worm segment or the user chooser to choose the segment. I've only implemented the animation of the next worm segment. The idea is that when the model adds a segment that it first animated at the top level and then displayed by the middle level. Then the top level animates the next segment. I was animating the trim on the segment to draw the line. If the current move is nil, then the middle level draws the segment. If current move has a value, the animation draw it, and then on completion sets the current move to nil so that the bottom level draw it. The problem I ran into was resetting the animation to draw the next segment. I've tried two approaches. in one the completion resets the animation boolean variable, but I need a manual step to set the next stage of the animation. The other uses the completion to set the next step, but it the animation doesn't run for the step and the display is an always a step behind. I'm not sure how to both update the move and reset the animation at the same time. I have uploaded a simplified version without the full grid and simplified model to GitHub (https://github.com/thomasrdean/AnimationTest). Is there any other way to reset the animation the than the completion so I can use the completion to retrieve the next step from the model?
1
0
88
May ’25
[Proposal] Sense & Store – Intelligent App Suggestions from Safari (with On-Device AI)
Hello everyone, I’d like to propose Sense & Store — a seamless integration between Safari and the App Store, powered by on-device AI, designed to understand what users are reading, searching, or selecting in Safari, and suggest relevant apps that match their current context or intention. 🔍 Key Idea: “Sense” the user’s need through intelligent analysis of web content, then “Store” — offer the most relevant app, either already installed or available in the App Store. 🌟 Core Features: • AI-powered context detection directly inside Safari • Real-time app suggestions based on user intent • Smart overlays when selecting text or data (e.g., phone numbers, emails, tools) • Privacy-first: All AI runs on-device (Apple Neural Engine) • Instant App Launch or Installation via StoreKit ✅ Examples: • Reading an article on productivity? → Suggests Notion or Things. • Looking up meditation tips? → Recommends Calm or Headspace. • Selecting a phone number? → Offers CRM or spam blocker apps. • Exploring code samples? → Suggests Pythonista or developer tools. 🔒 Privacy & Performance: • 100% on-device intelligence (no data sent to servers) • Follows Apple’s privacy framework • Works with SafariKit + StoreKit + CoreML ⸻ I’m happy to provide a full prototype roadmap and technical architecture. Feedback and collaboration are welcome! Would love to hear your thoughts — especially from developers who build for Safari, App Clips, or work with CoreML. Thanks! by: Apple lover....
1
0
98
Jun ’25