[Technical Questions] Import Design System

[suleesan]

In what area do you have a technical challenge?

Xcode, Simulator & Previews

Description

Our team has a DesignSystem folder with all of the specified fonts, colors, etc. in it. I imported this folder into my project directory and am trying to customize my font like so: .font(Font.DesignSystem.header). For some reason, it keeps saying it can't find DesignSystem. For reference, the Font file has this structure:

extension Font {
    /// Namespace to prevent naming collisions with static accessors on
    /// SwiftUI's Font.
    ///
    /// Xcode's autocomplete allows for easy discovery of design system fonts.
    /// At any call site that requires a font, type `Font.DesignSystem.<esc>`
    public struct DesignSystem {
        public static let header =

I've tried just doing DesignSystem.header and Font.header but nothing seems to work. This is a low-priority question, but any help would be appreciated!

Reproduction

Import DesignSystem folder, try to reference a Font.

Expected behavior

The font should adjust according to what's specified in the design system.

Additional context

No response

Code of Conduct

• I agree to follow this course's Code of Conduct and Contributing Guidelines

[PSchmiedmayer]

@suleesan Thank you for asking a question and sharing your issues here!

Can you also share a link to the branch pushed to GitHub & with an open PR where the build is failing so we can comment on it?

My suspicion is that the files were not properly added to your application target.
Can you check that they are added to the app target and are compiled as part of the project? (how to add files to a target: https://developer.apple.com/documentation/xcode/configuring-a-new-target-in-your-project#Add-source-files-and-other-content-to-a-target).
Are the files all in the same target as your app or are they in a different target or Swift Package?

[suleesan]

Hi Paul! Thanks for responding; I checked the link you added and it looks like the DesignSystem is all in the correct Target Membership:

I just created a PR so that we can take a closer look at the issue (I also added some notes about other issues I'm facing). Thank you!

[PSchmiedmayer]

Thank you; I will take a look at the PR 👍

[PSchmiedmayer]

@suleesan I took a look at the PR and is looks like the folder was correctly referenced but the files themselves were not properly added to the Xcode project. If you drag a folder in an Xcode project, please make sure that the settings are as follows to ensure that all files are added to the right target:

I have done this in your PR and pushed the changes to the branch. I will also add some more specific feedback comments over there 👍

Regarding the general usage of custom fonts and colors: Those are tricky elements and it is challenge to ensure that your app provides a great user experience across all platforms, particularly in different modes like dark and light, and remains accessible to all users. I would therefore suggest to avoid any hard coded colors with RGB values or hard coded fonts.

Colors

I recommend to use SwiftUI system colors to ensure our UI is adaptable and looks great in both dark and light modes. As highlighted in the Apple Human Interface Guidelines, "System colors automatically adapt to system-wide changes, like switching from light to dark appearance." (Apple HIG - System Colors). This also cover various platforms and accessibility settings, making our app more inclusive compared to just hard coding RGB values in colors.

System Fonts and Text Styles

Similarly, for typography, consider leveraging SwiftUI's system fonts and text styles. The guidelines mention

Consider using the built-in text styles. The system-defined text styles give you a convenient and consistent way to convey your information hierarchy through font size and weight. Using text styles with the system fonts also supports Dynamic Type and the larger accessibility type sizes (where available), which let people choose the text size that works for them. (Apple HIG - Typography Best Practices).

I would therefore suggest to avoid any hard coded font sizes and elements as they won't scale with accessibility settings and will make it challenging to maintain the app in the future.