Paczki interfejsu

Byte Sloty ekwipunku — siatka 56px

13 pól ekwipunku jasny piksel 56×56: puste, najechane, wybrane, zablokowane, odrzucone, cel; okrągłe i sześciokątne pole wyposażenia, hotbar, trzy ramki rzadkości.

  • ui
  • svg
  • przezroczysty png
  • ekwipunek
  • slot ekwipunku
  • ramka przedmiotu
  • rzadkość
  • siatka
  • pixel art
  • jasny interfejs
  • łamigłówka
  • zarządzanie
Rząd kwadratowych slotów ekwipunku na tle szachownicy pokazujący stany pusty, hover, wybrany ze znacznikami w narożnikach i zablokowany z ukośnym kreskowaniem, a dalej kolorowe ramki rzadkości i siatka ośmiu slotów
podgląd 1600×629przezroczystość pokazana jako szachownica

O tej paczce

Sloty ekwipunku 56px, najmniejsze w katalogu. Gra zarządcza pokazuje ich czterdzieści naraz i siatka liczy się bardziej niż pojedyncza komórka; stan zablokowany używa schodkowego kreskowania zamiast kłódki, żeby pozostać czytelnym przy tej gęstości.

Siatka ekwipunku nie potrzebuje panelu, tylko kwadratu, który się kafelkuje. Każde pole ma tu 56×56 przy tych samych wymiarach zewnętrznych — jedynym wyjątkiem jest dwukomórkowe pole na duże przedmioty, 112×56, które jest osobnym plikiem, a nie rozciągniętym kwadratem, bo rozciąganie pola bez nine-slice deformuje jego narożniki. Rozstaw je co 60 px, a krawędzie przeczytają się jako jedna siatka zamiast rzędu osobnych pudełek.

Stany są rysowane strukturą, a nie kolorem. Pole wybrane dostaje znaczniki narożne, zablokowane ukośne kreskowanie, najechane podnosi krawędź o stopień, odrzucone niesie krzyżyk, a cel upuszczenia przerywaną ramkę akcentu. To celowe: ekran ekwipunku jest w większości gier najbardziej hałaśliwą powierzchnią, leży pod grafiką przedmiotów we wszystkich odcieniach naraz, a stan będący jedynie kolorem obramowania znika w chwili, gdy w polu leży czerwony miecz.

Odrzucone i zablokowane to celowo osobne sprite’y. Zablokowane pole można otworzyć później; odrzucone odmawia przedmiotu trzymanego na kursorze. Narysowanie ich tak samo to sposób, w jaki ekwipunek uczy gracza złej zasady. Pola wyposażenia łamią kwadrat z tego samego powodu: gniazdo akcesorium jest okrągłe, a gniazdo klejnotu sześciokątne, więc kształt mówi, co tam pasuje, zanim odezwie się jakikolwiek dymek.

Trzy ramki rzadkości wykorzystują kolory życia, many i wytrzymałości z reszty rodziny, każda ze znacznikiem w narożniku obok kolorowego obramowania — więc ktoś sortujący po rzadkości czyta dwa sygnały i żaden z nich nie rywalizuje z grafiką przedmiotu na środku slotu.

Wszystko dołączone jako edytowalny SVG i jako płaski przezroczysty PNG w 1x, 2x i 4x. Wnętrza slotów są przezroczyste, więc to, co wyrenderujesz za siatką, prześwituje zamiast wypalonego koloru tła.

Pobieranie

Bezpośredni link · bez rejestracji · bez strony oczekiwania
Pobierz ZIP34 kB

Komplet — źródła SVG, eksporty PNG w 1x/2x/4x, licencja i readme

Pliki zawarte w tej paczce
PlikFormatWagaPobieranie
Komplet — źródła SVG, eksporty PNG w 1x/2x/4x, licencja i readmeZIP34 kB Pobierz →
Pusty slot, edytowalny SVGSVG990 B Pobierz →
Wybrany slot ze znacznikami w narożnikach, edytowalny SVGSVG1.4 kB Pobierz →

Jak używać

  1. Rozłóż sloty ze skokiem 60 px — sprite 56 px plus 4 px odstępu — a obramowania zostaną w odległości jednego piksela zamiast się podwoić.
  2. Rysuj ikonę przedmiotu wyśrodkowaną w slocie przy około 39 px; wnęka wewnętrzna ma 50 px, więc cokolwiek większego dotknie krawędzi i zje ramkę.
  3. Podmieniaj cały sprite slotu dla stanów wybrany i zablokowany zamiast nakładać barwę, bo znaczniki w narożnikach i kreskowanie są częścią sprite'a.
  4. Ramki rzadkości zastępują pusty slot jeden do jednego — te same granice, ta sama wnęka — więc zmiana rzadkości to jedna podmiana tekstury bez ruszania układu.

Licencja

Creative Commons Uznanie autorstwa 4.0 — Za darmo do użytku komercyjnego. Uznanie autorstwa obowiązkowe. Pełne warunki · Co to znaczy w praktyce

Linijka uznania do skopiowania
"Byte Sloty ekwipunku — siatka 56px" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/byte-inventory-slots