Підтримка › Як створювати/редагувати скіни та кольорові теми програми


AllMyNotes Organizer - Скіни та теми

Любите скіни? Створіть власний!!!

Якщо у вас є хоча б базові художні навички, ви можете створювати скіни/теми для AllMyNotes Organizer. Нижче описано, як це робити. Щоб заохотити створення нових скінів, ми навіть пропонуємо ліцензію Deluxe Edition для AllMyNotes Organizer за двох умов:

1. Скін, тема або навіть невеликий її елемент має виглядати достатньо добре, щоб ми могли поширювати його разом із програмою, опублікувати на нашому вебсайті або принаймні використати окремі вдалі елементи в інших скінах;

2. Надайте нам вихідний файл графіки (файл .psd). Він потрібен, оскільки ми регулярно додаємо графічні елементи та нові піктограми. Без цього файла ми не зможемо надалі підтримувати скін.


--- Як створювати скіни для AllMyNotes Organizer (чернетка посібника) ---


Файли скінів розташовані в c:\Program Files\AllMyNotes Organizer\Skins older. Наразі там є два скіни - Holy Crown і Deep. Кожен розміщено в окремій папці.


Кожна папка містить два файли:

1. SkinInfo.ini - містить усі кольори та параметри скіну.

2. Файл .png із графічними елементами скіну. Координати елементів керування на цьому растровому зображенні зберігаються в SkinInfo.ini


Щоб створити новий скін:


1. Скопіюйте один із наявних скінів до іншої папки

2. У скопійованому файлі змініть назву скіну в SkinInfo.ini - див. параметр FileDescription. Бажано, щоб назва папки та назва скіну збігалися. Власне, це все: далі можна змінювати кольори, редагувати растрове зображення тощо.


Інші поради:

1. Зазвичай ми створюємо скіни в PhotoShop у форматі .psd. Це дає змогу застосовувати потужні ефекти, ефекти шарів і прозорість. Після завершення редагування растрового зображення скіну ми експортуємо дані до .png-файла скіну. Працювати виключно з .png-файлами наполегливо не рекомендується: це виснажливо для дизайнера й ускладнює подальше розширення.

2. Якщо вам потрібні ресурси, сміливо звертайтеся до Vladonai Software. Ми можемо надати графіку, яку вже використовували для скінів, а також додаткові поради з нашого досвіду.


Вміст растрового зображення та SkinInfo.ini досить зрозумілий сам по собі, назви параметрів підібрані вдало, а на зображенні ми додали підписи, щоб спростити створення нових скінів. Якщо вам потрібне пояснення значення піктограм на панелях інструментів, у меню, кнопках або дереві, будь ласка, зв'яжіться з нами - ми охоче надамо подробиці та інші ресурси.


P.S. Ось короткий наочний приклад того, як координати зображення відображаються у файлі SkinInfo.ini:

Приклад редагування скіну AllMyNotes Organizer

Будова файлу SkinInfo.ini

SkinInfo.ini - це звичайний текстовий файл із рядками формату Name=Value, згрупованими за розділами: інформація про оформлення, колірні теми, кольори, текстовий редактор, розміри, шрифти та карта растрового зображення (усі записи SB_*). Рядки, що починаються з ** або //, є коментарями - зручне місце, щоб зберегти старе значення замість його видалення. Кольори можна задавати у форматі #RRGGBB (просто скопіюйте з Photoshop) або R,G,B - #FFFFFF і 255,255,255 означають той самий білий колір.

ProjectSignature=AllMyNotes Project RequiredAppBuildNumber=110 FileDescription=Holy Crown (Default) ** a comment line WindowBackgroundColor=#DAE1F0 InactiveFontColor=170,170,170

Не змінюйте ProjectSignature і RequiredAppBuildNumber: вони повідомляють програмі, що це оформлення для AllMyNotes, і визначають потрібну збірку. Змінюйте FileDescription - саме ця назва оформлення відображається в меню.


Колірні теми: одне оформлення, двадцять настроїв

Оформлення не обмежується одним виглядом. Кожен рядок ThemeEffects_N - це своєрідний рецепт: під час завантаження теми програма бере растрове зображення оформлення та послідовно застосовує до нього ланцюжок фільтрів зліва направо, перш ніж щось намалювати на екрані. Файл .png на диску при цьому не змінюється. Саме так Holy Crown пропонує теми Sepia, Gold, Coffee, Blueprint і Night Vision на основі одного зображення - одна картинка, жодного додаткового малювання, а Photoshop навіть не здогадувався.

