Что такое флик, стретч, пэн, свайп, тап, тач в смартфоне и планшете: мобильный слэнг. Как использовать жесты TalkBack Движение пальцем по экрану

Разрабатывая приложения для Android и iPhone с iPad (IOS) используя лишь веб-технологии, перед каждым девелопером встаёт рано или поздно вопрос реализации и использования в своей игре или приложении сложными мультитач действиями, такими как свайп, щепотка, а также обработки длительного тапа (длительное касание одним пальцем без движения) и drag"n"drop.

В этом материале мы рассмотрим способы осуществления обработки тач-событий разной сложности на Javascript Event"ах, без сторонних библиотек (jQuery min только прихватим).

Сразу оговорюсь, что использовать jQuery я буду только для того чтобы отключить дефолтное поведение браузера на событие. Мне не нравится эта библиотека, поэтому всё будет написано на Vanilla JS.

Итак, начнём мы с теории и собственно коснёмся того какие события стоит использовать при создании приложения или игры.

Всего используются 3 ключевых события:

touchstart - Коснулись экрана

touchend - Палец убрали

touchmove - Двигаем пальцем

Если чтобы получить элемент на который заехала мышь или съехала, было достаточно вызвать event.target, то с touch-событиями не так всё просто.

Каждое касание должно идентифицироваться. И для этого используются списки:

touches - Все пальцы которые сейчас взаимодействуют с экраном ("Коснуты" экрана)

targetTouches - Список пальцев которые взаиможействуют с элементом

changedTouches - Список пальцев, которые учавствуют в текущем событии. Если например это событие touchend, то список будет содержать палец который был убран (Даже если остальные 4 пальца до сих пор на экране).

Чтобы было проще понять вот ситуация:

Я ставлю один палец на экран и все 3 списка имеют один элемент.

Я ставлю второй палец и теперь touches имеет 2 элемента, targetTouches будет иметь 2 элемента если второй палец я поставлю на тот же HTML элемент что и первый, а changedTouches в свою очередь будет иметь только второй палец, так как именно он вызвал событие.

Если я поставлю на экран сразу 2 пальца одновременно, тогда changedTouches будет иметь 2 элемента (по каждому на палец).

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

Если я уберу палец, то списки touches, targetTouches опустеют на один элемент, а changedTouches будет содердать палец, так как он вызвал событие (touchend)

Когда я уберу последний палец, списки touches, targetTouches не будут содержать ничего, а changedTouches будет иметь информацию о этом самом пальце.

Теперь самое время узнать какую именно информацию мы можем получить о пальце:

identifier - Уникальный ID касания

target - Сам объект к которому мы коснулись

PageX,PageY - Координаты касания на странице

Посмотреть уникальный ID единственного касания можно вызвав event.touches.identifier , а на IOS, если я не ошибаюсь надо делать так event.originalEvent.touches.identifier .

Что ж, кой чему я вас уже научил, а теперь самое время перейти к практике.

Перед тем как мы приступим вам следует усвоить кое-что. В каждой игре, приложении которое вы будете делать на Android и IOS вы должны отключить стандартную реакцию компонента WebView на события. Для этого мы и подключали jQuery (Я не смог сделать на Pure JS то что делают функции event.preventDefault() и event.stopPropagation() ).

Итак вам нужно поместить в ваш JS код следующее:


event.preventDefault();
event.stopPropagation();

}, false);


event.preventDefault();
event.stopPropagation();
/* Здесь ваш код обработки события*/
}, false);


event.preventDefault();
event.stopPropagation();
/* Здесь ваш код обработки события*/
}, false);

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

Отвелеклись. Продолжаем.

Давайте имея полученные знания опишем все основные touch взаимодействия с экраном и элементами.

Tap (Косание)

Это событие выполняется просто когда мы косаемся пальцем экрана и убираем его.



var myclick=event.targetTouches; /*Ваш код*/
}
}, false);

На примере в переменной myclick будет содержаться ваше касание.

Long tap (Длительное косание)

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

Реализация 1:

