Курсор: различия между версиями

Материал из Википедии — свободной энциклопедии
Перейти к навигации Перейти к поиску
Интерактивная навигация по истории
[отпатрулированная версия][непроверенная версия]
← Предыдущая правка
Содержимое удалено Содержимое добавлено
ВизуальныйВики-текст
Спасено источников — 5, отмечено мёртвыми — 0. Сообщить об ошибке. См. FAQ.) #IABot (v2.0.8.8
м стилевые правки
 
(не показана 21 промежуточная версия 12 участников)
Строка 24: Строка 24:
=== Формы указателя ===
=== Формы указателя ===
Форма указателя может меняться в зависимости от объекта и режима взаимодействия с ним. Например, в графических редакторах курсор имеет форму текущего выбранного инструмента. Также современные [[операционная система|операционные системы]] и [[Среда рабочего стола|графические среды]] поддерживают несколько стандартных видов курсора:
Форма указателя может меняться в зависимости от объекта и режима взаимодействия с ним. Например, в графических редакторах курсор имеет форму текущего выбранного инструмента. Также современные [[операционная система|операционные системы]] и [[Среда рабочего стола|графические среды]] поддерживают несколько стандартных видов курсора:
* <span style="cursor:default">[[Файл:Css cursor default.png|link=]]Курсор по умолчанию — стрелка. Предполагается, что объект под таким курсором самостоятельно сообщает пользователю своим видом, можно ли с ним взаимодействовать;</span>
* <span style="cursor:default">[[Файл:Основной режим.png|link=]] Курсор по умолчанию — стрелка. Предполагается, что объект под таким курсором самостоятельно сообщает пользователю своим видом, можно ли с ним взаимодействовать;</span>
* <span style="cursor:pointer">[[Файл:Css cursor pointer.png]]Курсор-рука — для обозначения гиперссылок, чтобы сообщить пользователю о том, что гиперссылка работает;</span>
* <span style="cursor:pointer">[[Файл:Курсор-рука.png]] Курсор-рука — для обозначения гиперссылок, чтобы сообщить пользователю о том, что гиперссылка работает;</span>
* <span style="cursor:crosshair">[[Файл:Css cursor crosshair.png|link=]]Перекрестие — используется прежде всего для графического выделения;</span>
* <span style="cursor:crosshair">[[Файл:Графическое выделение указателя мыши.png|link=]] Перекрестие — используется прежде всего для графического выделения;</span>
* [[Файл:Css cursor text.png|link=]]Текстовое выделение — сигнализирует о том, что в это поле можно вводить текст, а также для него действуют выделения и контекстные меню, характерные для полей текстового ввода;
* <span style="cursor:text">[[Файл:Курсор текста.png|link=]] Текстовое выделение — сигнализирует о том, что в это поле можно вводить текст, а также для него действуют выделения и контекстные меню, характерные для полей текстового ввода;</span>
* <span style="cursor:move">[[Файл:Css cursor move.png|link=]]Курсор перемещения — сигнализирует о том, что для выбранного объекта доступна функция [[drag-and-drop|перетаскивания]];</span>
* <span style="cursor:move">[[Файл:Курсор перемещения.png|link=]] Курсор перемещения — сигнализирует о том, что для выбранного объекта доступна функция [[drag-and-drop|перетаскивания]];</span>
* Курсоры изменения размеров: <span style="cursor:n-resize"><div style="display:inline-block;width:16px;height:16px;overflow:hidden;"><div style="margin-left:-17px; margin-top:-51px">[[Файл:Monocursors.png|link=]]</div></div>с верхнего </span><span style="cursor:s-resize">нижнего краёв</span>, <span style="cursor:w-resize"><div style="display:inline-block;width:16px;height:16px;overflow:hidden;"><div style="margin-left:-34px; margin-top:-51px">[[Файл:Monocursors.png|link=]]</div></div>с левого и</span> <span style="cursor:e-resize">правого края</span>, а также с углов: <span style="cursor:nw-resize"><div style="display:inline-block;width:16px;height:16px;overflow:hidden;"><div style="margin-left:-51px; margin-top:-51px">[[Файл:Monocursors.png|link=]]</div></div>левого верхнего и</span> <span style="cursor:se-resize">правого нижнего</span>, <span style="cursor:sw-resize"><div style="display:inline-block;width:16px;height:16px;overflow:hidden;"><div style="margin-left:-85px; margin-top:-51px">[[Файл:Monocursors.png|link=]]</div></div>левого нижнего и</span> <span style="cursor:ne-resize">правого верхнего</span>;
* Курсоры изменения размеров: <span style="cursor:n-resize">[[Файл:Изменение вертикальных размеров.png|link=]] с верхнего и</span> <span style="cursor:s-resize">нижнего краёв</span>, <span style="cursor:w-resize">[[Файл:Изменение горизонтальных размеров.png|link=]] с левого и</span> <span style="cursor:e-resize">правого края</span>, а также с углов: <span style="cursor:nw-resize">[[Файл:Изменение размеров по диагонали 1.png|link=]] левого верхнего и</span> <span style="cursor:se-resize">правого нижнего</span>, <span style="cursor:sw-resize">[[Файл:Изменение размеров по диагонали 2.png|link=]] левого нижнего и</span> <span style="cursor:ne-resize">правого верхнего</span>;
* <span style="cursor:help">[[Файл:Css cursor help.png|link=]]Курсор режима справки — сигнализирует, что для данного объекта по нажатию кнопки мыши доступна справка, либо имеется всплывающая подсказка;</span>
* <span style="cursor:help">[[Файл:Курсор режима справки.png|link=]] Курсор режима справки — сигнализирует, что для данного объекта по нажатию кнопки мыши доступна справка, либо имеется всплывающая подсказка;</span>
* <span style="cursor:progress"><div style="display:inline-block;width:16px;height:16px;overflow:hidden;"><div style="margin-left:-33px; margin-top:-17px">[[Файл:Monocursors.png|link=]]</div></div>Курсор фонового режима — показывает, что действие запущено, но видимых результатов может не быть. Такой курсор используется для того, чтобы пользователь увидел, что команда принята и повторно нажимать на объект не требуется. В некоторых графических средах рядом с курсором отображается движущийся значок запущенного приложения;</span>
* <span style="cursor:progress">[[Файл:Фоновый режим.png|link=]] Курсор фонового режима — показывает, что действие запущено, но видимых результатов может не быть. Такой курсор используется для того, чтобы пользователь увидел, что команда принята и повторно нажимать на объект не требуется. В некоторых графических средах рядом с курсором отображается движущийся значок запущенного приложения;</span>
* <span style="cursor:wait">[[Файл:Css cursor wait.png|link=]]Курсор ожидания — сообщает пользователю, что в текущий момент взаимодействие с элементом невозможно по причине выполнения программой каких-то операций. По окончании выполнения курсор должен вернуться в исходное состояние;</span>
* <span style="cursor:wait">[[Файл:Курсор "Занят".png|link=]] Курсор ожидания — сообщает пользователю, что в текущий момент взаимодействие с элементом невозможно по причине выполнения программой каких-то операций. По окончании выполнения курсор должен вернуться в исходное состояние;</span>
* <span style="cursor:not-allowed">[[Файл:SlashCircle.svg|20px|link=]] Курсор запрета действия — сообщает, что какое-то действие (перетаскивание, нажатие и т. д.) для данного элемента недоступно.</span>
* <span style="cursor:not-allowed">[[Файл:Запрет действия.png|link=]] Курсор запрета действия — сообщает, что какое-то действие (перетаскивание, нажатие и т. д.) для данного элемента недоступно.</span>
Изменение формы указателя для конкретного элемента доступно также для веб-страниц с помощью свойств [[CSS]]<ref>{{Cite web |url=http://htmlbook.ru/css/cursor |title=Сайт Влада Мержевича |access-date=2011-07-27 |archive-date=2011-07-26 |archive-url=https://web.archive.org/web/20110726205101/http://htmlbook.ru/css/cursor |deadlink=no }}</ref><ref>{{Cite web |url=http://www.w3schools.com/cssref/pr_class_cursor.asp |title=CSS cursor Property — W3School |access-date=2015-10-25 |archive-date=2015-10-25 |archive-url=https://web.archive.org/web/20151025125907/http://www.w3schools.com/cssref/pr_class_cursor.asp |deadlink=no }}</ref><ref>{{Cite web |url=http://www.w3.org/wiki/CSS/Properties/cursor |title=World Wide Web consortium wiki |access-date=2015-10-25 |archive-date=2015-10-29 |archive-url=https://web.archive.org/web/20151029055939/http://www.w3.org/wiki/CSS/Properties/cursor |deadlink=no }}</ref>.
Изменение формы указателя для конкретного элемента доступно также для веб-страниц с помощью свойств [[CSS]]<ref>{{Cite web |url=http://htmlbook.ru/css/cursor |title=Сайт Влада Мержевича |access-date=2011-07-27 |archive-date=2011-07-26 |archive-url=https://web.archive.org/web/20110726205101/http://htmlbook.ru/css/cursor |deadlink=no }}</ref><ref>{{Cite web |url=http://www.w3schools.com/cssref/pr_class_cursor.asp |title=CSS cursor Property — W3School |access-date=2015-10-25 |archive-date=2015-10-25 |archive-url=https://web.archive.org/web/20151025125907/http://www.w3schools.com/cssref/pr_class_cursor.asp |deadlink=no }}</ref><ref>{{Cite web |url=http://www.w3.org/wiki/CSS/Properties/cursor |title=World Wide Web consortium wiki |access-date=2015-10-25 |archive-date=2015-10-29 |archive-url=https://web.archive.org/web/20151029055939/http://www.w3.org/wiki/CSS/Properties/cursor |deadlink=no }}</ref>.


Строка 39: Строка 39:


== См. также ==
== См. также ==
⚫
{{Навигация|Викисловарь=курсор}}
* [[Ресурсы (Windows)]]
* [[Ресурсы (Windows)]]


Строка 49: Строка 48:


== Ссылки ==
== Ссылки ==
⚫
{{Навигация|Викисловарь=курсор}}
* [https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/Pointers.html#//apple_ref/doc/uid/20000957-CH97-SW2 Pointers — OS X Human Interface Guidelines]
* [https://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/OSXHIGuidelines/Pointers.html#//apple_ref/doc/uid/20000957-CH97-SW2 Pointers — OS X Human Interface Guidelines]
* [https://habrahabr.ru/post/212939/ Почему курсор мыши наклонён на 45°]
* [https://habrahabr.ru/post/212939/ Почему курсор мыши наклонён на 45°]

Текущая версия от 11:26, 14 июня 2024

У этого термина существуют и другие значения, см. Курсор (значения).

Курсо́р[1] (лат. cursor — бегун[2]; англ. cursor — указатель, стрелка прибора) в интерфейсе пользователя — элемент графического интерфейса, который указывает на объект, с которым будет производиться взаимодействие с помощью клавиатуры, мыши или другого устройства управления. Различают текстовый курсор, обозначающий место ввода с клавиатуры; курсор мыши (или указатель мыши) и других указывающих устройств; курсор меню. Кроме указания на объект курсор может также отображать его состояние, например — невозможность взаимодействия.

Из истории

[править | править код]

В 1968 году американский изобретатель Дуглас Карл Энгельбарт совместно с командой из Стэнфордского исследовательского института создают первые элементы человеко-машинного интерфейса (UI — англ. user interface). Эти элементы являлись частью революционной разработки NLS (NLS — англ. oN-Line System), системы, которая реализовывала одновременную работу нескольких терминалов над одними и теми же документами. В этом же году 9 декабря состоялась демонстрация онлайн-системы, которая получила название «The Mother of All Demos», дословно «мать всех демонстраций», на которой можно было увидеть работу с гипертекстом и курсор.

Текстовый курсор

[править | править код]
Курсор в графическом режиме

Текстовый курсор (а также по аналогии с печатной машинкой — каретка, англ. caret) в общем случае обозначает место, куда будет вставлен введённый с клавиатуры текст. Курсор обычно мигает для того, чтобы его можно было быстро найти в тексте — неподвижный курсор может оказаться сложноразличимым в большом тексте. Наиболее распространённая форма курсора в современных интерфейсах пользователя — вертикальная черта, по высоте соответствующая высоте строки текста и располагающаяся в начале знакоместа вводимого символа. В некоторых случаях используются другие виды курсора: прямоугольник шириной в знакоместо, охватывающий следующий знак, символ подчёркивания или другой символ. К примеру, в компьютерах ZX-Spectrum в качестве курсора использовалась заглавная латинская буква в знакоместе.

Кроме индикации места ввода, курсор также может отображать:

  • режим ввода: например, при переключении из режима вставки в режим замены курсор обычно заменяется либо на символ подчёркивания, либо на прямоугольник, охватывающий всё следующее за ним знакоместо. В компьютерах ZX-Spectrum использовалось 5 режимов ввода, и все они обозначались различными буквами;
  • свойства вводимого текста: прежде всего кегль шрифта. В более продвинутых редакторах текста и текстовых процессорах с помощью курсора может отображаться начертание шрифта (прямой или курсив) и цвет;
  • курсор также используется для обозначения той границы выделения, которую можно расширить/уменьшить перемещением курсора с использованием клавиш-модификаторов.

Перемещать курсор по тексту можно как непосредственным указанием места с помощью указывающего устройства, так и с помощью клавиш управления курсором.

Курсор указывающего устройства

[править | править код]

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

Указатель может иметь разную форму, однако важной его частью является так называемый активный пиксель (англ. hotspot) — точка на экране, в которой расположен элемент, с которым происходит взаимодействие. Большинство курсоров имеют форму, указывающую на местоположение этой точки: у курсоров-стрелок активный пиксель расположен в конце стрелки, у курсоров-перекрестий — в центре. Если же курсор не предполагает взаимодействия с объектом на экране, например, у курсора ожидания, то местоположение активного пикселя в нём не имеет значения.

Формы указателя

[править | править код]

Форма указателя может меняться в зависимости от объекта и режима взаимодействия с ним. Например, в графических редакторах курсор имеет форму текущего выбранного инструмента. Также современные операционные системы и графические среды поддерживают несколько стандартных видов курсора:

  • Курсор по умолчанию — стрелка. Предполагается, что объект под таким курсором самостоятельно сообщает пользователю своим видом, можно ли с ним взаимодействовать;
  • Курсор-рука — для обозначения гиперссылок, чтобы сообщить пользователю о том, что гиперссылка работает;
  • Перекрестие — используется прежде всего для графического выделения;
  • Текстовое выделение — сигнализирует о том, что в это поле можно вводить текст, а также для него действуют выделения и контекстные меню, характерные для полей текстового ввода;
  • Курсор перемещения — сигнализирует о том, что для выбранного объекта доступна функция перетаскивания;
  • Курсоры изменения размеров: с верхнего и нижнего краёв, с левого и правого края, а также с углов: левого верхнего и правого нижнего, левого нижнего и правого верхнего;
  • Курсор режима справки — сигнализирует, что для данного объекта по нажатию кнопки мыши доступна справка, либо имеется всплывающая подсказка;
  • Курсор фонового режима — показывает, что действие запущено, но видимых результатов может не быть. Такой курсор используется для того, чтобы пользователь увидел, что команда принята и повторно нажимать на объект не требуется. В некоторых графических средах рядом с курсором отображается движущийся значок запущенного приложения;
  • Курсор ожидания — сообщает пользователю, что в текущий момент взаимодействие с элементом невозможно по причине выполнения программой каких-то операций. По окончании выполнения курсор должен вернуться в исходное состояние;
  • Курсор запрета действия — сообщает, что какое-то действие (перетаскивание, нажатие и т. д.) для данного элемента недоступно.

Изменение формы указателя для конкретного элемента доступно также для веб-страниц с помощью свойств CSS[3][4][5].

В операционных системах семейства Windows курсоры хранятся в файлах с расширениями .cur (для неподвижных версий) и .ani (анимированные курсоры). Все они представляют собой изображения размером 32×32 пикселя и могут иметь несколько цветовых вариаций для различной глубины цвета, установленной в системе (True Color, HiColor, 256 цветов, 16 цветов, монохромный). Начиная с версии Windows XP курсоры мыши поддерживают режим 32bpp, с указанием альфа-канала для каждой точки.

См. также

[править | править код]

Примечания

[править | править код]
  1. ↑ курсо́р на gramota.ru. Дата обращения: 9 июля 2022. Архивировано 3 октября 2017 года.
  2. ↑ cursor в Викисловаре. Дата обращения: 11 апреля 2017. Архивировано 11 апреля 2017 года.
  3. ↑ Сайт Влада Мержевича. Дата обращения: 27 июля 2011. Архивировано 26 июля 2011 года.
  4. ↑ CSS cursor Property — W3School. Дата обращения: 25 октября 2015. Архивировано 25 октября 2015 года.
  5. ↑ World Wide Web consortium wiki. Дата обращения: 25 октября 2015. Архивировано 29 октября 2015 года.

Литература

[править | править код]
  • Алан Купер. об интерфейсе. Основы проектирования = About Face. The Essentials of Interaction Design. — 3. — СПб.: Символ-Плюс, 2009. — С. 437—441. — 688 с. — 1500 экз. — ISBN 978 5 93286 132 5.

Ссылки

[править | править код]
Источник — https://ru.wikipedia.org/w/index.php?title=Курсор&oldid=138366787