ThemeEffects_Default=AUTOLEVELS ThemeEffects_1="Holy Crown - Memories (theme of Version 1)" ThemeEffects_2="Holy Crown - Crisp"|SCALELUMA:250,950 ThemeEffects_3="Holy Crown - Sepia"|SEPIA|ADJUSTLEVELS:0,255,150,110 ThemeEffects_7="Holy Crown - Gold"|REPLACECOLOR:#d8dfef,#FCC200,27|SCALELUMA:300,980 ThemeEffects_10="Holy Crown - Night Vision Glow"|INVERTBRIGHTNESS|SCALELUMA:0,500

Формат такий: назва теми в подвійних лапках, а далі ефекти, розділені символом |. ThemeEffects_Default (без назви) застосовується до самого оформлення. Нумеруйте теми 1, 2, 3... без пропусків - програма читає їх до першого відсутнього номера, тому тема після пропуску просто ігнорується без попередження. Рядки ThemeEffectsM3_N працюють так само й потребують AllMyNotes 3 або новішої версії. Колірні теми доступні у редакції Deluxe.

Від білого до чорного одним рядком

Хочете зробити темну версію світлого оформлення? Не потрібно перемальовувати жодного пікселя. INVERTBRIGHTNESS перетворює світле на темне, але зберігає відтінки: синій залишається синім, просто переходить у нічну зміну. Звичайний INVERT перетворив би ваші сині кольори ще й на помаранчеві - хвилинку весело, а потім очі почнуть скаржитися. Додайте SCALELUMA, щоб результат не став зовсім чорним, і трохи GRAYSCALE, щоб приглушити кольори, які раптом починають світитися в темряві:

ThemeEffects_21="My Skin - Midnight"|INVERTBRIGHTNESS|SCALELUMA:60,800|GRAYSCALE30

Власні теми Holy Crown "Night Vision Glow" і "Night Vision Gray" створено саме так. Не забудьте про кольори тексту: фільтри змінюють растрове зображення, а кольори в розділі Кольори залишаються такими, як задано. Темно-сірий FontColor на тепер уже темному тлі - напрочуд елегантний спосіб приховати власні нотатки від самого себе.

Ефекти, які можна поєднувати

ЕфектЩо він робить
AUTOLEVELSРозтягує діапазон яскравості до повних 0-255. Така собі кнопка «зробити зображення менш бляклим».
GRAYSCALEПрибирає кольори; GRAYSCALE40 зменшує їхню насиченість лише на 40%. Миттєвий перехід у режим серйозної роботи.
SEPIAВідтінки старих фотографій. Ваші вчорашні нотатки раптом виглядають так, ніби їх написали в 1890 році.
INVERT, INVERTBRIGHTNESSINVERT інвертує всі кольори (як на фотонегативі), а INVERTBRIGHTNESS міняє місцями лише світле й темне - саме те, що потрібно для темних тем.
BLUEPRINTLIGHT, BLUEPRINTDARKBLUEPRINTLIGHT / BLUEPRINTDARK - вигляд інженерного креслення. Нотатки, за якими хоч міст будуй.
ADJUSTLEVELSADJUSTLEVELS:min,max,midSrc,midDst (0-255) - змінює середні тони: 0,255,150,110 робить їх темнішими, 0,255,150,190 - світлішими.
BRIGHTNESSCONTRASTBRIGHTNESSCONTRAST:b,c (-255..255, 0 = без змін). Робить саме те, що обіцяє назва.
HUESATURATIONLIGHTNESSHUESATURATIONLIGHTNESS:h,s,l - зсув відтінку від -360..360, насиченість і світлість у відсотках. Поверніть відтінок на 180, і все оформлення переміститься на протилежний бік колірного кола.
REPLACECOLORREPLACECOLOR:#from,#to,fuzziness - замінює один колір іншим; параметр допуску 0..180 визначає, наскільки кольори можуть бути «схожими». Теми Gold, Coffee, Pink і Sea в Holy Crown використовують той самий прийом, тільки з різними значеннями #to.
SCALELUMASCALELUMA:min,max (0-1000) - стискає яскравість до заданого діапазону: 250,950 = чіткіше зображення, 0,500 = усе щонайбільше наполовину яскраве, ідеальний вибір для нічних сов.
SCALESATURATIONSCALESATURATION:min,max (0-1000) - те саме для насиченості: підвищте мінімальне значення, і бліді кольори стануть виразнішими.

Основні елементи та що станеться, якщо їх змінити

Кілька параметрів із Holy Crown, за що вони відповідають і чого очікувати після їх зміни:

ПараметрЩо змінюється (і побічні ефекти)
WindowBackgroundColor=#DAE1F0Тло позаду всіх панелей. Змініть його, і вся програма набуде іншого настрою, наче кімната з новими шпалерами.
FontColor=#636363Основний колір тексту. Задайте його таким самим, як ViewBackgroundColor, і ви винайдете невидиме чорнило - чудово для секретів, але не дуже для продуктивності.
MenuFontColor=#6080BD
MenuSelectionColor=#a9beef
MenuBackgroundColor=#FAFAFA
Текст меню, смуга вибору під вказівником миші та тло меню. Зробіть виділення яскравим, і кожен похід у меню перетвориться на маленьку дискотеку.
TextEditorSelectionColor=#f6d595
TextEditorInactiveSelectionColor=#f8ebd3
Колір виділення тексту, який ви позначаєте мишею в нотатці (неактивний варіант використовується, коли редактор не має фокуса). Виберіть темний колір, і виділений текст стане нечитабельним саме тоді, коли ви захочете його скопіювати.
TreeOutlineColorHighlighted=#D0BF91Заокруглена рамка навколо вибраної папки в дереві. Ненав'язлива позначка «ви тут».
DistBetweenControls=4
DistBetweenCtlAndBorder=5
Відступи між панелями та від панелей до краю вікна, у пікселях. При 4 усе затишно поруч; при 40 панелі роз'їжджаються, наче континенти.
FontNormalName=Amelian.TTF
FontMenuName=segoepr.ttf
FontEditName=TENAHB48.TTF
FontWndTitleName=Orbitbn.ttf
FontWndTitleBolded=TRUE
FontHintName=Amelian.TTF
Оформлення може мати власні шрифти для п'яти елементів: звичайного тексту інтерфейсу (FontNormal), меню (FontMenu), редактора нотаток (FontEdit), заголовків вікон (FontWndTitle, разом із FontWndTitleBolded=TRUE) і підказок (FontHint). Якщо цих параметрів немає, використовується системний шрифт. Файл .ttf береться з папки оформлення або з папки Fonts у Windows (саме звідти походить Segoe Print, segoepr.ttf). Segoe Print у меню виглядає чарівно рівно один день; Orbitbn.ttf у заголовку вікна трохи довше створює враження пульта керування космічним кораблем. Параметри ...Size усе ще працюють, але тепер розмір тексту значно простіше змінити в налаштуваннях самої програми - тож нехай оформлення вибирає шрифт, а користувач визначає розмір.
SkinBitmap=HolyCrown.png
SB_Button_NormalCoord=69,108
SB_Button_LeftPieceWidth=10
SB_ScrollBarWidth=16
Усе з префіксом SB_ посилається на частини зображення .png: Coord задає координати x,y верхнього лівого пікселя елемента, а значення ширини LeftPiece / Fill / RightPiece визначають, як його розрізати - крайні частини малюються без змін, а центральна розтягується. Змініть тут розмір, не пересунувши пікселі у файлі .png, і програма розріже зображення не там, де потрібно - ваше оформлення вступить у період Пікассо.

Як швидко побачити свої зміни в програмі

AllMyNotes читає SkinInfo.ini та файл .png лише у двох випадках: під час запуску та коли ви вибираєте оформлення або тему в меню Оформлення. Саме по собі збереження файлу нічого не змінює. Але перезапускати програму після кожного налаштування не потрібно:

1. Відредагуйте SkinInfo.ini (або експортуйте .png) і збережіть файл.

2. У меню Оформлення виберіть будь-яке інше оформлення або тему, а потім знову своє. Під час кожного вибору програма повторно читає файли з диска, тому після другого клацання ви побачите свої зміни - приблизно секунда на весь процес.

Якщо вибрати оформлення, яке вже позначено галочкою, нічого не станеться - програма ввічливо вирішить, що змінювати нічого. Завжди спочатку перемикайтеся на інше, а потім повертайтеся.

Список оформлень у меню формується один раз за сеанс. Тому після додавання нової папки оформлення або перейменування оформлення (FileDescription) чи теми один раз перезапустіть AllMyNotes, щоб побачити нову назву. А якщо ваше оформлення раптом виглядає точнісінько як Holy Crown, значить програма не змогла завантажити ваш файл і повернулася до стандартного оформлення - перевірте останній змінений рядок.

Порада: папка Skins розташована в Program Files, тому Windows може заборонити збереження файлів у ній. Запустіть редактор від імені адміністратора або використовуйте портативну версію, де оформлення зберігаються у звичайній папці.


Примітка: у редакції Lite доступно лише 2 скіни, тоді як у Deluxe є більше тем.


Приємної роботи! :-)