# Edycja stron

## Wprowadzenie

W ramach projektowania formularza w **Eximee Designer** użytkownik ma możliwość edycji poszczególnych **stron wniosku**, które tworzą jego strukturę logiczną i wizualną.\
Każda strona może zawierać [komponenty bazowe](https://docs.eximee.com/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/dodawanie-i-parametryzowanie-komponentow) lub złożone, a jej zachowanie i wygląd można modyfikować w panelu właściwości strony.

## Struktura formularza a strony

Formularz w Eximee składa się z **kroków (steps)** i **stron (pages)**. Zarządzanie stronami odbywa się w **zakładce Kroki**, natomiast ich treść i układ modyfikujemy w **zakładce Wniosek**.

## Warunki widoczności

Warunki widoczności umożliwiają kontrolę nad tym, czy dana strona zostanie wyświetlona użytkownikowi.\
Definiowane są zakładce **Wniosek** na wybranej stronie, w sekcji **Jakość danych** (pole **Dodaj warunek widoczności**) za pomocą wyrażeń logicznych tworzonych w **zaawansowanym edytorze warunków**, który pozwala odwoływać się do wartości pól formularza lub zmiennych sesyjnych.

Warunki widoczności można również definiować w zakładce **Kroki** – poprzez opcję **Dodaj warunek**, co pozwala określić logikę prezentacji poszczególnych kroków formularza.

Więcej informacji: Zaawansowany edytor warunków.

## Edycja układu strony

Każda strona ma zdefiniowany układ kolumn, ustalany w momencie tworzenia formularza.\
Zmiana liczby kolumn (**numColumns**) możliwa jest wyłącznie poprzez edycję kodu XML w zakładce **Źródło**.

{% code title="Przykład fragmentu strony z ustawioną liczbą kolumn 12" %}

```xml
<system:Page id="Page3" mid="Page3" titleKey="Page3.title">
  <system:Page.layout>
    <ns6:GridLayout makeColumnsEqualWidth="true" numColumns="12"/>
  </system:Page.layout>
</system:Page>
```

{% endcode %}

{% hint style="info" %}
**Uwaga:**\
Przed zmniejszeniem liczby kolumn należy dostosować szerokość komponentów (`horizontalSpan`) - ich suma w wierszu nie może przekraczać liczby kolumn strony.
{% endhint %}

## Stylizacja strony

Każda strona może mieć przypisane własne style CSS.\
Styl definiuje wizualną prezentację strony (np. układ, marginesy, kolor tła). Zdefiniowany styl może być ustawiony w panelu **Właściwości** (sekcja **Stylizacja**) lub bezpośrednio w źródle XML poprzez atrybut `styleName`.

Właściwości `fixedColumns` i `styleName` pozwalają określić wygląd strony - odpowiednio strukturę układu i przypisany styl CSS.

Zaleca się stosowanie stylów platformowych zgodnych z wdrożoną szatą graficzną.\
Więcej informacji: *Style formularza i komponentu*.

## Właściwości strony

Po kliknięciu w puste miejsce edytora wniosku otwiera się panel **Właściwości** strony.

<div align="center"><figure><img src="https://1082717226-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2CssJT0zIo4SJQLbSZ6l%2Fuploads%2FkH5ndqVPzkWhijV9FX8X%2Fobraz.png?alt=media&#x26;token=535f7ac0-0fd8-4c4d-a279-1b9eac94c140" alt="" width="152"><figcaption><p><em><strong>Ilustracja 1.</strong> Fragment panelu "Właściwości" strony</em></p></figcaption></figure></div>

> Więcej informacji na temat właściwości strony [tutaj](https://docs.eximee.com/budowanie-aplikacji/interfejs-uzytkownika/formularze/kroki-i-strony-formularza#wlasciwosci-stron)

## Dobre praktyki

* Ustal spójną konwencję nazw stron (np. *Page1*, *Page2*, *Summary*).
* Stosuj warunki widoczności tylko tam, gdzie to konieczne.
* Ustal jednolitą liczbę kolumn w obrębie wszystkich stron formularza.
* Projektuj układ komponentów tak, aby ich suma `horizontalSpan` w wierszu nie przekraczała liczby kolumn strony. Przy zmianie liczby kolumn pamiętaj, aby dopasować szerokość komponentów.
* Strony znajdujące się po [punkcie zapisu](https://docs.eximee.com/budowanie-aplikacji/interfejs-uzytkownika/formularze/tworzenie-formularza/punkt-zapisu-wniosku-i-mechanizm-ostatnich-stron) traktowane są jako **strony zakończenia** (np. podziękowanie, potwierdzenie)

## FAQ

**Czy można zmienić kolejność stron w formularzu?**\
Tak. W zakładce **Kroki** można przeciągać strony metodą *drag & drop*. Zmiany zapisywane są automatycznie.

**Jak ukryć stronę przed użytkownikiem?**\
W panelu właściwości strony należy ustawić **warunek widoczności** (`visibleCondition`). Strona zostanie pokazana tylko, jeśli warunek zwróci wartość `true`.

**Czy liczba kolumn strony może być inna niż w całym formularzu?**\
Tak, ale tylko po edycji źródła XML w zakładce **Źródło** - zmieniając atrybut `numColumns` w elemencie `<system:Page.layout>`.

**Jak ustawić stronę jako stronę podziękowania?**\
Wystarczy umieścić ją za [**Punktem zapisu wniosku**](https://docs.eximee.com/budowanie-aplikacji/interfejs-uzytkownika/formularze/tworzenie-formularza/punkt-zapisu-wniosku-i-mechanizm-ostatnich-stron) - system automatycznie potraktuje ją jako stronę zakończenia.