I'm preparing a Catalyst version of my apps to be run on M1 and M2 Macs. Now Xcode 14 does it automaticaly, but there are some adjustments to be made in order to make the app look a native Mac app as far as possible.

I have three questions for this to match:

1. I have a "typical" list view, as follows:

ForEach(filteredStudents, id: \.id) { student in
        NavigationLink(destination: StudentDetailView(student: student)) {
          StudentCellView(student: student)
        }

On iOS, tapping on an item of the list moves quickly to the detailed View of that item. On MacOS catalyst version, as both, list view and detailed view appers side by side, and accent-color overlay appears on selected item, to mark this selection. But, and here is my question, rounded corners are not simetrical, as you can see on this image:

http://oscararroyo.es/varios/Cell.png

As this is not programmed myself, does anybody knows how to solve this?

2. On the same view, I use as well a typical sorting menu like this:

.toolbar {
ToolbarItem {
        Menu {
          Picker("Sort", selection: $orderedBy) {
            Text("Sort by student").tag("student")
            Text("Sort by instrument").tag("instrument")
            Text("Sort by course").tag("course")
            Text("Sort by tutor").tag("tutor")
          }
        } label: {
          Image(systemName: "arrow.up.arrow.down")
        }
      }

But Catalyst "translation" of this menu appears as you can see on next image: no "system image" at all, but a little arrow which drives itself down to menu title, with its children options:

http://oscararroyo.es/varios/Menu.png

Does anybody knows how to avoid this "multiplication"?

3. Finally, but the most important thing for me, my app uses a tabbed interface, which now is completely reproduced the same way on Catalyst version:

http://oscararroyo.es/varios/Tabs.png

This is not the best way to display the app on a desktop app, so I've looked all around the internet in order to get a better option: menu items (.command), or so. But the best way could be, by far, a third panel on the left displaying my three tab options, just like Apple notes app, for example. But I haven't been able to find a way to transform this for MacOS/Catalyst app without having to rewrite lots of code myself. Any suggestions to work with?

Thank you very much in advance.

What is the obstacle to making it a native Mac SwiftUI app instead of using Catalyst?

Thanks, @bobstern.

That was the first option a tried, but my code make use of many little APIs and so that needs to be recoded to make app work: UIImages (which seems to not work on MacOS code), APKit APIs, and so many little improvements.

I tried as well solving this compilation errors, one after another, sharing my "shared" folders on my project on XCode as far as possible, to keep the app as simple as possible, and creating equivalent files in the cases where sharing them is not possible. But after hours of work, compile errors grew up and I could not visualize an end 😅.

For example, sharing CoreData definition files:

import SwiftUI
import CoreData

extension Student {

  func update(moc: NSManagedObjectContext, inputImage: UIImage, name: String, 
  phone: String, mail: String, birthdate: Date, 
  notes: String, instrument: Instrument, course: Course, 
  tutor: Tutor, timestampEdit: Date) {
  ...

Throws this error: "Cannot find type 'UIImage' in scope". Having to adapt all my code for changing this kind of not-compatible formats, specially about CoreData scares me 😅

So I opted for catalyst: maybe not the best solution, but the easiest one, olperational, but with the little details exposed on this thread.

Don't you need to import UIKit to get UIImage?

If you decide to do a pure SwiftUI Mac app instead of Catalyst, I have a suggestion that might solve your concern regarding Core Data: In the Core Data Model Inspector for the inputImage attribute, instead of defining its Custom Class as UIImage, define it as a custom type XImage. Use an #if os() compiler directive to make XImage a typealias of NSImage or UIImage:

#if os(OSX)
typealias XImage = NSImage
#elseif os(iOS)
typealias XImage = UIImage
#endif

This is just a brainstorming idea that may not compile, but it might be worth trying since no one has suggested an authoritative solution.

Incidentally, you might find sprinkling #if os() compiler directives in your code easier to maintain than having separate files for Mac and iOS even though it's kind of ugly.

It's great to hear that you're preparing a Catalyst version of your app for M1 and M2 Macs! It's important to make sure that the app looks and functions as natively as possible on these platforms, and I understand that you have some questions about achieving this.

Regarding your first question about the "typical" list view, it sounds like you have already noticed a difference in behavior between the iOS and Catalyst versions. On iOS, tapping on an item in the list immediately moves to the detailed view, while on Catalyst, the list and detail views appear side by side and an accent-color overlay appears on the selected item to mark the selection. However, you have noticed that the rounded corners are not symmetrical. One suggestion to achieve symmetry could be to adjust the corner radius of the cells in the list view and detail view to match each other. This may help create a more cohesive look between the two views.

If you have any more questions or concerns about your Catalyst version, don't hesitate to reach out. Best of luck with your development efforts!

Have you got the solution of this?

"Making adjustments to the Catalyst port of my app from iOS feels like refining my pickleball technique – it's all about precision and adaptation. Just like adjusting my grip for the perfect serve, these tweaks will ensure smooth gameplay across all platforms. Ready to ace the competition, both on the court and in the app store!"