Buttons

https://developer.apple.com/design/human-interface-guidelines/ios/controls/buttons/

Buttons

ボタン

Buttons initiate app-specific actions, have customizable backgrounds, and can include a title or an icon. The system provides a number of predefined button styles for most use cases. You can also design fully custom buttons.

ボタンはアプリ固有のアクションを開始し、カスタマイズ可能な背景を持ち、タイトルやアイコンを含むことができます。 このシステムでは、ほとんどのユースケースにあらかじめ定義されたいくつかのボタンスタイルが用意されています。 完全なカスタムボタンをデザインすることもできます。

For developer guidance, see UIButton.

System Buttons

システムボタン

System buttons often appear in navigation bars and toolbars, but may be used anywhere.

システムボタンはナビゲーションバーやツールバーに表示されることがありますが、どこでも使用できます。

 

Use verbs in titles. An action-specific title shows that a button is interactive and says what happens when you tap it.

タイトルに動詞を使用する。 アクション特有のタイトルは、ボタンがインタラクティブであり、それをタップすると何が起こるかを示します。

Use title-case for titles. Capitalize every word except articles, coordinating conjunctions, and prepositions of four or fewer letters.

タイトルにはタイトルケース（一文字目は大文字）を使用します。 記事、結合詞、4文字以下の前置詞を除く、すべての単語を大文字にします。

Keep titles short. Overly long text can crowd your interface and may get truncated on smaller screens.

タイトルを短くしてください。 テキストが長すぎると、インターフェイスが煩雑になり、小さな画面で見切れることがあります。

Consider adding a border or a background only when necessary. By default, a system button has no border or background. In some content areas, however, a border or background is necessary to denote interactivity. In the Phone app, bordered number keys reinforce the traditional model of making a call, and the background of the Call button provides an eye-catching target that’s easy to hit.

必要なときにのみ、境界線や背景を追加することを検討してください。 デフォルトでは、システムボタンには境界線や背景がありません。 しかし、一部のコンテンツ領域では、インタラクティビティを示すために境界や背景が必要です。 電話アプリでは、ボーダードの数字キーは従来の電話操作のモデルを強化し、コールボタンの背景はヒットしやすい目を引くターゲットを提供します。

For developer guidance, see the UIButtonTypeSystem button type of UIButton.

Detail Disclosure Buttons

詳細開示ボタン

A Detail Disclosure button opens a view—typically, a modal view—containing additional information or functionality related to a specific item onscreen. Although you can use them in any type of view, Detail Disclosure buttons are commonly used in tables to access information about specific rows.

Detail Disclosureボタンは、ビュー（通常はモーダルビュー）を開き、画面上の特定の項目に関連する追加の情報または機能を含みます。 どのようなタイプのビューでも使用できますが、表ではDetail Disclosureボタンが一般的に使用され、特定の行に関する情報にアクセスします。

 

Use Detail Disclosure buttons appropriately in tables. When a Detail Disclosure button is present in a table row, tapping the button shows additional information. Tapping elsewhere selects the row or results in app-defined behavior. If you want people to tap the entire row to see additional detail, don’t use a Detail Disclosure button. Instead, use a detail disclosure accessory control, which appears as a chevron. See UITableViewCellAccessoryType in UITableViewCell.

詳細開示ボタンをテーブルで適切に使用します。 Detail Disclosureボタンがテーブル行にある場合、ボタンをタップすると追加情報が表示されます。 他の場所をタップすると、行が選択されるか、またはアプリケーション定義の振る舞いになります。 追加の詳細を表示するために行全体をタップするようにしたい場合は、Detail Disclosureボタンを使用しないでください。 代わりに、シェブロン（紋章？）として表示される詳細開示アクセサリコントロールを使用します。 UITableViewCellのUITableViewCellAccessoryTypeを参照してください。

For developer guidance, see the UIButtonTypeDetailDisclosure button type of UIButton.

Info Buttons

インフォボタン

An Info button reveals configuration details about an app, sometimes on the back of the current view, after flipping the view around. Info buttons come in two styles—light and dark. Pick the style that best coordinates with your app’s design and doesn’t get lost onscreen.

[情報]ボタンは、ビューの前後を反転した後で、現在のビューの背面にあるアプリケーションに関する設定の詳細を表示します。 情報ボタンには、明るいタイプと暗いタイプという2つのスタイルがあります。 アプリのデザインと最もよく調和し、画面上で迷子にならないスタイルを選んでください。

 

For developer guidance, see the UIButtonTypeInfoLight and UIButtonTypeInfoDark button types of UIButton.

Add Contact Buttons

連絡先追加ボタン

Users can tap an Add Contact button to browse a list of existing contacts and to select one for insertion into a text field or other view. In Mail, for example, you can tap the Add Contact button in the To field of a message to select a recipient from your list of contacts.

ユーザーは、[連絡先の追加]ボタンをタップして既存の連絡先のリストをブラウズし、テキストフィールドやその他のビューに挿入する連絡先を選択することができます。 たとえば、メールでは、メッセージの[宛先]フィールドの[連絡先の追加]ボタンをタップして、連絡先リストから受信者を選択できます。

 

Allow keyboard entry in addition to the Add Contact button. The Add Contact button provides an alternative, not a replacement, to typing contact information. It’s fine to provide it as a shortcut for adding existing contacts, but let people enter contact information with the keyboard too.

[連絡先の追加]ボタンに加えて、キーボード入力を許可します。 「連絡先を追加」ボタンは、連絡先情報を入力するために、代替情報を提供します。 既存の連絡先を追加するためのショートカットとして提供することもできますが、連絡先情報をキーボードで入力することもできます。

For developer guidance, see the UIButtonTypeContactAdd button type of UIButton.