Inkwell Элементы управления — флажок, переключатель и ползунок

Элементы 24px с тем же контуром тушью, что и панели, и тем же жёстким терминатором на лице. Отмеченное состояние заливается акцентом и сохраняет ту же толщину контура, потому что на светлом фоне состояние, рассказанное только оттенком, исчезает на печатном скриншоте, — а этот стиль сделан выглядеть напечатанным.

Набор покрывает четыре элемента, которые экрану настроек действительно нужны: флажок, радиокнопка, переключатель и ползунок с отдельной рукояткой. Каждый элемент с состояниями несёт оба состояния в собственном файле, на базе 24×24 — переключатель 48×24, а дорожка ползунка шириной 192 px, чтобы её можно было нарезать nine-slice на любую длину.

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

Ползунок поставляется дорожкой и рукояткой, а не одним спрайтом. Анимировать цельный ползунок значит перерисовывать его на каждое значение; с двумя частями вы растягиваете заливку и двигаете рукоятку — ровно то, чего любой UI-тулкит и так ждёт. У рукоятки есть центральная насечка, чтобы её поворот и положение оставались читаемыми в малых размерах.

Всё включено как редактируемый SVG и как плоский прозрачный PNG в 1x, 2x и 4x, нарисованное теми же шестью тонами плоский плакат, что и остальное семейство Inkwell.

Creative Commons «С указанием авторства» 4.0 — Бесплатно для коммерческого использования. Указание авторства обязательно. Полные условия · Что это значит на практике