Pulsante
Qual è la funzione di questo widget?
Un pulsante comunica l'azione che si verifica se viene toccato in fase di esecuzione.
Quando va utilizzato questo widget?
I pulsanti consentono all'utente dell'esperienza di interagire e spostarsi all'interno dell'esperienza. Utilizzare il widget
Pulsante per comunicare in modo chiaro all'utente l'azione che si verifica quando il pulsante viene toccato. È possibile modificare lo stile dei pulsanti utilizzando CSS o i temi predefiniti. Per ulteriori informazioni sui temi, vedere
TemiSono disponibili proprietà, servizi, eventi o azioni speciali?
Per visualizzare un elenco di proprietà, servizi ed eventi comuni a più widget, vedere
Proprietà, servizi ed eventi comuni a più widget.
Le seguenti tabelle riportano un elenco di proprietà, servizi ed eventi specifici di questo widget.
|
Proprietà
|
Descrizione
|
|
Margine
|
Crea un margine intorno al pulsante. Attualmente, non è possibile inserire valori per lati specifici ed è necessario immettere manualmente un numero seguito da uno dei formati supportati (ad esempio, 10px):
• px
• %
• in
• mm
• cm
• ex
• em
• pt
• pc
|
Come funziona il widget
Ecco un esempio dell'aspetto che potrebbe avere il widget.
|
Passi fondamentali richiesti per l'uso
|
Come si presenta
|
|
1. Trascinare e rilasciare un widget Pulsante nell'area di lavoro.
2. Immettere il nome del pulsante nel campo Testo. Ad esempio, Play.
3. Associare l'evento Clic del pulsante a un altro widget e selezionare il tipo di associazione che si desidera creare. Ad esempio, se si associa l'evento Clic a un modello e si seleziona Riproduci tutto nella finestra Seleziona destinazione associazione, quando si tocca il pulsante in un'esperienza vengono riprodotti tutti i passi della sequenza associati al modello.
|
| In questo esempio abbiamo utilizzato il tema predefinito button-balanced per rendere il pulsante di colore verde. |
|
Definire lo stile del widget con CSS
Per definire lo stile del widget è possibile utilizzare CSS. Quello che segue è un esempio di classe CSS che è possibile creare e applicare:
|
|
È consigliabile assegnare nomi univoci alle classi in modo che non siano in conflitto con altre classi o proprietà predefinite.
|
|
Esempio CSS
|
Come si presenta
|
|
.ptc-button {
border-width: 1px;
border-style: outset;
border-color: rgb(46, 50, 49);
border-radius: 25px;
background: rgb(47, 48, 53);
font-size: 16px;
font-family: Century Gothic;
color: white;
}
|
|
Per ulteriori informazioni sull'implementazione delle classi CSS, vedere
Stili dell'applicazione.