var ldelay;
var betw={};
document.addEventListener("touchstart", function(event) {
event.preventDefault();
event.stopPropagation();
ldelay=new Date();
betw.x=event.changedTouches.pageX;
betw.y=event.changedTouches.pageY;
}, false);
/*Ловим отпускание пальца*/
document.addEventListener("touchend", function(event) {
var pdelay=new Date();
if(event.changedTouches.pageX==betw.x &&
event.changedTouches.pageY==betw.y &&
(pdelay.getTime()-ldelay.getTime())>800){
/*Здесь ваш код*/
}
}, false);

Это первая реализация Long Tap на яваскрипте. Логика такая: ловим касание, замеряем время этого события, ловим отпускание, замеряем время отпускания, вычитаем первое время из второго и проверяем не изменилось ли положения пальца на экране. Если палец на том же месте и времени прошло более 800 миллисекунд, мы выполняем действия Long Tap.

Теперь давайте разберём вторую реализацию с немного другой логикой:

Реализация 2:

var lttimer;
document.addEventListener("touchstart", function(event) {
event.preventDefault();
event.stopPropagation();
lttimer=setTimeout(longTouch,800);
}, false);
document.addEventListener("touchmove", function(event) {
event.preventDefault();
event.stopPropagation();
clearTimeout(lttimer);
}, false);
document.addEventListener("touchend", function(event) {
clearTimeout(lttimer);
}, false);
function longTouch(){/*Ваш код*/}

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

Swipe (Листание)

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

Если вы не хотите заморачиваться и вам нужен только функционал Swipe в мобильном приложении, вы можете почитать в самом низу страницы об этом.

Если же вы зардкорный девелопер - поехали!

Реализация 1:

var initialPoint;
var finalPoint;
document.addEventListener("touchstart", function(event) {
event.preventDefault();
event.stopPropagation();
initialPoint=event.changedTouches;
}, false);
document.addEventListener("touchend", function(event) {
event.preventDefault();
event.stopPropagation();
finalPoint=event.changedTouches;
var xAbs = Math.abs(initialPoint.pageX - finalPoint.pageX);
var yAbs = Math.abs(initialPoint.pageY - finalPoint.pageY);
if (xAbs > 20 || yAbs > 20) {
if (xAbs > yAbs) {
if (finalPoint.pageX < initialPoint.pageX){
/*СВАЙП ВЛЕВО*/}
else{
/*СВАЙП ВПРАВО*/}
}
else {
if (finalPoint.pageY < initialPoint.pageY){
/*СВАЙП ВВЕРХ*/}
else{
/*СВАЙП ВНИЗ*/}
}
}
}, false);

Это у нас первая реализация свайпа на Javascript. Особенность этой реализации в том что событие засчитывается как свайп, когда вы отпускаете палец участвующий в событии. Данный свайп может быть применён в некоторых задачах. Не забывайте в этом и многих других премерах выключать стандартное поведение браузера на тач события (Об этом я писал выше), я не пишу обычно их в приведённых примерах, но вы не забывайте.

А теперь рассмотрим другую - классическую реализацию, когда swipe нужно считать в реальном времени, например при перелистывании страницы:

var startPoint={};
var nowPoint;
var ldelay;
document.addEventListener("touchstart", function(event) {
event.preventDefault();
event.stopPropagation();
startPoint.x=event.changedTouches.pageX;
startPoint.y=event.changedTouches.pageY;
ldelay=new Date();
}, false);
/*Ловим движение пальцем*/
document.addEventListener("touchmove", function(event) {
event.preventDefault();
event.stopPropagation();
var otk={};

otk.x=nowPoint.pageX-startPoint.x;
/*Обработайте данные*/
/*Для примера*/
if(Math.abs(otk.x)>200){
if(otk.x<0){/*СВАЙП ВЛЕВО(ПРЕД.СТРАНИЦА)*/}
if(otk.x>0){/*СВАЙП ВПРАВО(СЛЕД.СТРАНИЦА)*/}
startPoint={x:nowPoint.pageX,y:nowPoint.pageY};
}
}, false);
/*Ловим отпускание пальца*/
document.addEventListener("touchend", function(event) {
var pdelay=new Date();
nowPoint=event.changedTouches;
var xAbs = Math.abs(startPoint.x - nowPoint.pageX);
var yAbs = Math.abs(startPoint.y - nowPoint.pageY);
if ((xAbs > 20 || yAbs > 20) && (pdelay.getTime()-ldelay.getTime())<200) {
if (xAbs > yAbs) {
if (nowPoint.pageX < startPoint.x){/*СВАЙП ВЛЕВО*/}
else{/*СВАЙП ВПРАВО*/}
}
else {
if (nowPoint.pageY < startPoint.y){/*СВАЙП ВВЕРХ*/}
else{/*СВАЙП ВНИЗ*/}
}
}
}, false);

