Свајп у мобилним апликацијама — врсте покрета и имплементација

Шта је свајп у мобилним интерфејсима

Свајп (swipe) је покрет којим корисник превлачи прстом по екрану у одређеном смеру, покрећући акцију. За разлику од додира (кратког додира), свајп подразумева покрет и контакт са екраном током целог покрета.

Историја свајпа почела је са првим iPhone-ом 2007. године — покрет откључавања „slide to unlock” постао је знак препознавања мобилних интерфејса. Данас се свајп користи у хиљадама апликација за навигацију, управљање садржајем и организацију информација.

Према UX Planet (2025), апликације са управљањем покретима (укључујући свајп) показују 18% већу заинтересованост корисника. Свајп се доживљава као природније дејство у поређењу са притиском дугмета, јер имитира физичко премештање предмета.

Параметри препознавања свајпа

Основни параметри који одређују да ли је покрет свајп: минимална удаљеност (обично 30–50 пиксела), максимално одступање од праве линије (не више од 15–20 степени) и максимално трајање контакта (до 500 ms). Ако прст задржи на екрану дуже, покрет се класификује као превлачење (drag) или дуго притискање (long press).

Врсте свајпова према смеру

Према смеру кретања свајпови се деле на четири основна типа: лево, десно, горе и доле. Сваки тип има своју намену и контекст коришћења.

Хоризонтални свајпови (лево/десно) најчешће се користе за управљање појединачним елементима — брисање, архивирање, листање. Вертикални свајпови (горе/доле) — за навигацију између екрана и ажурирање садржаја. Према Material Design Guidelines (2024), хоризонтални свајп је згоднији за десноруке: покрет улево палцем је природнији на десној руци.

Вишепрсти свајпови

Свајпови са два и три прста користе се за напредне радње. Са два прста — пребацивање између радних површина на iPad-у, поништавање радње (three-finger swipe). Са три прста — снимање екрана на неким уређајима. Међутим, вишепрсти покрети су мање интуитивни и захтевају учење корисника.

Имплементација свајпа на iOS

На iOS-у управљање покретима се заснива на UIGestureRecognizer — апстрактној класи која анализира низ догађаја додира и одређује да ли одговара одређеном покрету.

import UIKit

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        let swipeLeft = UISwipeGestureRecognizer(
            target: self,
            action: #selector(handleSwipe)
        )
        swipeLeft.direction = .left
        view.addGestureRecognizer(swipeLeft)
    }

    @objc func handleSwipe(sender: UISwipeGestureRecognizer) {
        print("Превуци лево")
    }
}

UISwipeGestureRecognizer подржава подешавање смера (direction) и броја прстију (numberOfTouchesRequired). Подразумевано је потребан један прст и смер надесно. За одређивање других смерова потребно је експлицитно навести direction: .left, .up, .down.

API вишег нивоа — UICollectionViewLayout са подршком за swipe акције. Почевши од iOS 11, табеле и колекције подржавају уграђене свајп акције кроз UISwipeActionsConfiguration, што омогућава додавање дугмића за брисање или архивирање без ручног управљања покретима.

Имплементација свајпа на Android

На Android-у управљање свајповима се обавља кроз GestureDetector — класу која анализира MotionEvents и позива одговарајуће callback методе.

class SwipeActivity : AppCompatActivity() {
    private val swipeThreshold = 100

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        val gestureDetector = GestureDetector(this, object : GestureDetector.SimpleOnGestureListener() {
            override fun onFling(
                e1: MotionEvent, e2: MotionEvent,
                velocityX: Float, velocityY: Float
            ): Boolean {
                val dx = e2.x - e1.x
                if (dx > swipeThreshold) {
                    println("Превуци десно")
                }
                return true
            }
        })
    }
}

Метод onFling у GestureDetector-у се позива када корисник брзо превуче прстом по екрану. Он добија почетне и крајње координате (e1, e2) и брзину покрета (velocityX, velocityY). За одређивање смера пореди се разлика координата на X или Y оси.

AndroidX библиотека пружа погоднији API: ViewCompat.setSwipeRefreshLayout за pull-to-refresh, RecyclerView са ItemTouchHelper за свајп акције у листама. ItemTouchHelper омогућава додавање свајп функционалности са визуелном повратном спрегом — иконицом, бојом позадине и анимацијом.

Свајп у веб апликацијама

У веб развоју за управљање свајповима користе се догађаји Touch Events API (touchstart, touchmove, touchend) и библиотеке помоћнице као што су Hammer.js или Swiper.js.

let startX = 0;
let startY = 0;
const threshold = 50;

element.addEventListener("touchstart", (e) => {
    startX = e.touches[0].clientX;
    startY = e.touches[0].clientY;
});

element.addEventListener("touchend", (e) => {
    const dx = e.changedTouches[0].clientX - startX;
    const dy = e.changedTouches[0].clientY - startY;
    if (Math.abs(dx) > threshold) {
        console.log(dx > 0 ? "Превуци десно" : "Превуци лево");
    }
});

Touch Events API — изворни начин управљања покретима у прегледачу. Догађај touchstart биљежи почетне координате, touchmove прати покрет, touchend одређује резултат. Праг вриједност (threshold) одстрањује случајне додире.

Према Can I Use (2026), Touch Events API подржава 98% прегледача. За сложене сценарије покрета (вишеструки свајпови, препознавање смера) препоручује се коришћење библиотеке Hammer.js, која апстрахира нисконивоско процесирање и пружа разумљив API.

UX обрасци са свајпом

Успешни UX обрасци са свајпом формирали су се годинама еволуције мобилних интерфејса. Њихово коришћење гарантује да ће корисник разумети како покрет ради без додатног учења.

Образац „Swipe to Delete” — најзаступљенији. Свајп улево по елементу листе отвара дугме за брисање. Стандардизован на iOS (SwipeActionsConfiguration) и Android (ItemTouchHelper). Корисници очекују да свајп улево брише или архивира елеменат.

Образац „Swipe to Go Back” — свајп од леве ивице екрана за повратак на претходни екран. Постао је стандард у iOS-у након iPhone X. На Android-у слична навигација ради кроз системски покрет. Важно је да не дође до конфликта са овим системским покретом у сопственим апликацијама.

Образац „Pull to Refresh” — свајп надоле за ажурирање садржаја. Изумио га је Loren Brichter за Tweetie (2008), сада се користи у милионима апликација. Имплементиран у стандардним компонентама обе платформе.

• Повратна спрега — елеменат треба да се креће заједно са прстом, показујући резултат пре завршетка свајпа
• Конфликти покрета — избегавајте истовремене подршке хоризонталног свајпа и скроловања на истом елементу
• Откривеност — прве свајп акције треба да су праћене визуелним упутством
• Отказивање — корисник треба да има могућност да откаже свајп, враћајући прст у првобитну позицију