스트리밍은 대부분의 브라우저와
Developer 앱에서 사용할 수 있습니다.
-
AppKit의 새로운 기능
AppKit을 사용한 Mac 앱 개발의 최신 기술을 확인하세요. SF Symbols의 최신 업데이트를 알아보고, 향상된 제어를 통해 인터페이스를 개선하는 방법을 확인하며, Stage Manager를 통해 윈도우를 조정하는 방법을 배울 수 있습니다. 또한 macOS의 최신 공유 및 협업 기능에 대해 살펴보겠습니다.
리소스
관련 비디오
WWDC22
-
다운로드
♪ ♪
안녕하세요 AppKit의 새로운 사항을 알려 드리죠 저는 AppKit 팀의 엔지니어인 Jeff Nadeau이며 macOS Ventura에서 앱을 만드는 것에 관한 최신 사항을 알려 드리겠습니다 Mac에 있어 최고의 시대입니다 Apple 실리콘의 성능과 효율성 macOS의 능력 어느 때보다 풍성한 앱 생태계 덕분이죠 여러분의 앱은 그 이야기의 중요한 부분이며 우리는 계속 AppKit를 개선하여 최고의 앱을 개발할 수 있도록 지원할 것입니다 오늘 다양한 주제를 다룰 건데요 스테이지 매니저로 시작하여 환경 설정을 살펴보고 컨트롤을 다루며 SF Symbols와 공유 기능을 알아보겠습니다 일단 스테이지 매니저부터 시작하죠
스테이지 매니저는 활성화 중인 창에 집중할 때 작업 공간의 비활성 창을 정리합니다 더 나은 작업 흐름을 위해 창을 그룹으로 묶어 활성화 또는 비활성화할 수 있죠
이는 앱 창을 표현하는 방식에 영향을 줍니다 스테이지 매니저는 작업 공간을 깔끔하게 유지하기 위해 새로운 창을 열었을 때 공간을 늘리기 위해 기존 창이 스테이지에서 나갑니다 문서와 같은 '주요' 창은 그러는 게 좋지만 패널, 팝오버, 설정 등의 보조 창은 기존 창 위에 계속 나타나야 합니다 NSWindow에는 이미 많은 API가 있어 특정 창의 행동을 지정할 수 있죠
스테이지 매니저의 기본값은 플로팅 패널, 모달 창 환경 설정 같은 도구모음을 열 때 창을 교체하지 않는 것입니다
스테이지 매니저는 창의 collectionBehavior도 존중하죠 이 옵션 목록은 공간과 전체 화면에서의 창의 행동을 정의하는데 이제 스테이지 매니저가 대상 창의 성격이 보조인지 플로팅인지 알게 해 줍니다 만약 창의 collectionBehavior가 auxiliary, moveToActiveSpace stationary, transient의 옵션을 가지고 있다면 중앙 스테이지의 활성 창을 대신하지 않습니다 창의 collectionBehavior를 제대로 설정하면 어떤 상황에서도 훌륭하게 작동할 겁니다 데스크톱 공간과 전체 화면 새로운 스테이지 매니저에서요 이제 환경 설정의 주요 변경 사항을 다룰게요 macOS Ventura의 시스템 환경 설정 앱은 완전히 새로운 모습이 됐죠 내비게이션 방법도 달라졌고 시각 디자인도 새로워졌습니다 다른 운영 체제의 환경 설정과 같은 경험을 할 수 있도록 앱 이름을 '시스템 설정'으로 바꿨죠 여러분의 애플리케이션에도 이 변화가 적용됩니다 예를 들어 환경 설정 창 번들이 시스템 환경 설정 앱 안에 있을 겁니다 그리고 앱 안에 설정 공간도 있을 거예요 컨트롤 항목이 많은 양식을 위한 새로운 디자인 시스템은 설정 인터페이스나 인스펙터에 잘 맞을 겁니다 만약 커스텀 prefpane 번들을 보내면 새로운 설정 앱에서도 작동하죠 여러분의 커스텀 창은 사이드바에 나타나며 앱이 여러분의 번들을 로딩하여 Monterey와 이전 OS처럼 설정 UI를 보여 주죠 새롭게 이름이 바뀐 시스템 설정 앱에 맞춰 인앱 환경 설정도 '설정'으로 이름을 바꿨습니다 여러분을 돕기 위해 최신 SDK를 빌드하면 AppKit가 앱 메뉴 안에 있는 '환경 설정' 메뉴의 이름을 자동으로 업데이트하죠 하지만 '환경 설정'이라는 단어를 다른 곳에서도 언급하셨겠죠 창 제목이나 설명적인 라벨 또는 앱의 다른 컨트롤에서요 로컬 텍스트를 검색해 업데이트할 부분을 검색하세요
예를 들어, TextEdit의 설정 창은 원래 '환경 설정'이었는데 다른 시스템과 맞추기 위해 이 창의 이름도 바꿨죠 시스템 설정 앱은 새로운 인터페이스 스타일로 모든 설정 옵션을 나타냅니다 설정 인터페이스는 컨트롤 항목이 많은데 최신 스타일은 컨트롤이 많은 양식을 명확하고 정돈된 형태로 나타내고자 했죠
양식 자체가 시각적 구조를 제공하므로 시스템 컨트롤 항목도 이 맥락에 맞춰 시각적인 무게감을 줄이고 마우스를 올리면 주요 항목이 나타나도록 했습니다
새로운 디자인을 적용한 인터페이스를 만들고 싶다면 SwiftUI로 간단하게 할 수 있죠 제어 항목을 Form 안에 집어넣고 스타일에서 insetGrouped를 적용하세요 그러면 SwiftUI가 알아서 처리합니다 시각적인 스타일 스크롤 방식 양식의 레이아웃을 자동으로 적용하죠
아직 SwiftUI를 시작하지 않으셨다면 이번 기회에 시도해 보세요 설정 창은 앱 인터페이스의 독립된 공간이어서 점진적으로 적용하기 좋습니다 SwiftUI와 AppKit를 함께 사용하는 영상도 있으니 더 배워 보시면 좋을 거예요 이제 컨트롤에 관한 업데이트 사항을 공유해 드리죠 공유하고 싶은 컨트롤 개선 사항이 많은데요 NSComboButton이라는 새로운 컨트롤부터 시작하죠 NSColorWell도 업데이트했고 NSToolbar API도 개선했으며 NSAlert의 디자인도 조정하고 NSTableView의 성능도 개선했습니다 먼저 NSComboButton을 보죠 NSComboButton은 즉각적 버튼의 액션과 추가 옵션 메뉴를 통합하는 기능입니다
오늘날 컨트롤 환경에서는 즉각적인 액션을 수행하는 버튼을 사용하거나 여러 옵션을 보여 주는 드롭다운 버튼을 사용하는데 NSComboButton은 두 요소를 하나의 컨트롤로 통합하여 주요 액션과 드롭다운 메뉴를 하나로 묶습니다 Mail의 이런 부분에서 자주 사용하는 기능인데 예상 폴더는 한 번에 클릭할 수 있지만 다른 폴더로 보내는 메뉴에도 접근할 수 있죠 이전에는 이런 기능을 구현하려면 분리된 컨트롤 API를 사용했지만 이제 전용 컨트롤이 생겼습니다 NSComboButton은 두 가지 스타일이 있는데 버튼의 외형과 작동 방식이 다르죠 기본값은 'split'라고 하며 메뉴를 위한 별도의 화살표 부분이 있습니다
두 번째 스타일인 'unified'는 일반 버튼처럼 생겼죠 이 스타일은 클릭하면 주요 액션을 취하고 클릭을 유지하면 메뉴가 나타납니다 NSComboButton을 살펴봤어요 NSColorWell의 기능도 업데이트했는데 외형부터 완전히 바뀌었습니다 고전적인 사각형 모양에서 색상 선택 버튼에 새로운 스타일을 적용하여 시스템의 다른 버튼과 비슷한 베젤로 만들었죠 자동으로 적용되는 변동 사항이므로 새로운 외형을 따로 적용할 필요가 없습니다 하지만 색상을 선택하는 것은 창의적이고 전문적인 적용 과정의 일부이므로 NSColorWell에 새로운 스타일을 2개 추가했죠
첫 번째는 미니멀 스타일로 마우스를 올렸을 때 화살표가 드러나는데 즉시 다양한 색상이 있는 팔레트가 드러나서 빠르게 색상을 선택할 수 있습니다 NSColorPanel을 사용할 수 있는 옵션도 있죠 기본값은 시스템의 표준 색상표를 사용하지만 다른 UI나 팔레트가 드러나도록 커스터마이징할 수도 있습니다
두 번째는 확장 스타일로 iWork 앱에서 보셨을 거예요 이 스타일은 두 가지의 인터랙션 모델을 혼합하죠 왼쪽에는 아까와 같은 화살표가 나타나서 빠르게 색상을 선택할 수 있고 오른쪽의 버튼은 전체 패널을 불러와서 상세한 색상 선택이 가능합니다
이제 NSColorWell은 3가지의 선택 방법을 제공하죠
NSColorWell의 colorWellStyle 속성으로 접근할 수 있습니다 스타일 별로 항목이 있죠 'default', 'expanded' 그리고 'minimal'입니다
NSColorWell에는 드롭다운 메뉴를 위한 표적 및 액션 쌍을 추가했죠 미니멀 또는 확장 색상표의 드롭다운 메뉴를 클릭했을 때 어떤 액션을 취할지 지정합니다 이 속성의 기본값은 nil이며 NSColorWell이 표준 팝업을 사용하도록 하죠 하지만 이 액션을 커스터마이징하여 커스텀 팝오버를 띄우거나 메뉴 형태의 다른 인터페이스를 보여 줄 수도 있습니다 새로운 NSColorWell을 살펴봤습니다 새로운 형태로 바뀌었고 색상 선택 방법도 2개 추가됐죠 다음은 NSToolbar와 관련된 소식입니다 API를 다각도로 개선하여 손쉽게 커스터마이징할 수 있도록 했고 레이아웃의 유연성도 높였죠 커스터마이징과 관련하여 2개의 대리자 메소드를 추가하여 도구모음을 손쉽게 커스터마이징할 수 있습니다 toolbarImmovableItemIdentifiers 메소드부터 설명해 드리죠 이 메소드를 적용하면 항목 식별자 집단을 반환하는데 사용자가 움직이거나 삭제할 수 없는 항목이 되고 커스터마이징 모드에서도 움직이지 않습니다
예를 들어 Mail 앱의 필터 버튼을 메일 목록 위쪽에 고정하고 싶다고 하죠 이 API를 이용하면 이 위치에서 움직이는 걸 막을 수 있습니다
다음은 toolbar itemIdentifier canBeInsertedAt 메소드입니다 이 대리자 메소드는 도구모음 안에서 재정렬, 삽입, 삭제를 저지하죠 여러분의 커스터마이징 규칙을 적용할 때 쓸 수 있습니다 예를 들어 도구모음의 특정 항목을 한 섹션에서는 허용하면서 다른 섹션에서는 허용하지 않을 수 있죠
새로운 centeredItemIdentifiers 속성을 사용하여 도구모음에 여러 항목을 중앙 정렬할 수 있습니다 여러분의 도구모음을 커스터마이징할 수 있다면 세트 내 항목을 도구모음에 추가하거나 삭제할 수 있지만 중앙 정렬된 그룹 안에서만 재정렬할 수 있죠 이 예에서는 사진 편집 도구가 좌우의 항목 수와 상관없이 가운데 부분에 전부 붙어 있습니다 원하는 방식으로 도구모음을 커스터마이징하면 항목이 이동하는 걸 원하지 않으시겠죠 하지만 다른 상태가 되었을 때 의미가 달라지는 버튼에 적용하기는 어렵습니다 Mail의 음 소거와 음 소거 해제 버튼처럼 클릭하면 바뀌는 버튼은
항목 이름의 크기가 달라서 도구모음의 다른 항목이 변화에 맞게 움직여야 하죠
이런 상황에서는 NSToolbarItem의 possibleLabels 속성을 사용하면 로컬 스트링을 사용할 수 있습니다
NSToolbar는 자동으로 항목을 가장 긴 이름에 맞춰 항목의 설정을 바꿔도 레이아웃을 유지하죠 다음은 알림의 디자인 변경 사항입니다 macOS의 알림은 간결한 레이아웃을 사용하는데 짧은 텍스트와 적고 명확한 선택지에 최적화되어 있죠 일반적으로 알림에는 좋은 구성입니다 알림은 텍스트가 짧을수록 좋죠 메시지를 직접적으로 전달할 수 있고 사용자가 알림을 끄기 전에 내용을 읽을 확률이 높습니다
하지만 설명글을 무작정 줄일 수는 없죠 이 디스크 유틸리티 알림처럼 복잡하고 미묘한 내용을 전달할 때는 특히 그렇습니다 파일 시스템 데이터에 관한 중요한 내용처럼 말이죠 이런 때는 간결한 레이아웃이 적합하지 않습니다 이런 경우에는 NSAlert에서 넓은 레이아웃을 제공하여 긴 글을 넣을 수 있게 했죠 작은 창에 들어가기에는 설명 텍스트가 너무 긴 알림에 자동으로 적용합니다 작은 알림 창에 맞추기에는 너무 큰 부가 화면에도 이 스타일을 적용합니다 이러한 변경 사항을 앱에 적용할 필요 없이 시스템 전반적으로 자동 적용했죠 중요한 것은 알림을 표시하는 순간에 레이아웃을 결정하므로 화면에 알림이 나타났을 때는 스타일을 변경해도 적용하지 않습니다
물론 알림 글의 길이를 최대한 줄여야겠지만 그럴 수 없는 경우의 사용자 경험을 개선하는 업데이트입니다
다음은 NSTableView의 새로운 기능을 보죠 NSTableView는 많은 행의 효율적인 관리를 위해 스크롤 할 때 보는 화면을 다시 사용하도록 설계했죠 하지만 각 행의 높이가 다른 테이블에는 적용하기 어렵습니다 좋은 스크롤 경험을 제공하려면 테이블의 전체 높이를 알고 스크롤 영역 내 각 행의 위치를 알아야 하죠
과거에는 NSTableView가 모든 행의 크기를 재서 초기 로딩 시간에 영향을 주었습니다 macOS Ventura의 NSTableView는 이를 해결하고 더 좋은 성능을 제공하죠
각 행의 높이를 열심히 계산하는 대신 NSTableView는 스크롤링 뷰포트 내부와 근처 행을 토대로 천천히 계산합니다
아직 계산하지 않은 행의 경우 NSTableView가 이미 측정한 행 높이를 바탕으로 행 높이의 예측치를 사용하죠 테이블을 스크롤 할 때 NSTableView가 필요할 때 행의 높이를 요청하여 예측치를 실제 측정치로 대체하고 정확한 스크롤 위치를 유지합니다
이 최적화로 대규모 테이블의 로딩 시간을 대폭 개선했죠 tableView(_:, heightOfRow:) 와 같은 대리자의 타이밍을 바꾸므로 NSTableView가 행 높이를 요청하는 시점을 추정하면 안 됩니다
이번 최적화는 NSTableView와 SwiftUI의 목록 보기에 적용되며 macOS Ventura의 모든 앱에 자동으로 사용하여 따로 적용할 필요가 없죠 NSTableView 성능을 알아봤습니다 SF Symbols의 업데이트를 살펴보죠 macOS Ventura는 SF Symbols 4를 포함하며 다양한 주제의 새로운 심벌 이미지를 450개 추가했습니다
새로운 심벌에는 월계관도 있고 각종 가정용품과 세계 각국의 통화 기호 스포츠 관련 심벌도 추가했죠 수천 개의 심벌을 자랑하는 전문가가 디자인한 SF Symbols를 통해 어떤 아이디어도 표현할 수 있습니다 하지만 거기서 멈추지 않았죠 SF Symbols 4는 새로운 기능을 추가하여 아이콘을 통한 표현을 더욱 개선했습니다 심벌 이미지는 다양한 렌더링 모드를 지원하며 디자인에 맞게 선택할 수 있습니다 '모노크롬'은 단색을 사용하며 '계층형'은 색상의 다양한 불투명도를 사용하여 심벌의 특정 부분을 강조하고 '팔레트'는 심벌의 각 부분에 특정 색상을 지정할 수 있습니다 '멀티컬러'는 심벌에 적용한 색을 사용합니다
직접 선택하면 다양한 디자인을 만들 수 있지만 최고 형태의 완성형 심벌도 제공하여 수정할 필요가 없도록 했죠
그래서 macOS Ventura에서 심벌의 새 기능인 선호 렌더링 모드를 새로 추가했습니다 선호 렌더링 모드를 통해 선호하는 스타일의 렌더링을 지정할 수 있고 런타임에 AppKit가 해당 스타일을 자동으로 사용하죠 AirPods Pro와 같은 심벌에 좋은데요 계층형 스타일을 선호하여 디테일을 명확하게 표현할 수 있습니다 만약 다른 디자인을 염두에 두고 있다면 NSImageSymbolConfiguration 오브젝트를 사용하여 선호하는 스타일을 선택할 수 있죠
일부 심벌은 개념만 나타내지 않고 값이나 양을 표현하기도 하는데요 와이파이 신호 강도나 오디오 볼륨이 그렇습니다 이런 경우에는 '변수 심벌'이라고 부르는 새로운 종류의 심벌을 추가했죠 변수 심벌을 통해 플로팅 포인트 값을 NSImage에 직접 공급하고 심벌은 숫자의 한계치를 임베드하여 값에 따라 경로가 어떻게 바뀌는지 결정합니다 이게 API죠 새로운 이니셜라이저를 사용하여 다양한 심벌을 만듭니다 기존의 심벌 이미지 이니셜라이저와 비슷하지만 값 매개변수가 추가됐죠 0과 1 사이의 플로트값입니다 심벌 이미지가 변수 한계치를 정의하지 않으면 이 값은 무시하고 평소대로 심벌을 그리죠 만약 정의하면 입력한 값에 따라 심벌 경로가 다르게 그려집니다
각 변수 심벌은 고유의 방법으로 값을 표현하죠 API 레벨에서 값을 제공함으로써 다양한 형태를 사용할 수 있고 심벌의 복잡한 표현 구조는 배우지 않아도 됩니다
변수 심벌은 팔레트나 멀티컬러와 같은 렌더링 스타일과 사용하면 훨씬 빛을 발하죠 어떤 디자인으로든 적용할 수 있습니다 마지막으로 공유에 관한 대규모 업데이트를 다룰게요 macOS Ventura는 Mac의 공유 경험을 높이기 위해 추천 인물 기능을 비롯해 협업하는 사람을 초대하고 관리하는 새로운 방법을 추가했죠 새로운 API를 적용하여 이러한 개선 사항을 여러분의 앱에 적용하십시오
가장 중요한 업데이트는 공유 팝오버 기능입니다 기존의 공유 메뉴를 풍성한 인터페이스로 대체하여 공유하려는 문서의 정보를 비롯하여 추천 인물과 같은 익숙한 기능도 포함하죠 이전 피커와 같은 API와 대리자 메소드를 지원하므로 공유 서비스 목록 필터 기능도 계속 사용할 수 있고 커스텀 서비스를 피커에 삽입할 수도 있습니다
파일 URL을 공유하면 NSSharingServicePicker가 자동으로 제목 영역에 아이콘과 이름, 파일의 다른 메타데이터를 띄우죠 커스텀 유형을 공유할 때는 여러분의 아이템을 새로운 프로토콜에 순응하면 NSSharingServicePicker가 해당 정보를 요청합니다
이 프로토콜은 NSPreview RepresentableActivityItem이죠 순응 유형은 공유하려는 기반 아이템을 반환해야 합니다 NSItemProvider처럼요 그러면 선택적으로 제목, 이미지 제공자 아이콘 제공자를 반환합니다
편의를 위해 AppKit에 순응 클래스가 있는데 NSPreviewRepresenting ActivityItem이라고 합니다 기존의 공유 아이템을 메타데이터와 묶어 주죠 NSImage로 직접 이미지 매개변수를 제공하거나 이미지를 미리 생성할 때 성능을 많이 요구한다면 NSItemProvider를 사용할 수도 있죠
새로운 공유 피커는 도구모음 버튼 같은 곳에서 공유하기 좋지만 메인 메뉴 바나 앱 내부의 선택 화면에서 공유하고 싶을 수도 있습니다 이전에는 그러려면 메뉴를 직접 만들어서 공유 서비스를 열거한 뒤 메뉴 아이템을 각각 만들었죠 그 방법도 작동하지만 표준 피커를 우회하기 때문에 새로운 기능을 사용하지 못합니다 macOS Ventura의 NSSharingServicePicker는 표준 공유 메뉴 아이템을 만들 수 있죠 전 메뉴에 표준 아이템을 추가하여 공유를 쉽게 할 수 있습니다 한 번 선택하면 메뉴 아이템이 공유 팝오버를 소환하며 컨텍스트 메뉴라면 팝오버를 메뉴를 소환한 창에 고정하죠 macOS Ventura는 새로운 협업 관리를 지원합니다 추가 적용을 통해 공유 가능한 아이템이 협업 초대 기능도 수행할 수 있는데 공유 피커와 메시지에 끌어 놓기 기능 FaceTime을 통해 공유를 시작할 수 있죠 CloudKit나 iCloud Drive를 사용하여 콘텐츠를 공유하고 전용 협업 서버를 통해 초대 흐름을 연결할 수 있습니다 방대한 주제인 만큼 더 자세하게 설명하는 영상을 몇 개 제작했습니다 앱이 협업을 지원하거나 새로 추가할 계획이라면 꼭 보십시오 macOS Ventura를 시작하실 때 스테이지 매니저를 고려하여 창을 설정하십시오 NSComboButton과 NSColorWell 같은 컨트롤 개선 사항을 디자인에 최대한 활용하세요 SF Symbols의 심벌과 기능으로 아이콘 디자인을 개선하십시오 마지막으로 협업에서는 최신 API를 적용하여 macOS Ventura의 새로운 공유 경험을 최대한 활용하세요
시청해 주셔서 감사드리며 멋진 Mac 애플리케이션을 만들어 주셔서 감사합니다
-
-
4:54 - Using the grouped form style in SwiftUI
enum AirDropVisbility: String, CaseIterable, Identifiable { case nobody = "No One" case contactsOnly = "Contacts Only" case everyone = "Everyone" var id: String { rawValue } var label: String { rawValue } var symbolName: String { switch self { case .nobody: return "person.crop.circle.badge.xmark" case .contactsOnly: return "person.2.circle" case .everyone: return "person.crop.circle.badge.checkmark" } } } struct ExampleFormView: View { @State private var name: String = "Mac Studio" @State private var screenSharingEnabled: Bool = true @State private var fileSharingEnabled: Bool = false @State private var airdropVisibility = AirDropVisbility.contactsOnly var body: some View { Form { TextField("Computer Name", text: $name) Toggle("Screen Sharing", isOn: $screenSharingEnabled) Toggle("File Sharing", isOn: $fileSharingEnabled) Picker("AirDrop", selection: $airdropVisibility) { ForEach(AirDropVisbility.allCases) { Label($0.label, systemImage: $0.symbolName) .labelStyle(.titleAndIcon) .tag($0) } } } .formStyle(.grouped) } }
-
-
찾고 계신 콘텐츠가 있나요? 위에 주제를 입력하고 원하는 내용을 바로 검색해 보세요.
쿼리를 제출하는 중에 오류가 발생했습니다. 인터넷 연결을 확인하고 다시 시도해 주세요.