В этом способе мы пошли немного другим путём и чстично использовали принцип первой реализации. По своей логике это немного более сложный свайп. В том месте где откомментировано /*Обработайте данные*/, вы должны использовать координаты свайпающего пальца. Например, это может быть анимация перелистывания страницы и чем левее палец тем больше отлистывается страница. Для примера мы в той части слушателя события touchmove отслеживали только x-координату, y - прикручивается подобным образом. В переменной otk.x храниться текущее положение пальца относительно точки где он впервые коснулся эрана. Если палец левее этой точки то переменная имеет отрицательное значение, если правее - положительное.

Для примера мы там поставили условие когда палец перемещается на расстояние более 200 пикселей в лево или право от точки касания - мы засчитываем свайп. Для чего это нужно? Например вы можете как только пользователь коснулся и начал двигать палец показывать ему плавное перелистывание страницы, которая идёт за его пальцем, а как только палец уходит за 200 пикселей, совершает окончательная анимация и страница перелистывается. Это как одна из возможных способом применения такого свайпа.

Но зачем тогда событие touchend спросите вы... Иногда пользователь не желает на какое -то расстояние перемещать свой палец для свайпа и во многих приложениях используется свайп как реакция на быстрое перемещение пальца по экрану в сторону на небольшое расстояние. Именно это мы и применили в последнем слушателе событий.

Drag"n"Drop (Перетаскивание элемента)

Нередко в интерфейсах приложений и в играх приходится перетаскивать пальцем один из элементов в определённое место. Давайте сделаем это на javascript заточенным под сенсорные экраны. Начнём:

var obj = document.getElementById("sat");
/*Ловим касание*/
obj.addEventListener("touchstart", function(event) {
if (event.targetTouches.length == 1) {
var touch=event.targetTouches;
touchOffsetX = touch.pageX - touch.target.offsetLeft;
touchOffsetY = touch.pageY - touch.target.offsetTop;
}
}, false);
/*Передвигаем объект*/
obj.addEventListener("touchmove", function(event) {
if (event.targetTouches.length == 1) {
var touch = event.targetTouches;
obj.style.left = touch.pageX-touchOffsetX + "px";
obj.style.top = touch.pageY-touchOffsetY + "px";
}
}, false);

Как видно это не весь код, у нас пока получился drag без drop"а. Вы уже наверняка обратили внимание что передвижение элемента в конечном счёте производится css параметрами left и top . Можно вместо этих двух строчек, отвечающих за передвижение объкта по экрану поставить:

obj.style.WebkitTransform="translate("+(touch.pageX-touchOffsetX)+"px,"+(touch.pageY-touchOffsetY)+"px)";

Т.е. использовать CSS3, однако в своём случае я не заметил прироста производительности, пожтому лувше top и left . Этим кодом вы можете передвигать предмет по полю, но его отпускание на каком-то определённом месте засчитано не будет. Чтобы это реализовать добавим на объект обработчик touchend с соответствующим кодом внутри:

var tarobj=document.getElementById("dro");
obj.addEventListener("touchend", function(event) {
if (event.changedTouches.length == 1) {
var tarWidth=tarobj.offsetWidth;
var tarHeight=tarobj.offsetHeight;
var tarX=tarobj.offsetLeft;
var tarY=tarobj.offsetTop;
if(
(event.changedTouches.pageX > tarX) &&
(event.changedTouches.pageX < (tarX + tarWidth)) &&
(event.changedTouches.pageY > tarY) &&
(event.changedTouches.pageY < (tarY + tarHeight))){
/*Мы над объектом tarobj*/
}
}
}, false);

