Display Modes

Overview

Subjects

Disabling an Orientation Mode

Hacking with Swift / 100 Days / Day-88 - Designing a single card view

Tags: #RoundedRectangle #CornerRadius #Toggle #OnTapGesture

Layout Toggle

struct UserView: View {
    var body: some View {
        Group {
            Text("Name: Paul")
            Text("Country: England")
            Text("Pets: Luna and Arya")
        }
        .font(.title)
    }
}

struct ContentView: View {
    @State private var layoutVertically = false

    var body: some View {
        Group {
            if layoutVertically {
                VStack {
                    UserView()
                }
            } else {
                HStack {
                    UserView()
                }
            }
        }
        .onTapGesture {
            layoutVertically.toggle()
        }
    }
}

Transition between Layout Modes Automatically (VStack / HStack)

Tags: #SizeClass #Layout #DisplayMode

This code looks at the space needed and then changes the layout. It also depends on the screen size you use.

struct UserView: View {
    var body: some View {
        Group {
            Text("Name: Paul")
            Text("Country: England")
            Text("Pets: Luna and Arya")
        }
        .font(.title)
    }
}

struct ContentView: View {
    @Environment(\.horizontalSizeClass) var sizeClass

    var body: some View {
        if sizeClass == .compact {
            VStack {
                UserView()
            }
        } else {
            HStack {
                UserView()
            }
        }
    }
}

or

struct UserView: View {
    var body: some View {
        Group {
            Text("Name: Paul")
            Text("Country: England")
            Text("Pets: Luna and Arya")
        }
        .font(.title)
    }
}

struct ContentView: View {
    @Environment(\.horizontalSizeClass) var sizeClass
    var body: some View {
        if sizeClass == .compact {
            VStack(content: UserView.init)
        } else {
            HStack(content: UserView.init)
        }
}

Hacking with Swift / 100 Days / Day-96 - Using groups as transparent layout containers

Making NavigationView work in Landscape (on iPhone)

Hacking with Swift / 100 Days / Day-97 - Making NavigationView work in landscape

Tags: ViewBuilder NavigationView #phoneOnlyNavigationView# #phoneOnlyStackNavigationView #navigationViewStyle #userInterfaceIdiom #devicetype

Size Classes

Tags: #sizeClass

Ne kadar yerinin olduğuna bakıyor. Yeteri kadar yerin var mı? Yoksa yok mu? Buna göre harekete geçebiliyorsun. Örneğin ekrandaki imgelerin ebatlarını değiştirebiliyorsun.

@Environment (.verticalsizeClass) var verticalsizeClass @Environment (.horizontalSizeClass) var horizontalSizeClass

Changing a view’s layout in response to size classes

Hacking with Swift / 100 Days / Day-98 - Changing a view’s layout in response to size classes

Tags: #DynamicTypeSize

Sources

Videos

Articles / Documents

• https://useyourloaf.com/blog/size-classes

See also