Hogyan: másoljon vágólapra az interneten
Mivel sok kód útmutatót és cikkrészletet fogok írni erről a progresszív webalkalmazásról, elengedhetetlen, hogy a következő feladatokat lefedjük, amelyekre a felhasználónak szüksége lesz:
- a kód nagy olvashatósága
- egyszerű és egyértelmű művelet a beágyazott kód másolásához
Ez az alsó sor, amelyre szükség van a hasznos kódpéldákhoz. De javíthatok rajta?
Az elkötelezettség javítása
Az alkalmazásom másolása a vágólapra funkcióinak szintjének növelése érdekében arra gondoltam, hogyan lehetne szórakoztatóbbá tenni a másolás gombra való kattintást, mivel a kellemes felhasználói élmény (UX) kellemes mellékhatással jár, ha felfelé hajtja az elkötelezettséget.
A következőket találtam ki: mi van, ha az alkalmazás csevegésszerűen "válaszol", valahányszor a felhasználó a vágólapra másol? Az élmény azonnal személyesebb lenne. A beképzelt és pergő nyelv használatával a megadott üzenetek is egyedi karakterrel rendelkeznek.
Vessünk egy pillantást a végeredményre:
I'm a code example, sort of.
Click on the button in the bottom right corner to copy.
Mint látható, a hierarchia önmagában fentről lefelé van:
- Natív ablak utánzása ablakvezérlőkkel
- tartalom
- műveletek (íráskor csak a vágólapra másolás)
Az implementáció
Amikor a felhasználó átmásolja a kódot a vágólapra, véletlenszerű választás jelenik meg egy előre meghatározott tömb tömbből rövid időre. A véletlenszerű választás minden kódpéldához generálódik. A bonyolultság csökkentése érdekében nem garantált, hogy a szöveg egyedi legyen a cikk terjedelmében. Mégis b / c elég sok húr közül lehet választani, az ütközéseknek kis a valószínűsége.
És kb ennyi! Remélem, tetszik ez a kis UX fejlesztés a másolás a vágólapra műveletekhez, talán ez inspirálta Önt az UX változásokra a saját alkalmazásában is!
- Tom
