Wygląd atrybutów w formularzu MODERN

Facebooktwitterpinterestlinkedinmail
Dotyczy wersji 2020.1.x; autor: Mateusz Klos

 

Atrybuty nie posiadają jednego konkretnego sposobu wyświetlania. WEBCON BPS Designer Studio pozwala na konfigurowanie ich wyglądu tak, by mogły być bardziej przejrzyste i czytelne, a także dostosowane do preferencji użytkowników. Poniżej znajduje się kilka sposobów zarządzania wyglądem atrybutów.

Grupy

Użytkownik w WEBCON BPS Designer Studio ma możliwość grupowania atrybutów, a konfigurując jej wygląd może zarządzać następującymi właściwościami:

  • Pierwsze pole pozwala wybrać, czy nazwa grupy będzie nad nią wyświetlana czy nie. W drugim przypadku grupa oddzielona będzie od reszty atrybutów poziomą linią ciągłą.

Rys.1 Konfiguracja wyglądu grupy

 

  • Gdy użytkownik zdecyduje ustawić nazwę jako widoczną, opcja „Wysokość nagłówka grupy” pozwoli wybrać odległość tekstu (w pikselach) od linii oddzielającej go od atrybutów znajdujących się wewnątrz.
  • W sekcji „Podatrybuty”, za pomocą strzałek możliwość zmiany pozycji wyświetlania elementów w grupie.
  • Zaznaczenie checkboxa u dołu okna spowoduje, że atrybuty będą wyświetlały się w orientacji poziomej. Opcja działa dla maksymalnie trzech atrybutów. Gdy więcej – będą wyświetlane tradycyjnie.

Rys. 2 Układ poziomy atrybutów w grupie

 

Wiele wierszy tekstu

Użytkownik BPS Studio, zarządzając polem „wiele wierszy tekstu”, po kliknięciu „Konfiguracja zaawansowana” otrzymuje szereg opcji zarządzania wyglądem atrybutu:

  • Pierwszym z nich jest wybór liczby wierszy, jaką dany atrybut ma wyświetlać na formularzu (maksimum możliwych znaków do wpisania nie zmienia się).
  • Kolejno pojawia się wybór między typem edytora – standardowym i formatowanym. Zaznaczenie pierwszego pozwala na operowanie zwykłym tekstem, natomiast po wybraniu edytora formatowanego, uaktywnia się zakładka „Zaawansowane”, gdzie pojawia się możliwość dostosowania układu formatowania tekstu. Użytkownik może wybrać, które z opcji mają być wyświetlane. Dostępne są tutaj także trzy predefiniowane zestawy narzędzi, różniące się liczbą wybranych rodzajów formatowania.

Rys. 3 Konfiguracja formatowanego typu edytora

 

  • Poniżej w zakładce Standard znajduje się checkbox „Tryb dopisywania”, którego zaznaczenie umożliwia dodawanie wiadomości poniżej pola tekstowego, z datą zapisu oraz autorem komentarza. Tak dodane wpisy nie mogą być później edytowane.
  • Ostatnią opcją do wyboru jest położenie pozycji nazwy pola tekstowego, gdzie użytkownik może wybrać, czy nazwa znajduje się obok (domyślne ustawienie), czy powyżej pola. Poniżej porównanie tych dwóch właściwości:

Rys.4 Nazwa obok pola tekstowego

 

Rys. 5 Nazwa powyżej pola tekstowego

 

 

W załączonych przykładach widać, że wybranie opcji „powyżej” pozwala wyświetlić więcej tekstu w jednej linii.

Wiersz danych

W „Konfiguracji zaawansowanej” tego atrybutu, użytkownik zarządza sposobem wyświetlania poszczególnych kolumn. Obok nagłówka „Nazwa wyświetlana” pojawiają się nowe opcje do zaznaczenia:

  • pole lampka – przedstawia wartość liczbową w postaci ikony o różnych kolorach:
    • wartość mniejsza lub równa 0 – czerwona,
    • wartość równa 1 – żółta,
    • wartość większa niż 1 – zielona.
  • pole procentowe – wartość liczbowa przedstawiona zostanie jako pasek postępu w trybie procentowym, stąd zaznaczenie tego pola jest zalecane w przypadku, gdy operuje się na liczbach od 0 do 100,
  • pole pogrubione – wartość wyświetlana jest pogrubioną czcionką,
  • pokaż kolumnę – użytkownik decyduje, czy kolumna ma zostać wyświetlana,
  • link do elementu – po kliknięciu na dany element wyświetla się okno podglądu z odnośnikiem. Dla tak zaznaczonych pól należy określić, która z wartości jest ID podlinkowanego elementu. Służy do tego menu dostępne po kliknięciu w ikonkę z trzema kropkami z prawej strony.

