WTW - Style
Z K2T
Spis treści |
Informacje wstępne
Styl (okna) rozmowy ('chatTheme.html') - instalacja
W głównym oknie programu z menu 'WTW' należy wybrać 'Otwórz lokalizację profilu', następnie utworzyć tam folder 'userTheme', a w nim 'htmlChat', który jest odpowiedzialny za przechowywanie stylu okna rozmowy. Gotowe style okna rozmowy znajdziesz na forum Wygląd, style, i podobne.
Styl (okna) rozmowy ('chatTheme.html') - zmienne
Zmienne, które można w tym pliku wykorzystać:
-
%time%- Godzina (HH:MM:SS);-
%time(format)%- format: cokolwiek co przejdzie przez funkcję strftime, z jedną małą różnicą: zamiast % używamy $;
-
-
%date%- Data (DD/MM/YYYY); -
%datetime%- Godzina oraz, jeśli wiadomość pochodzi z innego dnia niż obecny, także data; -
%text%- Tekst wiadomości; -
%name%- Nazwa kontaktu (lub nasza); -
%id%- ID kontaktu (bez ID sieci); -
%path%- Ścieżka do folderu stylu; -
%avatar%- Ścieżka do pliku avatara (prawidłowe tylko dla "rozmów"); -
%net%- identyfikator sieci kontaktu, prawidłowe tylko dla wypowiedzi odbieranych (oraz nagłówka i stopki); -
%group%- grupa w której kontakt jest, prawidłowe tylko dla wypowiedzi odbieranych (oraz nagłówka i stopki); -
%groupColor%- kolor grupy w której jest kontakt lub jeśli grupa nie ma swojego koloru "transparent";
Styl okna głównego ('contactListTheme.xml') oraz okna zmiany opisu ('statusSwitchTheme.xml')
Edycja plików contactListTheme.xml (styl listy kontaktów) oraz statusSwitchTheme.xml (styl zmieniarki statusów) jest dość analogiczna i prosta.
Ogólnie mamy 2 typy zmiennych kolorów tzn RGB (standardowe w formacie RRGGBB) oraz ARGB (w formacie AARRGGBB) gdzie:
- AA - kanał alpha - przezroczystość dla FF (biały) 0% przeźroczystości (widzimy wszystko) dla 00 (czarny) 100% przeźroczystości (nie widzimy), oczywiście możliwe są mieszane barwy szarości typu np B3 ileś tam % przeźroczystości - działa tak samo jak maski np w photoshopie ;)
- RR - kanał red - czerwony
- GG - analogicznie zielony
- BB - analogicznie niebieski
Jeśli zmienne w plikach zakańczane są przez START i END oznacza to ze dane tło jest gradientem tych 2 kolorów.
Zmienne w plikach - ogólne:
- crBack - tło listy kontaktów podawane
- crBackStart - tło zmieniarki początkowe
- crBackEnd - tło zmieniarki końcowe
- crTextBorder - kolor obramowania ramki do której wpisujemy status
- crAvaBorder - kolor obramowania awatara
<color type="crBack" value="dbfaaa"/>
Szczegółowe "bloki" skinowane są w grupach i tak:
- group - kolorystyka bloku grup
- contact - kolorystyka zaznaczenia kontaktu
- meta - kolorystyka zaznaczenia metakontaktu
- dropDown - kolorystyka elementu gdzie jest nasza ikonka statusu
- expander - kolorystyka elementu gdzie jest nasz nick + aktualny opis
- main - kolorystyka rozwiniętej ramki ze zmianą statusu
<colorset type="dropDown"></colorset>
I teraz tak każdy z tych "bloków" ma kilka typów i zmiennych:
- normal - standardowy wyswietlany
- selected - zaznaczony
- hover - po najechaniu myszka (wystepuje tylko w zmieniarce)
- vertical - vertical="1" (gradient pionowy); vertical="0" (gradient poziomy) - dzieki silverlight
- rounding - zaokraglanie belek - dla 0 prostokat, dla np 6 prostokat z zaokraglonymi rogami
- pen - grubosc obramowania danego elementu
<group type="normal" vertical="1" rounding="6" pen="1.5">
Zmienne w typach
- start - kolor początkowy np zaznaczenia kontaktu/belki grupy/ belki zmiany statusu itd
- end - kolor końcowy np zaznaczenia kontaktu/belki grupy/ belki zmiany statusu itd
- border - kolor obramowania tego elementu
- text - kolor tekstu
- description - kolor np opisu kontaktu
<color type="start" value="B3668B0F"/>
Przykład podsumowujący
<colorset type="dropDown"> <group type="selected" vertical="1" rounding="6" pen="1.5"> <color type="start" value="FF668B0F"/> <!-- ARGB --> <color type="end" value="FF506C0C"/> <color type="border" value="FF82B210"/> <color type="text" value="000000"/> <!-- RGB --> </group> </colorset>Ten fragment kodu dotyczy elementu 'dropDown', który ma typ 'selected'. Zmienne kolorystyczne będą zatem dotyczyły elementu gdzie jest nasza ikonka statusu w zmieniarce statusu tylko wtedy kiedy będzie ona zaznaczona/kliknięta :)
