Tema
Defina o dicionário theme no nível raiz para aplicar um estilo uniforme à interface. Todos os componentes e subpáginas herdarão todos os campos do dicionário de tema do nível raiz.
Para definir um estilo individual para um componente, defina um dicionário theme no dicionário desse componente. O campo theme do componente substituirá o theme do nível raiz, resultando na mesclagem dos temas. Componentes diferentes podem ter propriedades de tema próprias; consulte a tabela de chaves de tema de cada componente.
Quando um componente vincula uma subpágina que não é XUI (como Option/MultipleOption/OrderedOption/EditableList), a subpágina usará o dicionário theme do componente. Quando o componente vincula outra subpágina XUI (como Link), a subpágina pode definir seu próprio dicionário theme, que será mesclado ao tema da página pai.
Interface
| Chave | Tipo | Descrição |
|---|---|---|
| style | Estilo | Estilo da interface |
| tintColor | Cor | Cor do primeiro plano |
| backgroundColor | Cor | Cor de fundo |
| separatorColor | Cor | Cor dos separadores dos componentes |
| backgroundImage | String | Caminho relativo da imagem de fundo |
Barra de navegação
| Chave | Tipo | Descrição |
|---|---|---|
| navigationBarColor | Cor | Cor de fundo da barra de navegação |
| navigationTitleColor | Cor | Cor do título da barra de navegação |
Cabeçalho e rodapé
| Chave | Tipo | Descrição |
|---|---|---|
| headerTextColor | Cor | Cor do texto de header |
| subheaderTextColor | Cor | Cor do texto de subheader |
| footerTextColor | Cor | Cor do texto do rodapé |
| headerBackgroundColor | Cor | Cor de fundo de header |
| footerBackgroundColor | Cor | Cor de fundo do rodapé |
Componentes comuns
| Chave | Tipo | Descrição |
|---|---|---|
| cellBackgroundColor | Cor | Cor de fundo do componente |
| disclosureIndicatorColor | Cor | Cor do indicador do componente |
| selectedColor | Cor | Cor do item selecionado |
| highlightedColor | Cor | Cor de destaque |
| labelColor | Cor | Cor do texto do título |
| valueColor | Cor | Cor do texto do valor |
Estado
| Chave | Tipo | Descrição |
|---|---|---|
| dangerColor | Cor | Cor de erro |
| warningColor | Cor | Cor de aviso |
| successColor | Cor | Cor de sucesso |
Estilo
| style | Descrição |
|---|---|
| Grouped | Estilo agrupado (padrão) |
| Plain | Estilo simples |
O tipo Cor é uma string hexadecimal RGB/RGBA iniciada por #; por exemplo, #FF0000 representa vermelho.