brunch

You can make anything
by writing

C.S.Lewis

by Lawn Jul 04. 2023

[HIG] Action sheets

선택 사항을 제시하는 모달 뷰 액션 시트

본 문서는 Apple의 Human Interface Guideline(이하 HIG) 문서를 한글로 번역한 것입니다. iOS 생태계 내에서 HIG를 읽으시는 분들이 번역본이 없어 불편함을 겪는 것을 알게 되었고, 이에 한글로 번역을 하게 되었습니다. iOS 커뮤니티 Async Swift에서 자율적으로 모인 9명이 함께 번역했으며, 일체의 상업적인 목적을 띄지 않습니다. 이 문서를 학습에 적극적으로 이용해 주시돼, 상업적인 용도로 이용하시는 것은 지양해 주시기 바랍니다. 감사합니다.


Introduction


액션 시트(action sheet)는 시작하는 작업과 관련된 선택 사항을 제시하는 모달 뷰입니다.


Developer note : SwiftUI를 사용하는 경우 확인 대화상자의 presentation modifier를 지정하여 모든 플랫폼에서 액션 시트(action sheet) 기능을 활성화할 수 있습니다. UIKit를 사용하는 경우에는 UIAlertController의 actionSheet 스타일을 사용하여 iOS, iPadOS, tvOS에서 액션 시트(action sheet)를 보여줍니다.


Best Practices


경고(alert)가 아닌 액션 시트(action sheet)를 사용하여 의도적인 동작과 관련된 선택지를 제공합니다. 예를 들어 사람들이 메일 편집을 취소할 때, 액션 시트(action sheet)는 편집 삭제(또는 초안 전체), 초안 저장, 편집으로 돌아가기의 세 가지 옵션을 제공합니다. 경고는 사람들이 파괴적인 결과를 가져오는 작업을 확인하거나 취소할 수 있지만 작업과 관련된 추가 선택 사항을 제공하지는 않습니다. 더 중요한 것은, 경고는 보통 예상치 못한 상황에 나타나며 현재 상황에서 조치를 취해야 할 문제나 변화에 대해 알려줍니다. 가이드는 Alerts를 참고하세요.


액션 시트(action sheet)는 신중하게 사용하세요. 액션 시트(action sheet)는 사람들에게 중요한 정보와 선택권을 주지만 작업하던 작업을 중단시킵니다. 사람들이 액션 시트(action sheet)에 집중할 수 있도록 과도하게 사용하는 것은 피하는 것이 좋습니다.


제목은 한 줄에 표시할 수 있을 정도로 짧은 것이 좋습니다. 긴 제목은 빠르게 읽기 어렵고 잘리거나 스크롤이 필요할 수 있습니다.


필요한 경우에만 메시지를 제공하세요. 일반적으로 제목은 현재 작업의 컨텍스트와 결합하여 사람들이 자신의 선택을 이해할 수 있도록 충분한 정보를 제공합니다.


필요하다면 사람들이 데이터가 파괴될 수 있는 작업을 거부할 수 있도록 취소 버튼을 제공합니다. 취소 버튼은 액션 시트(action sheet)의 맨 아래(watchOS의 경우 시트의 왼쪽 상단 모서리)에 배치합니다. SwiftUI 확인 대화상자에는 기본적으로 취소 버튼이 있습니다.


파괴적인 선택지는 시각적으로 두드러지게 하세요. 파괴적인 작업을 수행하는 버튼에는 파괴적인 스타일을 사용하고 가장 눈에 띄는 액션 시트(action sheet) 상단에 위치시킵니다. 개발자 가이드는 destructive (SwiftUI) 또는 UIAlertAction.Style.destructive (UIKit)를 참고하세요.


Platform considerations


No additional considerations for macOS or tvOS.


iOS, iPadOS

메뉴가 아닌 액션 시트(action sheet)를 사용하여 작업 관련 선택 항목을 제공합니다. 사람들은 명확한 선택이 필요할 수 있는 작업을 수행할 때 액션 시트(action sheet)를 사용하는 것에 익숙합니다. 반면, 메뉴는 사람들이 메뉴를 선택하여 그 내용을 나타내는 것을 예상합니다.


액션 시트(action sheet)를 스크롤하지 않도록 합니다. 액션 시트(action sheet)에 버튼이 많을수록 사람들이 선택을 하는 데 더 많은 시간과 노력이 필요합니다. 또한 버튼을 누르지 않고는 액션 시트(action sheet)를 스크롤하기 어려울 수 있습니다.


watchOS

액션 시트(action sheet)의 시스템 정의 스타일에는 제목, 선택 메시지, 취소 버튼 및 한 개 이상의 추가 버튼이 있으며, 인터페이스의 형태는 기기에 따라 달라집니다.

각 버튼은 해당 버튼 효과에 대한 정보를 알려주는 관련 스타일이 있으며 총 세 가지 시스템 정의 버튼 스타일이 있습니다.

액션 시트(action sheet)에 취소 버튼을 포함하여 4개 이상의 버튼을 표시하지 않도록 하세요. 화면에 버튼이 적을수록 옵션들을 한 번에 보기 쉽습니다. 취소 버튼은 필수이기 때문에 3개 이하의 선택 항목을 제공하는 것을 목표로 합니다.


Resources


Related   

Modality

Sheets

Alerts


Developer documentation   

confirmationDialog(_:isPresented:titleVisibility:actions:) — SwiftUI

UIAlertController.Style.actionSheet — UIKit


Videos

Customize and resize sheets in UIKit**WWDC21

작가의 이전글 [HIG] Token fields
작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari