Tehnologija povleci in spusti v Androidu. Tehnika povleci in spusti z uporabo jQuery Kaj je povleci in spusti

Najlažje je nekaj vzeti in postaviti, kot pa pisati, kaj vzeti in kam dati. Seveda brez miške ali podobne naprave ne morete izbrati ničesar in ničesar ne označiti, a tudi v trenutnem stanju je uporaba ideje "povleci in spusti" zelo naravna in udobna.

Obseg ideje še zdaleč ni le v spletnih trgovinah, digitalne knjižnice, iskalni ali informacijski sistemi, pa tudi uporabno področje. Ideja je zelo uporabna pri razvoju spletnih mest in njihovih elementov, ki se ustvarjajo in vzdržujejo interaktivno, brez sodelovanja programerja.

Opis ideje

Izberite, premaknite in postavite - ideja je naravna in priročna. Neverjetno, da se ni rodila, ko je miška postala nepogrešljiv računalniški pripomoček.

Najbolj očiten primer je izbira izdelka v spletni trgovini. Želeni izdelek vzamete z miško in ga povlečete v nakupovalno košarico je preprosto, naravno in priročno. Nalaganje datotek: vzeti dokument izven okna brskalnika in ga postaviti na element strani ter tako sprožiti prenos dokumenta na strežnik, je tudi praktična ideja.

Za razvijalca je ideja "povleci in spusti" manipulacija elementov strani brez ročnega preračunavanja koordinat in velikosti oznak, možnost izbire več elementov in njihovo poravnavo ter premikanje stranic blokovnih oznak.

HTML in CSS sta odlična jezika za opisovanje oznak in njihovih slogov, toda ko ima razvijalec možnost interaktivnega manipuliranja elementov strani brez ročnega preračunavanja koordinat in velikosti, je to delo bolj udobno in učinkovito.

Enostaven prenos datotek

"Vleci in spusti": prevod iz angleščine v ruščino dobesedno zveni "povleci in spusti". V praksi se sliši in deluje bolje: izberite, prenesite in sprostite – preprosto in naravno.

Prenos datotek na stran, na strežnik ali za drugo uporabo je zelo preprost za implementacijo na strani.

V ta primer miška je izbrala več datotek na namizju (leva slika). Pri izbiri smo pritisnili levi gumb miške in izbrani je "šel" v košarico. Brskalnik je sam pokazal, kako se to zgodi, napisal "kopijo" namiga in ustvaril obrise datotek, ki jih je treba premikati.

Ko je bila miška nad košaro, je obiskovalec izpustil levi gumb miško, se je zgodil dogodek »povleci in spusti« in na strani spletnega mesta (spodnja slika) je koda JavaScript lahko sprejela in obdelala vse datoteke, ki jih je obiskovalec posredoval strani (strani).

Opis izvedbe

Koda, ki izvaja ta postopek, je zelo preprosta. Tudi začetni razvijalec ga lahko ponovi v vsakem primeru uporabe.

Tukaj je uporabniški vmesnik predstavljen z dvema oznakama: scPlaceFile (to je sama košarica, kamor morate vložiti datoteke) in scPlaceFiles (to je rezultat obdelave datotek, v tem primeru njihov seznam).

Logika strani je naslednja. Ko se stran naloži v brskalnik, se v košarico dodeli obdelovalec dogodkov »ondrop« – da se vnesejo, ostali dogodki so blokirani in se ne uporabljajo.

Stran deluje normalno, a takoj, ko obiskovalec izbere datoteko(e) in jih povleče na sliko košarice, torej na oznako scPlaceFile, se bo začela obdelava dogodka "datoteke prispele".

Ta upravljalnik preprosto prikaže seznam datotek. Njihovo število je v event.dataTransfer.files.length, informacije o vsaki datoteki pa v event.dataTransfer.files [i] .name. Kaj storiti s prejetimi podatki, določi razvijalec, v tem primeru se preprosto oblikuje seznam prejetih datotek.

Ko je dogodek obdelan, je blokiran in se ne širi. To je potrebno, da brskalnik ni samozaposlen in ne moti obdelave prejetih informacij.

DnD in zunanji podatki

Nalaganje slik na strežnik z uporabo povleci in spusti je običajna praksa v tej tehnologiji. Običajno razvijalec ustvari obrazec za nalaganje datoteke (1), ki deluje na običajen način (2). Obiskovalec lahko običajno izbere datoteke in jih naloži.

Če pa obiskovalec na določenem mestu na obrazcu naredi "povleci in spusti", se bo polje za ime datoteke(-e) samodejno izpolnilo.

to dobra odločitev... Seveda je zelo težko priznati, da na računalniku ni miške. Vendar je bolje oblikovati uporabniški vmesnik običajna različica in pri izvajanju DnD.

DnD in notranji podatki

Skrb za interese obiskovalcev je vedno pomembna, pomembni pa so tudi skrbi razvijalca. Povleci in spusti se lahko izvaja ne samo s standardnimi sredstvi, ampak tudi z obravnavo dogodkov miške na elementih strani.

Naloga izračunavanja vrednosti koordinat oznak in njihovih velikosti se nenehno pojavlja. Ročni izračun je dobra praksa, vendar je interaktivna možnost bolj priročna. Vse oznake so vedno pravokotne in s sledenjem dogodkom miške na straneh elementov lahko ustvarite možnost, da elemente samodejno premaknete na pravo mesto na strani ali jih spremenite.

Obravnava dogodka klika na gumb miške - shranjevanje koordinat mesta klika, na primer ene od strani elementa. Premaknite miško - stran se premakne v želeno smer. Sprostitev gumba miške - stran se ustavi in ​​njene koordinate se spremenijo. Na ta način lahko spremenite položaj elementa ali njegovo velikost.

To formalno ni "povleci in spusti", vendar je učinek podoben in praktičen. Z izdelavo univerzalnih upravljalnikov za kateri koli element strani lahko dobite dobre interaktivne rezultate, pospešite razvoj in poenostavite kodo.

Vizualno in ročno programiranje

Miška na računalniku in prsti na pametnem telefonu - absolutno različne pristope do izvedbe uporabniškega vmesnika (obiskalec, razvijalec). To je naravna in sodobna zahteva za združljivost med brskalniki.

Vse to skupaj otežuje ustvarjanje strani, vendar z uporabo ideje "povleci in spusti" v standardni obliki, z uporabo njenih dogodkov, združevanjem te ideje z običajnimi dogodki na elementih, lahko implementirate mehanizem, v katerem ustvarjanje stran se bo pojavila vizualno.

Zdaj pa si poglejmo izbor predmeta ali predmetov. Dejstvo izbire je videz kontekstnega menija, na primer cilj je poravnati izbrano (levo, desno, sredinsko) ali razdeliti elemente navpično ali vodoravno z istim korakom ali spremeniti njihovo velikost (najmanjša, največja) .

Samodejni ponovni izračun koordinat in dimenzij je boljši od ročnega preračunavanja. Manj napak - cilj je dosežen hitreje. Poleg tega lahko v enem brskalniku naredite stran, shranite položaj in velikost elementov. Če odprete to stran na pametnem telefonu, lahko popravite vrednosti koordinat in dimenzij ter si jih zapomnite za določen model pametnega telefona ali različico brskalnika.

Torej bo imela ista stran brez ročne skladnosti z zahtevo za več brskalnikov različne podatke za prikaz različne naprave in v različnih brskalnikih.

Če obiskovalcu dovolite, da te postopke izvede sam, ter izbere potrebne elemente strani med tistimi, ki jih zagotovi razvijalec, lahko zagotovite združljivost med brskalniki in zahtevano funkcionalnost strani ob upoštevanju mnenja uporabnika. .

HTML povleci in spusti vmesniki omogočajo aplikacijam uporabo funkcij povleci in spusti v brskalnikih. Uporabnik lahko izbere vlečen elemente z miško povlecite te elemente na a možnost spuščanja elementa in jih spustite tako, da spustite gumb miške. Prosojna predstavitev vlečen elementov sledi kazalcu med vlečenjem.

Za spletna mesta, razširitve in aplikacije XUL lahko prilagodite, kateri elementi lahko postanejo vlečen, vrsta povratne informacije vlečen elementi proizvajajo in možnost spuščanja elementov.

Ta pregled HTML Drag and Drop vključuje opis vmesnikov, osnovne korake za dodajanje podpore za povleci in spusti aplikaciji in povzetek interoperabilnosti vmesnikov.

