Tables
https://developer.apple.com/design/human-interface-guidelines/ios/views/tables/
Tables
テーブル
A table presents data as a scrolling, single-column list of rows that can be divided into sections or groups. Use a table to display large or small amounts of information cleanly and efficiently in the form of a list. Generally speaking, tables are ideal for text-based content, and often appear as a means of navigation on one side of a split view, with related content shown on the opposite side. See Split Views.
テーブルは、スクロール可能、かつグループセクションに分割可能なシングルカラムリストを表示します。 表を使用して、大量または少量の情報をきれいに効率的に一覧の形で表示します。 一般的に言えば、テーブルはテキストベースのコンテンツには理想的であり、分割ビューの片側にナビゲーションの手段として表示され、関連コンテンツが反対側に表示される事が多いです。 スプリットビューを参照してください。
iOS implements two styles of table, plain and grouped.
iOSは、2つのスタイルのテーブル（プレーンとグループ）を実装しています。
Plain. Rows can be separated into labeled sections, and an optional index can appear vertically along the right edge of the table. A header can appear before the first item in a section, and a footer can appear after the last item.
プレーン。 行はラベル付きセクションに分けられ、オプションのインデックスはテーブルの右端に沿って垂直に表示されます。 ヘッダーはセクションの最初の項目の前に表示され、最後の項目の後にフッターが表示されます。
Grouped. Rows are displayed in groups, which can be preceded by a header and followed by a footer. This style of table always contains at least one group and each group always contains at least one row. A grouped table doesn’t include an index.
グループ。 行はグループで表示され、先頭にはヘッダーが続き、フッターが続きます。 このスタイルのテーブルには、常に少なくとも1つのグループが含まれ、各グループには常に少なくとも1つの行が含まれます。 グループ化された表にはインデックスが含まれていません。
Think about table width. Thin tables can cause truncation and wrapping, making them hard to read and scan quickly at a distance. Wide tables can also be difficult to read and scan, and can take away space from content.
テーブルの幅について考える。 幅の狭いテーブルは切り捨てや折り返しを発生させる可能性があり、離れた場所ですばやく読み取りやスキャンを行うことができません。 幅の広いテーブルもまた判読やスキャンが難しく、コンテンツからスペースを奪うこともあります。
Begin showing table content quickly. Don’t wait for extensive table content to load before showing something. Fill onscreen rows with textual data immediately and show more complex data—such as images—as it becomes available. This technique gives people useful information right away and increases the perceived responsiveness of your app. In some cases, showing stale, older data may make sense until fresh, new data arrives.
表の内容をすばやく表示し始めます。 何かを表示する前に大量のテーブルの内容が読み込まれるのを待つ必要はありません。 画面上の行にテキストデータをすぐに表示し、画像などのより複雑なデータは表示可能になり次第表示することができます。 この手法は、人々にすぐに役立つ情報を提供し、アプリの応答性が良いと感じさせます。 失効した古いデータを新しいデータが到着するまで表示させることも、場合によっては有効です。
Communicate progress as content loads. If a table’s data takes time to load, show a progress bar or spinning activity indicator to reassure people that your app is still running.
コンテンツの読み込み中に進捗状況を伝えます。 テーブルのデータが読み込まれるまでに時間がかかる場合は、プログレスバーを表示するか、アクティビティインジケータを回転させて、アプリがまだ実行中であることを確認してください。
Keep content fresh. Consider updating your table’s content regularly to reflect newer data. Just don’t change the scrolling position. Instead, add the content to the beginning or end of the table, and let people scroll to it when they’re ready. Some apps display an indicator when new data has been added, and provide a control for jumping right to it. It’s also a good idea to include a refresh control, so people can manually perform an update at any time. See Refresh Content Controls.
コンテンツを最新状態で保つ。 新しいデータを反映するために、テーブルのコンテンツを定期的に更新することを検討してください。 スクロール位置を変更しないでください。 代わりに、コンテンツをテーブルの先頭または末尾に追加し、準備ができたらスクロールできるようにします。 一部のアプリでは、新しいデータが追加されたときにインジケータが表示され、即座にジャンプするコントロールが用意されています。 また、リフレッシュコントロールを組み込むことをお勧めします。ユーザーはいつでも手動でアップデートを実行できます。 コンテンツコントロールの更新を参照してください。
Avoid combining an index with table rows containing right-aligned elements. An index is controlled by performing large swiping gestures. If other interactive elements reside nearby, such as disclosure indicators, it may be difficult to discern the user’s intent when a gesture occurs and the wrong element may be activated.
右寄せの要素を含む表の行とインデックスを組み合わせないでください。 インデックスは、大きめのスワイプジェスチャーを実行することによって制御されます。 開示インジケータのように他のインタラクティブな要素が近くに存在する場合、ジェスチャが発生したときにユーザの意図を識別することが困難であり、操作を誤る場合があります。
For developer guidance, see UITableView.
Table Rows
テーブル行
You use standard table cell styles to define how content appears in table rows.
標準テーブルセルスタイルを使用して、コンテンツをテーブル行に表示する方法を定義します。
Basic (Default). An optional image on the left side of the row, followed by a left-aligned title. It’s a good option for displaying items that don’t require supplementary information. For developer guidance, see the UITableViewCellStyleDefault constant of UITableViewCell.
基本（デフォルト）。 行の左側にオプションのイメージが続き、その後に左揃えのタイトルが続きます。 補足情報を必要としないアイテムを表示するに好ましいオプションです。 開発者向けのガイダンスについては、UITableViewCellのUITableViewCellStyleDefault定数を参照してください。
Subtitle. A left-aligned title on one line and a left-aligned subtitle on the next. This style works well in a table where rows are visually similar. The additional subtitle helps distinguish rows from one another. For developer guidance, see the UITableViewCellStyleSubtitle constant of UITableViewCell.
サブタイトル。 1行に左揃えのタイトルと次の行に左揃えのサブタイトルがあります。 このスタイルは、各行が視覚的に似ているテーブルでうまくいきます。 追加の字幕は、行を互いに区別するのに役立ちます。 開発者ガイダンスについては、UITableViewCellのUITableViewCellStyleSubtitle定数を参照してください。
Right Detail (Value 1). A left-aligned title with a right-aligned subtitle on the same line. For developer guidance, see the UITableViewCellStyleValue1 constant of UITableViewCell.
右に詳細（値1）。 同じ行に右揃えの字幕がある左揃えのタイトル。 開発者向けのガイダンスについては、UITableViewCellのUITableViewCellStyleValue1定数を参照してください。
Left Detail (Value 2). A right-aligned title, followed by a left-aligned subtitle on the same line. For developer guidance, see UITableViewCellStyleValue2 constant of UITableViewCell.
左に詳細（値2）。 右揃えのタイトルと、同じ行の左揃えの字幕が続きます。 開発者ガイダンスについては、UITableViewCellのUITableViewCellStyleValue2定数を参照してください。
All standard table cell styles also allow graphical elements, such as a checkmark or disclosure indicator. Of course, adding these elements decreases the space available for titles and subtitles.
すべての標準テーブルセルスタイルでは、チェックマークや公開インジケータなどのグラフィック要素も使用できます。 もちろん、これらの要素を追加すると、タイトルやサブタイトルに使用できる領域が減少します。
Keep text succinct to avoid clipping. Truncated words and phrases are hard to scan and decipher. Text truncation is automatic in all table cell styles, but it can present more or less of a problem depending on which cell style you use and where truncation occurs.
クリッピングを避けるためにテキストは簡潔にしておいてください。 切り詰められた単語やフレーズは、スキャンや判読が難しいでsy。 テキストの切り捨ては、すべての表のセルスタイルで自動的に行われますが、使用するセルスタイルや切り捨ての場所によっては、多少の問題が発生する可能性があります。
Consider using a custom title for a Delete button. If a row supports deletion and it helps provide clarity, replace the system-provided Delete title with a custom title.
削除ボタンにカスタムタイトルを使用することを検討してください。 ある行が削除をサポートしており、それが明確になるようにするには、システム提供の削除タイトルをカスタムタイトルに置き換えます。
Provide feedback when a selection is made. People expect a row to highlight briefly when its content is tapped. Then, people expect a new view to appear or something to change, such as a checkmark appearing, that indicates a selection has been made.
選択が行われたときにフィードバックを提供します。 人々は、そのコンテンツがタップされたときに行が瞬間的に強調表示されることを期待しています。 次に、選択が行われたことを示すチェックマークが現れるなど、新しいビューが表示されるか、何かが変更されることが予想されます。
Design a custom table cell style for nonstandard table rows. Standard styles are great for use in a variety of common scenarios, but some content or your overall app design may call for a heavily customized table appearance. To learn how to create your own cells, see Customizing Cells in Table View Programming Guide for iOS.
非標準の表の行にカスタムのセルスタイルを設計します。 標準スタイルはさまざまな一般的なシナリオで使用するのに最適ですが、一部のコンテンツや全体のアプリデザインでは、カスタマイズされたテーブルの外観が必要になることがあります。 独自のセルを作成する方法については、「iOS用Table Viewプログラミングガイド」の「セルのカスタマイズ」を参照してください。
For developer guidance, see UITableViewCell.
