Шаблон для переключателей, каждый из которых выбирает набор других элементов управления?

Я заметил распространенный сценарий в разработке пользовательского интерфейса (как в веб-клиенте, так и в толстом клиенте), где есть группа переключателей, и нажатие на переключатель означает, что вы хотите «выбрать» определенный «набор» других элементов управления (для простоты , допустим, это все текстовые поля).

Просто чтобы проиллюстрировать, звездочки представляют собой переключатели, а символы подчеркивания представляют собой текстовые поля. Каждая радиокнопка должна «выбирать» «набор» текстовых полей в той же строке.

*   ________   ________  __________

*   ________

*   ________   ________

В переводе на требования пользовательского интерфейса это означает

  1. Всякий раз, когда пользователь щелкает переключатель, все значения в текстовых полях не в его "наборе" должны быть стерты, и

  2. Всякий раз, когда пользователь начинает вводить текст в текстовое поле, переключатель, управляющий им, должен быть выбран автоматически (что также подразумевает стирание других значений текстового поля, как указано выше).

Проблема для меня в том, что программировать это правильно на удивление сложно. Есть много событий, которые нужно обработать, и обработчики могут вызвать срабатывание других событий и т. д.

Есть ли какой-то «шаблон» для этого, которому можно следовать?


user-interface design-patterns client-side
person JoelFan    schedule 09.12.2009    source источник

Ответы (3)


arrow_upward
0
arrow_downward

На самом деле, с точки зрения удобства использования, я бы рекомендовал вам не стирать значения в текстовых полях, когда переключатель не выбран. Когда пользователь переключается между переключателями, вы не должны разрушать его работу. Не очищая текстовые поля, пользователь может вернуться к использованию варианта A после варианта B без повторного ввода значений текстового поля.

Вы можете отключить текстовые поля, когда соответствующий переключатель не выбран, чтобы показать пользователям, что значения текстовых полей не применяются. Вероятно, вам также следует сделать так, чтобы выбор радиокнопки автоматически помещал фокус в первое связанное текстовое поле, чтобы избавить пользователя от дополнительного щелчка мыши или нажатия клавиши табуляции. В большинстве случаев это будет так же эффективно, как если бы пользователь щелкнул нужное текстовое поле в исходном дизайне.

Этот дизайн также упрощает ваш код. Все, что вам нужно, это установить включение и фокус в событии Update для переключателей.

person Michael Zuschlag    schedule 11.12.2009

arrow_upward
0
arrow_downward

Есть много событий для обработки

Может помочь небольшая иерархия контроллеров. Контроллеры строк, отвечающие за обработку событий от виджетов в одной строке и выбор/отмену выбора определенной строки. Контроллер набора строк, отвечающий за передачу уведомлений «выбрана другая строка» строкам в наборе.

Можно было бы назвать это иерархическим MVC (вот вам шаблон :-) ), хотя это название кажется мне слишком тяжеловесным для описания вышеизложенного.

и обработчики могут вызывать другие события и т. д.

Похоже, что задача контроллеров строк заключается в подавлении вторичных событий, возникающих при выборе/отмене выбора строки. Контроллер строки знает, выполняется ли выбор/отмена выбора, и, таким образом, может подавлять вторичные события. Не уверен, что это шаблон для этого. Может быть, шаблон логического флага, чтобы указать, что выбор происходит :-)

person Rafał Dowgird    schedule 11.12.2009

arrow_upward
0
arrow_downward

Вы можете использовать шаблон пользовательского интерфейса «Подчиненная форма» и связанные с ним шаблоны (альтернативная подчиненная форма, выбор подчиненной формы и т. д.)

Вы можете прочитать объяснение этих шаблонов здесь.

person andrepf    schedule 11.12.2009