# Modal

Ez a leírás segítséget ad a **Modal**widget beállításaiban, és a stílusok módosításában.

#### MODAL WIDGET ELHELYEZÉSE

- A baloldalon található Widget Panel-ről **húzza** a Modal-t az oldalára.
- A megjelenő **párbeszéd ablakban** lehetősége van a Modal elemeinek beállítására, és módosítására.

   
![](https://dotroll.com/wp-content/uploads/2020/08/Modal-drag.png)

#### MODAL MÓDOSÍTÁSA

- Beállíthat **Egyedi stílust** ehhez válassza a **Custom** lehetőséget a **Style** részen.
- Ha kiválasztotta a **Custom** lehetőséget akkor módosíthatja a **Háttérszínt** és a **Doboz színét**.
- Adja meg a **Gomb szövegét** ahhoz, hogy megjelenjen a **Modal gomb**.
- Ha szeretné akkor be lehet állítani a **Gomb** esetén a **teljes szélességet** ehhez jelölje be a **Stretch** opciót.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Modal-settings1.png)

- Válassza ki a Modal Gomb **Pozicióját**. Itt 3 lehetőségből választhat: **bal, közép, és jobb**.
- Válassza ki a Modal Gomb **Ikonját,** ha nem szeretne ikont beállítani, akkor hagyja üresen.
- Ha kiválasztott **Ikont** akkor be kell állítania annak **Pozicióját**. Alapértelmezésben az ikon **balra zárt** azonban ezt módosítani lehet **jobbra zártra**.
- Válassza ki az **animáció** típusát a modal képernyő **végére**, temészetesen beállítható az **elrejtés is.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/Modal-settings2.png)**

#### EGYEDI STÍLUSOK

- Választhat **előredefiniált stílusok** közül, ehhez kattintson a **előredefiniált stílusok** lehetőségre.
- Lehetősége van egyedi stílusok beállítására is, ehhez válassz az Elem stílus szerkesztése lehetőséget.

   
![](https://dotroll.com/wp-content/uploads/2020/08/Modal-styles.png)

#### MODEL KÉPERNYŐKÉP

- Amikor **rákattint** a Modal gombra meg fog jelenni a beállított Modal.

   
![](https://dotroll.com/wp-content/uploads/2020/08/Modal-view.png)