Для того чтобы всё работало, укажите ваш объект в переменную tarobj и будет вам счастье.

Pitch (Щепотка)

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

В примере ниже отмечены комментариями ключевые моменты (чтобы код не сливался в полнейшую пшеничную кашу):

/*Определяем некоторые переменные*/
var objzoom = document.getElementById("dro");
var scaling = false;
var dist = 0;
var scale_factor = 1.0;
var curr_scale = 1.0;
var max_zoom = 8.0;
var min_zoom = 0.5
/*Пишем функцию, которая определяет расстояние меж пальцами*/
function distance (p1, p2) {
return (Math.sqrt(Math.pow((p1.clientX - p2.clientX), 2) + Math.pow((p1.clientY - p2.clientY), 2)));
}
/*Ловим начало косания*/
objzoom.addEventListener("touchstart", function(evt) {
evt.preventDefault();
var tt = evt.targetTouches;
if (tt.length >= 2) {
dist = distance(tt, tt);
scaling = true;
} else {
scaling = false;
}
}, false);
/*Ловим зумирование*/
objzoom.addEventListener("touchmove", function(evt) {
evt.preventDefault();
var tt = evt.targetTouches;
if (scaling) {
curr_scale = distance(tt, tt) / dist * scale_factor;
objzoom.style.WebkitTransform = "scale(" + curr_scale + ", " + curr_scale + ")";
}
}, false);
/*Ловим конец косания*/
objzoom.addEventListener("touchend", function(evt) {
var tt = evt.targetTouches;
if (tt.length < 2) {
scaling = false;
if (curr_scale < min_zoom) {
scale_factor = min_zoom;
} else {
if (curr_scale > max_zoom) {
scale_factor = max_zoom;
} else {
scale_factor = curr_scale;
}
}
objzoom.style.WebkitTransform = "scale(" + scale_factor + ", " + scale_factor + ")";
} else {
scaling = true;
}
}, false);

В примере мы используем для теста объект с id dro , вы можете использовать свой объект, прописав его переменной objzoom . В переменных вы можете поменять данные, например максимальный зум или минимальный.

Слайдинг изображений и HTML

Мы уже выше описали ка сделать swipe на основе которого можно сделать слайдинг изображений или своих данных в HTML коде. Однако некоторых может не устроить такое и если вы в числе тех кто хочет проще и быстрее получить результат не вдаваясь в подробности, для вас этот подраздел.

Первым делом отметим бесплатную JS-разработку под названием Fotorama , которая очень функциональна и пригодится разработчикам мобильных приложений, кто хочет использовать слайдинг.

Есть также красивый слайдинг изображений .

Помимо такого мануального создания тач-оболочки приложения или игры, вы можете использовать фреймворк. Вот список популярных в этой теме фреймворков Sencha Touch , jQ Touch , JQuery Mobile .

Последний вопрос - вопрос совместимости этого всего с мобильными платформами. Что ж, touch поддерживают Android 2.3-4.X и IOS. А вот мультитач поддерживают все кроме Android 2.3.

Не забывайте что вешать обработчики на HTML-объекты стоит тогда когда они уже известны, т.е. в событии window.onload или DOMContentLoaded .

Если есть чем дополнить статью - пишите в комментариях.


Дорогие друзья, начинающие осваивать смартфон!

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

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

Итак, вот основные приемы управления сенсорным экраном:

Одиночное касание (tap)

Это быстрое (практически без задержки) касание экрана одним пальцем . Задержка не должна превышать 0.5 секунды. Любое касание достаточно делать легко, так как современные емкостные сенсорные экраны очень чувствительны (в отличие от уже ушедших в прошлое резистивных).

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

Одиночное касание в текстовых полях вставляет курсор в место касания.

Касание с задержкой (long tap)

Это касание одним пальцем с задержкой более 1 сек (до появления результата). Результат может быть различным в зависимости от ситуации. В большинстве случаев это действие приводит к появлению контекстного меню (аналог правой кнопки мыши).

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

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

