web-dev-qa-db-ja.com

複数のチェックボックスに似た機能を持つコントロール

問題と現状:

複数のチェックボックスに似た機能を持つフィルタリングコントロールを探しています。ユーザーにはオプションの(短い)リストがあり、オプションの一部またはすべてにチェックを付けることができます。

以下のスクリーンショットに示すように、今日、ユーザーは "EEE"または "FFF"または"すべて"enter image description here

しかし、今後のアップデートでは、2つ以上の可能なカテゴリを用意します。つまり、 "EEE" "FFFを作成します"" GGG "" HHH "など。したがって、現在のコントロールは関係ありません。


可能な解決策:

私は複数のチェックボックスを検討しましたが、それは少し悪いように見えます、そしていくつかの場所で提案されているようにそれらを垂直に配置すると(たとえば here および here )、それはたくさんかかります余裕がない不動産。

  1. 私が見つけた主な代替案は、選択された複数の選択コントロールでした( here を参照してください) enter image description here

私はリストにいくつかの(4-5)アイテムしかないため、コントロールをアクティブ化せずにすべてのオプションを表示してほしい(コントロールを入力またはクリック)。

  1. また、ユーザーがボタンをクリックして「オンにしたい」カテゴリをクリックすると、ボタンの色が変化する次のコントロールも検討しています。

enter image description here


私が検討しているコントロールと、自分のニーズに合った新しいコントロールについて見つけたら、フィードバックをいただければ幸いです。

追加のニーズ:

  • ユーザーは「準」技術ですが、可能な限り標準的なコントロールを使用することが比較的重要です。
  • また、私のアプリケーションではこの状態は役に立たないため、すべてのオプションの選択を解除することはできません。それは必見ではありません

どうもありがとう!


4
Hagai

上記のシナリオを考慮すると、提案したオプション2は両方の条件を満たすため、最も関連性があります。

1)すべてのオプションが表示されます

2)セミテクニカルユーザーが簡単に理解でき、基本的な基準を維持する

関連するタブのスタイリングについては、チェックできます ここ

また、私が理解している限り、「表示のみ」は「グループ化」の下にあります。その場合、下の画像のようにスタイルを設定できます。 enter image description here

以下の2番目の画像を確認してください。

enter image description here

3
Angiras Joshi

Appleは、テキストエディターTextEditでオプション2(「セグメント化されたコントロール」と呼ばれる)を使用しています。

TextEdit font/style toolbar with segmented controls as both radio buttons and checkboxes

特に、フォントスタイルを設定するためのB/I/Uはチェックボックスのように機能し、テキストの配置オプションはラジオボタンとして機能します。

個人的には、チェックボックスのようなボタンをグループ化することを好みますが、ボタンの間に(小さい)スペースを残し、すべての角を丸めます。これは、「ラジオボタン」スタイルのセグメント化されたコントロールと同様の視覚的外観を提供しますが、それらを明確に分離するため、相互に排他的ではないことは明らかです。

1
uliwitness