Skip to content

Latest commit

 

History

History

Accessibility

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
README.md
README.md
 
 

README.md

Accessibility

  • Approximately one in seven people worldwide have a disability that affects the way they interact with the world and their devices.

Accessibility, not just for people with disabilities


Applicable Laws and Guidelines


Examples

  • Color-independent Perception

  • Brightness/Contrast

    • It is easy to read when the contrast between the text and the background color is 4.5 : 1 or higher

Voice Over

  • Voice Over

  • How to turn on Voice Over

      1. Settings(설정 앱)
      1. Accessibility(손쉬운 사용)
      1. Accessiblity shortcut(손쉬운 사용 단축키)
      1. Voice Over
    • Now, you can turn on/off, triple clicking side button

  • Navigating with Voice Over

    • Touch Navigation
    • Flick Navigation
    • Pause VoiceOver Speach
      • Two finger touch
    • Activating a Button
      • Double tab
    • Go Home
      • Short Drag from bottom : Home
      • Long Drag from bottom : App Switcher
      • Short Drag from top : Control Center
      • Long Drag from bottom : Notification Center
    • Scrolling
      • Three finger Flick
    • Closing
      • Two finger scrub
    • Change Options Using Rotor
      • Two finger turning around center point
      • To adjust value, flick up and down

  • Screen curtain

    • Three finger tap three times

Demo

//
//  ContentView.swift
//  SwiftUITutorial
//
//  Created by Shin Jae Ung on 2022/04/01.
//

import SwiftUI

struct ContentView: View {
    @State private var isOn1: Bool = true
    @State private var isOn2: Bool = false
    
    var body: some View {
        NavigationView {
            VStack(spacing: 10) {
                HStack(spacing: 10) {
                    CellView()
                    AccessibilityCellView()
                        .accessibilityElement(children: .contain)
                }
                SettingToggle(isOn: self.$isOn2)
                AccessibilitySettingToggle(isOn: self.$isOn1)
            }
            .navigationTitle("Example")
            .navigationBarTitleDisplayMode(.large)
        }
    }
}

struct CellView: View {
    var body: some View {
        VStack {
            Text("🚫")
            Image(systemName: "photo.artframe")
            Text("그림 이름")
                .font(.system(size: 17))
            Text("그림 설명")
                .font(.system(size: 16))
        }
        .padding()
        .background(
            RoundedRectangle(cornerRadius: 10)
                .stroke()
        )
    }
}

struct AccessibilityCellView: View {
    var body: some View {
        VStack {
            Text("✅")
                .accessibilityHidden(true)
            Image(systemName: "photo.artframe")
                .accessibilityLabel("그림 대체 텍스트")
                .accessibilitySortPriority(0)
            Text("그림 이름")
                .font(.body)
                .accessibilitySortPriority(2)
            Text("그림 설명")
                .font(.callout)
                .accessibilitySortPriority(1)
        }
        .padding()
        .background(
            RoundedRectangle(cornerRadius: 10)
                .stroke()
        )
    }
}

struct SettingToggle: View {
    @Binding var isOn: Bool
    
    var body: some View {
        Toggle("Wi-Fi", isOn: self.$isOn)
            .padding()
            .background(
                RoundedRectangle(cornerRadius: 5)
                    .stroke()
            )
            .padding()
    }
}

struct AccessibilitySettingToggle: View {
    @Binding var isOn: Bool
    
    var body: some View {
        Toggle("Wi-Fi", isOn: self.$isOn)
            .padding()
            .background(
                RoundedRectangle(cornerRadius: 5)
                    .stroke()
            )
            .padding()
            .accessibilityValue(self.isOn ? "켜짐" : "꺼짐")
            .accessibilityHint("설정을 변경하려면 이중 탭 하십시오")
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
        ContentView()
            .environment(\.dynamicTypeSize, .accessibility2)
    }
}

References