Schematy kolorystyczne oraz czcionka

Interfejs aplikacji POS został stworzony w taki sposób, aby zapewnić spójność wyglądu wszystkich widoków oraz łatwość zarządzania. Dlatego zdefiniowano nazwy kolorów, którymi można się posługiwać tworząc i/lub modyfikując widok.

Zdefiniowane nazwy kolorów można podzielić na dwie grupy. Kolory zarządzalne bezpośrednio przez użytkownika w interfejsie POS oraz kolory zarządzalne pośrednio, niemożliwe do bezpośredniej zmiany przez użytkownika, tylko ustawiane automatycznie na podstawie kolorów zarządzalnych bezpośrednio.

Kolory zarządzalne bezpośrednio

• ThemeColor – kolor bazowy motywu (kolor podstawowy), używany jako:
  • kolor tekstu w widokach podstawowych i modalnych,
  • kolor tła w widoku komunikatu,
  • kolor tła przycisków w widoku komunikatu,
  • kolor tła przycisku Szukaj/Dodaj np. na liście dokumentów handlowych, paragonie, produktach,
  • kolor tła zaznaczonej pozycji w kontrolce ComboBox,
  • kolor tła notyfikacji,
  • kolor wybranego/zaznaczonego radiobuttona oraz checkboxa
• ThemeBackground – kolor bazowy motywu, używany jako:
  • kolor tła widoku podstawowego i modalnego,
  • kolor tekstu i ikon wektorowych przycisków (poza menu bocznym),
  • kolor tekstu i ikon wektorowych w widoku komunikatu,
  • kolor tekstu i obramowania przycisków w widoku komunikatu,
  • kolor testu przycisku Szukaj/Dodaj,
  • kolor tekstu i ikony wektorowej notyfikacji,
  • kolor tekstu wybranego/zaznaczonego radiobuttona oraz checkboxa

Kolory zarządzalne pośrednio

• ThemeColor2 – kolor podstawowy (ThemeColor) z przeźroczystością 85%, używany jako:
  • kolor nagłówka list (DataGrid)
• ThemeColor3 – kolor podstawowy (ThemeColor) z przeźroczystością 25%, używany jako:
  • kolor zaznaczenia pozycji na liście
• ThemeColor4 – kolor podstawowy (ThemeColor) z przeźroczystością 65%, używany jako:
  • kolor zaznaczenia wiersza na liście najechanego kursorem myszki,
  • kolor zaznaczenia obrysu przycisku składającego się z samej ikony wektorowej (HeaderButton) po najechaniu na niego kursorem myszki,
  • kolor zaznaczenia w menu bocznym po najechaniu na pozycję kursorem myszki
• HintColor – kolor podpowiedzi dla kontrolki TextBox
• Background – kolor stały z określoną przeźroczystością – #1ADFE5E5, używany jako:
  • kolor tła listy

Użycie kolorów w kodzie

W dowolnym fragmencie kodu xaml, kolorów używamy poprzez polecenie DynamicResource, przykładowo:

<TextBox Foreground="{DynamicResource ThemeColor}" />

W większości przypadków powyższy przykład nie ma racji bytu, z uwagi na predefiniowane ustawienia, które zwalniają nas z konieczności takiej dodatkowej konfiguracji dla właściwości Foreground.

Krój czcionki również został zdefiniowany dla całej aplikacji i jest zarządzalny z poziomu interfejsu użytkownika POS. Dla większości kontrolek nie trzeba go dodatkowo ustawiać. Wyjątkiem może być np. definicja kolumn listy, gdzie należy pamiętać o ustawieniu kroju czcionki w następujący sposób:

<DataGridTextColumn FontFamily="{DynamicResource FontFamily}" />