U dołu znajdują się dwa checkboxy odpowiadające kolejno za wyświetlanie nazw kolumn oraz umożliwianie pustych tagów w źródle danych. Drugie pole, gdy zaznaczone, spowoduje zezwalanie na użycie zmiennych zwracających pustą wartość. Kiedy opcja jest odznaczona, a tag użyty w zapytaniu zwróci pustą wartość, rekordy nie zostaną wyświetlone.

Rys. 6 Konfiguracja zaawansowana atrybutu „wiersz danych”

 

Atrybuty ankietowe – ocena w skali

Konfiguracja pola oceny dzieli się na trzy części:

  • Pytanie – tutaj użytkownik w polu „Treść” wpisuje komentarz lub pytanie pojawiające się przy wyborze oceny. Następnie wybiera, czy pytanie ma się pojawiać z boku, czy powyżej wyboru ocen. Widnieje tutaj także wartość „nie pokazuj”, po której wybraniu tekst nie będzie się wyświetlał.
  • Wartość skali – pola „Minimalna” i „Maksymalna” służą ustawieniu zakresu skali oceny (od 0 do 10).
  • Opis skali przy wartościach – należy uzupełnić tekstem, który będzie się wyświetlał przy minimalnej i maksymalnej wartości

Dla danej konfiguracji, atrybut będzie wyglądał następująco:

Rys. 7 Konfiguracja zaawansowana atrybutu “Ocena w skali”

 

Rys. 8 Widok atrybutu w portalu

 

Atrybuty ankietowe – wybór odpowiedzi

Atrybut ten pozwala na wybranie jednej (lub więcej) odpowiedzi spośród podanych opcji:

  • Wpierw użytkownik nadaje treść pytania oraz miejsce, w którym będzie wyświetlana.
  • Pole „odpowiedzi” służy do zarządzania opcjami do wyboru. Za pomocą przycisków z prawej strony pola, użytkownik może dodawać, edytować, usuwać a także zmieniać kolejność wyświetlania odpowiedzi. Poniżej należy wybrać sposób numerowania – liczbowo (1, 2, 3…) lub literowo (a, b, c…).
  • Poniżej, zaznaczając „wybór wielu odpowiedzi”, pojawia się możliwość wielokrotnego wyboru opcji. Natomiast wybierając kolejny checkbox, wyświetla się nowa odpowiedź, lecz tym razem z możliwością wpisania jej w polu tekstowym, które pojawi się pod nią. Tutaj użytkownik może również ustawić ilość wierszy, które pole będzie zawierać.

Rys. 9 Konfiguracja atrybutu „wybór odpowiedzi”

 

Styl atrybutu

WEBCON BPS Designer Studio pozwala również na nadawanie atrybutom określonego wyglądu dzięki obsłudze języka kaskadowych arkuszy stylów. Aby to zrobić, należy przejść do zakładki „Styl i zachowanie”. Tam, w sekcji „Styl”, widnieją dwa pola pozwalające na formatowanie treści za pomocą (jednej lub więcej) własności CSS:

  • styl atrybutu – użytkownik może tutaj konfigurować wygląd etykiety. Po uzupełnieniu go przykładowym warunkiem zmieniającym kolor tła oraz grubość czcionki, nazwa będzie wyglądać następująco:

Rys. 10 Uzupełnienie pola przykładowymi własnościami stylów CSS

 

Rys. 11 Rezultat wyżej wykonanej akcji

 

  • styl kontrolki – pole odpowiedzialne za wygląd kontrolki atrybutu (w tym przypadku – tekstu wielowierszowego). Analogicznie jak w poprzednim przykładzie, uzupełnienie go stylami z języka CSS wpłynie na widok atrybutu w portalu. W tym przypadku kolor tła będzie przedstawiony w reprezentacji heksadecymalnej.

Rys. 12 Uzupełnienie pola „Styl kontrolki” przykładowymi własnościami CSS

 

Rys. 13 Rezultat wyżej wykonanej akcji