Двойное касание (double tap)

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

Касание с перемещением (tap & drag)

Это касание одним пальцем с немедленным (задержка не более 0.2 сек) началом перемещения пальца по экрану, не отпуская пальца. Дальнейшая задержка на одном месте уже после начала перемещения не играет роли: содержимое экрана как бы прилипает к пальцу до момента отпускания. Так делается пролистывание рабочих столов (экранов), страниц в браузере в любом направлении, пролистывание списков (например, контактов) и т.п. Этот жест также служит для перемещения движков различных виртуальных регуляторов (например, громкости, яркости и т.п.).

Смахивание (swipe)

Это действие одним пальцем похоже на предыдущее, но только делается без длительного перемещения по экрану, напоминает быстрый мазок кистью по бумаге. При этом содержимое экрана продолжает перемещаться даже после отрыва пальца от экрана в процессе «мазка» с постепенным замедлением. Я помню видео, как первая демонстрация этого эффекта Стивом Джобсом на презентации Apple iPhone 2G в 2007 году сорвала шквал аплодисментов.

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

Сведение (щипок) и разведение двух пальцев (pinch, zoom)

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

Вращение двумя пальцами (rotate)

Это еще один прием, применяемый для вращения изображения на экране. Два пальца после прикосновения к экрану совершают перемещение каждый по дуге окружности в одинаковом направлении (по часовой или же против часовой стрелки). Или же один палец стоит неподвижно в центре вращения, а другой перемещается по дуге вокруг этого центра. Этот способ применяется достаточно редко. Например, я пользовался им при редактировании изображения в приложении MDScan для получения отсканированных копий документов.


На устройствах с Android используется сенсорный экран. Пользователям, которые привыкли к кнопочному управлению, бывает непросто перестроиться на работу с сенсорным экраном.

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

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

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

Рассмотрим основные семь приемов, применяемых на сенсорных экранах. Жесты Андроид могут быть следующие:

1. Касание (нажатие)

Касание (или нажатие) - это основное действие, которое чаще всего применяется на сенсорном экране.

Касание необходимо во многих случаях:

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

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

Для ввода текста достаточно коснуться нужного поля, автоматически появится виртуальная клавиатура, можно печатать текст, касаясь клавиш с нужными символами.

Невольно вспоминается, как много лет назад я подошла к терминалу, нажала на кнопки терминала, чтобы положить деньги на мобильный телефон. В общем, делала все как обычно, а ничего не происходило на терминале, терминал не реагировал на кнопки. Так я сделала 3 или 4 подхода к терминалу в разные дни с нулевым результатом. В какой-то хороший день молодой человек, который стоял в очереди к терминалу за мной, сказал: «А если нажать пальцем на экран?». И вот оно, счастье: я нажала пальцем на экран и терминал стал реагировать на нажатия, все получилось. Так я впервые встретилась с сенсорным экраном.

2. Двойное касание

Двойное касание (или двойное нажатие) применяется для быстрого масштабирования, для запуска каких-то приложений и других действий.

Для изменения масштаба, например, при просмотре какой-либо веб-страницы, надо 2 раза с минимальным интервалом быстро коснуться экрана. Чтобы вернуться к прежнему состоянию, надо опять сделать двойное касание по экрану.

Одно двойное касание включает соответствующую опцию, повторное двойное касание отменяет эту же опцию.

Если сравнивать Android с Windows, то двойное касание в Андроиде чем-то похоже на двойной щелчок левой кнопкой в Виндовс.

3. Касание с удержанием

Нажатие (касание) с удержанием используется для того, чтобы открыть дополнительные опции, если они есть.

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

Это действие очень похоже на нажатие правой кнопкой мыши в Windows, когда после клика правой кнопкой мыши по какому-либо объекту появляется так называемое контекстное меню с дополнительными опциями объекта.

4. Смахивание (пролистывание)

Смахивание можно также назвать пролистыванием или прокруткой. Слегка прикоснувшись к экрану, надо не отпуская палец, провести пальцем сверху вниз, снизу вверх, слева направо, либо справа налево, то есть, как бы смахнуть слегка «пыль с экрана» в нужном направлении.

