Search Bars

A search bar allows people to search through a large collection of values by typing text into a field. A search bar can be displayed alone, or in a navigation bar or content view. When displayed in a navigation bar, a search bar can be pinned to the navigation bar so it's always accessible, or it can be collapsed until the user swipes down to reveal it.

서치바를 사용하면 사람들이 필드에 텍스트를 입력하여 값들의 큰 집합을 검색할 수 있게 합니다. 서치바는 단독으로 또는 네비게이션바 또는 컨텐츠뷰에 표시할 수 있습니다. 네비게이션바에 표시될 때, 서치바는 항상 접근할 수 있도록 네비게이션바에 고정하거나 사용자가 아래로 스와이프하여 드러낼때까지 접을 수 있습니다.

Use a search bar instead of a text field to implement search. A text field doesn’t have the standard search bar appearance that people expect.

검색을 구현하기 위해 텍스트 필드 대신 서치바를 사용하십시오. 텍스트 필드에는 사람들이 기대하는 표준 서치바 모양이 없습니다.

Enable the Clear button. Most search bars include a Clear button that erases the contents of the field.

클리어 버튼을 활성화하십시오. 대부분의 서치바에는 필드의 내용을 지우는 클리어 버튼이 있습니다.

Enable the Cancel button when appropriate. Most dedicated search bars include a Cancel button that immediately terminates the search.

적절한 경우 취소 버튼을 사용할 수 있게 하십시오. 대부분의 전용 서치바에는 검색을 즉시 종료하는 취소 버튼이 있습니다.

If necessary, provide hints and context in a search bar. A search bar’s field can contain placeholder text—like “Search Clothing, Shoes and Accessories” or simply “Search”—as a reminder of the context being searched. A succinct, one-line prompt with appropriate punctuation can also appear directly above a search bar to provide guidance. Stocks uses a prompt to let people know they can enter a company name or stock symbol.

필요한 경우 서치바에 힌트와 컨텍스트를 제공하십시오. 서치바의 필드에는 검색중인 컨텍스트를 상기시켜주기 위해 "의류, 신발 및 액세서리 검색"또는 단순히 "검색"과 같은 placeholder 텍스트가 포함될 수 있습니다. 적절한 구두점이 있는 간결한 한 줄짜리 프롬프트가 서치바 바로 위에 나타나서 지침을 제공 할 수도 있습니다. Stocks는 프롬프트를 사용하여 사람들에게 회사 이름이나 주식 기호를 입력할 수 있음을 알려줍니다.

Consider providing helpful shortcuts and other content below a search bar. Use the area under a search bar to help people get to content faster. Safari, for example, shows your bookmarks as soon as you tap the search field. Select one to go right to it without entering any search terms. Stocks shows a list of results as you type into the search field. Tap one at any time without typing any more characters.

서치바 아래에 유용한 바로 가기 및 기타 콘텐츠를 제공하는 것을 고려하십시오. 서치바 아래의 영역을 사용하여 사람들이 컨텐츠에 더 빨리 접근 할 수 있도록 지원합니다. 예를 들어 Safari에서는 검색 필드를 누르는 즉시 책갈피를 표시합니다. 검색어를 입력하지 않고 바로 이동하려면 하나를 선택하십시오. Stocks은 검색 필드에 입력 할 때 결과 목록을 표시합니다. 더 이상 문자를 입력하지 않고 언제든지 하나를 탭하십시오.

For developer guidance, see UISearchController and UISearchBar.

Scope Bars

A scope bar can be added to a search bar to let people refine the scope of a search.

사람들이 검색 범위를 좁힐 수 있도록 서치바 스코프바를 추가 할 수 있습니다.

Favor improving search results over including a scope bar. A scope bar can be useful when there are clearly defined categories in which to search. However, it’s best to improve search results so scoping isn’t necessary.

스코프바를 포함하여 검색 결과를 향상 시키십시오. 스코프바는 검색 할 카테고리가 명확하게 정의되어있을 때 유용할 수 있습니다. 그러나 범위 지정이 필요하지 않도록 검색 결과를 개선하는 것이 가장 좋습니다.

For developer guidance, see UISearchBar.

Search Bars - Bars - iOS - Human Interface Guidelines - Apple Developer