Povlecite dogodke

Opomba: Niti dogodki dragstart niti dragend se ne sprožijo, ko povlečete datoteko v brskalnik iz OS.

Vmesniki

Osnove

Ta razdelek je povzetek osnovnih korakov za dodajanje funkcije povleci in spusti v aplikacijo.

Ugotovite, kaj je vlečen

Izdelava elementa vlečen zahteva dodajanje atributa, ki ga je mogoče povleči, in globalnega obdelovalca dogodkov ondragstart, kot je prikazano v naslednjem vzorcu kode:

Ta element je mogoče povleči.

Za več informacij glejte:

Obvladajte padec učinek

Upravljavec za dogodek spuščanja lahko brezplačno obdela podatke vlečenja na način, ki je specifičen za aplikacijo.

Običajno aplikacija uporablja metodo getData () za pridobivanje povlečnih elementov in jih nato ustrezno obdela. Poleg tega se lahko semantika aplikacije razlikuje glede na vrednost

Kjer so elementi GUI implementirani s psevdografiko) z miško ali zaslonom na dotik.

Metoda se izvaja z "zajemom" (s pritiskom in držanjem glavnega ( prvi, pogosteje levi) gumb miške) predmeta, prikazanega na računalniškem zaslonu, programsko na voljo za takšno operacijo in ga premakne na drugo mesto (za spremembo njegove lokacije) ali "vrže" na drug element (za pokliče ustrezen dejanje, ki ga zagotavlja program). V zvezi z okni (ki se lahko premikajo tudi na ta način) se ta izraz običajno ne uporablja.

Osnovna dejanja in največ preprosti primeri dejanja povleci in spusti so: premikanje predmeta, premikanje predmeta s plošče na ploščo, čeprav v modernem operacijski sistemi ah povleci in spusti se pogosto uporablja in je eden od glavnih načinov interakcije z računalnikom v grafičnem uporabniškem vmesniku.

Objekti za premikanje so lahko naslednji elementi vmesnika: ikone na namizju (ikone), plavajoče orodne vrstice, programske bližnjice v opravilni vrstici (od Win XP), elementi TreeView, besedilni niz, celica DataGridView in elementi OLE. Predmete je mogoče premikati znotraj določenega območja, znotraj enega okna, med ploščami enega okna in med različnimi okni.

Dogodek vlečenja mora sprožiti neko dejanje uporabnika. Najpogosteje je to dejanje klik z levim gumbom miške na element (ta dogodek se imenuje MouseDown), ki ga je mogoče premakniti v njegovem vsebniku. Nekatere komponente imajo lastne začetne dogodke povleci in spusti – na primer, TreeView ima dogodek ItemDrag.

Fundacija Wikimedia. 2010.

Poglejte, kaj je "povleci in spusti" v drugih slovarjih:

Povleci in spusti- 〈[dræg ənd drɔ̣p] n .; ; unz .; EDV〉 das Anklicken eines Objektes, das auf dem Computerbildschirm (in eine andere Datei bzw. an eine andere Stelle) verschoben u. dort wieder losgelassen wird [angl. povlecite „ziehen“ + in „und“ + spustite „fallen…… Universal-Lexikon

Oblika izvajanja kakršnih koli dejanj v grafičnih uporabniških vmesnikih, ki pomenijo uporabo Računalniška miška... Prevedeno iz angleščine dobesedno pomeni: povleci in spusti. Dejanje se izvede z upravljanjem s tistimi, ki so vidni na zaslonu ... ... Poslovni slovarček

povleci in spusti- (računalništvo) Za premikanje ikone, datoteke itd. po zaslonu z miško in jo spustite na drugem mestu (povleci in spusti pridevnik) Glavni vnos: povleci… Uporaben angleški slovar

povleci in spusti- IT za premikanje nečesa z enega področja računalniškega zaslona na drugega z miško: "Programska oprema vam omogoča, da povlečete in spustite elemente za slike strani, besedilo itd. kjerkoli želiš. Glavni vnos: povlecite ... Finančni in poslovni pogoji

povleci in spusti- UK US glagol n .; Gen.:; Pl .: unz .; EDV〉 das Anklicken eines Objektes, das auf dem Computerbildschirm (in eine andere Datei bzw. an eine andere Stelle) verschoben u. dort wieder losgelassen wird)