Смахивание (пролистывание) применяется для переключения между страницами на Рабочем столе, для прокрутки различных списков и т.п. В зависимости от настройки блокировки экрана Андроида может быть так, что смахивание наискосок (по диагонали) означает разблокировку экрана – такое смахивание наискось тоже применяется, а не только махи снизу вверх или справа налево.

Когда мне впервые на смартфоне понадобилось отправить сообщение на русском языке по , для этого нужно было на виртуальной клавиатуре сменить раскладку с английской на русскую. Перепробовала все варианты, даже зашла в настройки языка - никак не получалось: английская раскладка «стояла как вкопанная». Мне подсказали, что надо просто слегка махнуть пальцем по пробелу слева направо. Кстати, я видела надпись «English» на клавише пробела на виртуальной клавиатуре, нажимала на нее, но безрезультатно. А как только махнула пальцем по пробелу, так раскладка сразу поменялась на русскую. Вот оно смахивание, работает!

5. Перетягивание (перетаскивание)

Перетягивание (или перетаскивание) требуется для перемещения приложений на экране, а также для переноса папок, значков и т.п.

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

6. Сведение и разведение пальцев

Простая и полезная функция для изменения масштаба того, что отображается на экране: картинка, текст, карта, схема и т.п. Можно увеличить масштаб, а при необходимости снова его уменьшить.

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

Если коснуться экрана двумя пальцами (или несколькими) и, не отрывая их от экрана, свести вместе, то масштаб уменьшится.

7. Изменение ориентации экрана

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

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

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

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

P.S. Посмотрите другие материалы:

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

.

Статьи и Лайфхаки

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

Что же такое все эти «флик », «стретч », «пэн », «тап », «свайп », «тач », и чем они отличаются друг от друга?

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

Скроллинг (scrolling , от scroll – свиток) – прокрутка тем или иным способом экрана. Термин появился еще на десктопах, где для скроллинга использовалось колесико мыши. В гаджетах осуществляется вертикальным движением пальца по дисплею.

Скриншот (screenshot , screen – экран, shot – выстрел) – т.н. снимок экрана, при котором текущая картинка сохраняется в графический файл. Для создания скриншотов используются соответствующие приложения, а также «облачные» сервисы.

Гестуры , жесты (gestures ) – определенные движения по экрану указателя, в данном случае – пальца или , позволяющие заменить те или иные команды или их последовательности. Существенно ускоряют и упрощают работу с мобильными устройствами.

Тачскрин (touch screen , touch – касаться) – сенсорный дисплей, реагирующий на касания. Кроме мобильных устройств, используется в терминалах и банкоматах.

Тап и даблтап – (tap – нажатие) – короткое нажатие на элемент интерфейса сенсорного дисплея, сродни щелчку мышью. Соответственно, даблтап – двойной щелчок.

Тач – более продолжительное, чем тап, нажатие, в десктопах аналога не имеет.

Тач-н-холд (touch and hold – коснуться и удерживать) – явствует из перевода: нажатие и продолжительное удержание пальца или стилуса.

Свайп , слайд (swype , slide – скользить) – продолжительное скользящее движение пальца по дисплею, например, при открытии шторки камеры.

«Свайп» еще имеет другое значение – особый способ набора текста, не отрывая палец от виртуальной клавиатуры, используемый в популярном приложении Swype Keyboard.

Флик (flick - легкий удар, щелчок) – щелчок по дисплею смартфона или планшета наискось, после чего экран начинает двигаться в указанном направлении.

Пэн (pan – панорамирование, а вовсе не «сковорода» или «унитаз», как некоторые могли подумать) – движение по экрану увеличенного изображения, позволяющее увидеть скрытые за краем экрана части.

Пинч (pinch – щипок) и стретч (stretch – растяжение) – «сжимающие» и «растягивающие» движение пальцами, позволяющие, соответственно, уменьшить или увеличить масштаб картинки.

Кому-то может быть не по вкусу засилье в современном лексиконе подобных сленговых слов.

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

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

Как работать