UserConfigurations permite criar opções para o usuário escolher. É possível ajustar a aparência dos elementos do mostrador do relógio com base nos valores escolhidos.
As opções de configuração do usuário podem ser:
BooleanConfiguration: geralmente usado quando o usuário tem a opção de mostrar ou não um elemento ou escolher entre dois estilos.ListConfiguration: oferece ao usuário uma variedade de opções. Por exemplo, se o mostrador do relógio tiver quatro imagens de fundo diferentes para escolherColorConfiguration: define temas de cores para que o usuário possa selecionar o tema preferido.
Opções booleanas
As opções booleanas são talvez as mais simples das configurações de usuário. Eles podem ser definidos da seguinte forma:
<!-- Under WatchFace element --> <UserConfigurations> <!-- show_date and show_date_label defined in res/values/strings.xml --> <BooleanConfiguration id="show_date" displayName="show_date_label" screenReaderText="show_date_label" defaultValue="TRUE" /> </UserConfigurations>
As opções booleanas podem ser usadas de duas maneiras:
Usando a estrutura
BooleanConfigurationnoScenedo mostrador do relógio:<!-- Within the main Scene of the watch face --> <BooleanConfiguration id="show_date"> <BooleanOption id="TRUE"> <!-- ...Content when date required --> </BooleanOption> <BooleanOption id="FALSE"> <!-- ...Content when date not required --> </BooleanOption> </BooleanConfiguration>
As opções de configuração não podem ser aninhadas no uso.
Como alternativa, a opção de configuração pode ser usada em expressões:
<Expressions> <Expression name="my_expression"> <!-- Use show_date as part of a more complex evaluation --> <![CDATA[[CONFIGURATION.show_date] == "TRUE" && [HOUR_0_23] < 15]] </Expression> </Expressions> <Compare expression="my_expression"> <!-- Content goes here --> </Compare> </Condition>
Opções da lista
As opções de lista funcionam de maneira muito semelhante às opções booleanas. Por exemplo, para fornecer uma lista de imagens de plano de fundo para o usuário escolher:
<!-- Under WatchFace element --> <UserConfigurations> <ListConfiguration id="background_image" displayName="background_image_label" icon="background_option_icon" screenReaderText="background_image_label" defaultValue="0"> <ListOption id="0" displayName="background0_image_label" screenReaderText="background0_image_label" icon="background0_icon" /> <ListOption id="1" displayName="background1_image_label" screenReaderText="background1_image_label" icon="background1_icon" /> ... </ListConfiguration> </UserConfigurations>
Assim como nas opções booleanas, há duas maneiras de usar isso:
Usando o elemento
ListConfigurationemScene:<!-- Within the main Scene of the watch face --> <ListConfiguration id="background_image"> <ListOption id="0"> <!-- ...Content for option 0 --> </ListOption> <ListOption id="1"> <!-- ...Content for option 1 --> </ListOption> </ListConfiguration>
Como alternativa, a opção de configuração pode ser usada em expressões mais complexas:
<Expressions> <Expression name="background_zero_and_something_else"> <!-- Use as part of a more complex evaluation --> <![CDATA[[CONFIGURATION.background_image] == "0" && [HOUR_0_23] < 15]] </Expression> </Expressions> <Compare expression="background_zero_and_something_else"> <!-- Content goes here --> </Compare> </Condition>
Temas de cores
O formato do mostrador do relógio permite definir temas de cores usando ColorConfiguration.
Os usuários podem selecionar o tema de preferência no editor de mostrador do relógio, e as
cores desse tema podem aparecer em toda a definição do mostrador.
Por exemplo, para definir um tema com duas entradas e três cores, defina um ColorConfiguration da seguinte maneira:
<!-- Under WatchFace element --> <UserConfigurations> <ColorConfiguration id="myThemeColor" displayName="theme_label" defaultValue="0"> <ColorOption id="0" displayName="relaxed_label" colors="#3083dc #f8ffe5 #7dde92" /> <ColorOption id="1" displayName="urban_label" colors="#f4b393 #fc60a8 #7a28cb" /> </ColorConfiguration> </UserConfigurations>
Eles podem ser usados como fontes de dados em vez de valores de cores hexadecimais. Observe como o valor do índice é especificado para selecionar o primeiro, o segundo ou o terceiro elemento do tema:
<AnalogClock x="0" y="0" width="450" height="450"> <HourHand resource="hour" x="220" y="55" width="20" height="190" pivotX="0.5" pivotY="0.9210" tintColor="[CONFIGURATION.myThemeColor.0]"/> <MinuteHand resource="minute" x="222" y="30" width="16" height="220" pivotX="0.5" pivotY="0.9" tintColor="[CONFIGURATION.myThemeColor.1]"/> <SecondHand resource="second" x="226" y="20" width="8" height="245" pivotX="0.5" pivotY="0.8571" tintColor="[CONFIGURATION.myThemeColor.2]"/> </AnalogClock>
No caso específico em que cada ColorOption tem apenas uma cor definida, também é possível fazer referência a ela como CONFIGURATION.myThemeColor, sem o índice. Em seguida, o usuário pode selecionar a entrada de tema que preferir no editor de
mostrador do relógio.
Sabores
Observação: os estilos são compatíveis com a versão 2 e mais recentes do formato de mostrador do relógio.
UserConfigurations oferecem muita flexibilidade ao usuário, mas, à medida que você aumenta o número de elementos de configuração definidos, o número de combinações pode crescer muito.
Com Flavors, é possível definir predefinições para os UserConfigurations que você
considera importantes.
O usuário pode selecionar entre essas variações predefinidas no app complementar ou continuar escolhendo cada valor de configuração individualmente.
Por exemplo, considere um mostrador do relógio em que você define três configurações:
- Uma configuração de tema de cores que permite ao usuário selecionar qual tema aplicar. Você definiu dois temas, um colorido e outro monocromático.
- Uma lista de planos de fundo. Você definiu duas opções para o usuário escolher.
- Uma opção para mostrar ou não a frequência cardíaca do usuário no mostrador do relógio.
Além disso, você tem um ComplicationSlot no mostrador do relógio.
Você decide que há dois Flavors que quer destacar para o usuário.
Há muitas outras combinações possíveis de todas essas configurações, mas estas são as que você acha que funcionam melhor:
- Um toque esportivo: vai consistir em:
- O tema de cores claras, para energizar e ativar você (ID: 0)
- A primeira imagem de plano de fundo (ID: 0)
- Frequência cardíaca mostrada no mostrador do relógio para referência
- O slot de complicação mostrando a contagem de passos
- Um sabor sofisticado: consiste em:
- O tema de cores monocromático, para combinar com qualquer roupa (ID: 1)
- A segunda imagem de plano de fundo (ID: 1)
- A frequência cardíaca não aparece no mostrador do relógio
- O espaço para complicação não está ativado
Os sabores precisam ser ativados em watch_face_info.xml. Portanto, o elemento FlavorsSupported
no arquivo watch_face_info.xml precisa ser definido como value="true".
Cada variação é definida em UserConfigurations da seguinte maneira:
<!-- Under UserConfigurations --> <Flavors defaultValue="sporty_flavor"> <Flavor id="sporty_flavor" displayName="flavor_sporty_label" screenReaderText="flavor_sporty_label"> <Configuration id="theme_color" optionId="0"/> <Configuration id="background_image" optionId="0"/> <Configuration id="show_hr" optionId="TRUE"/> <ComplicationSlot slotId="0"> <DefaultProviderPolicy defaultSystemProvider="STEP_COUNT" defaultSystemProviderType="SHORT_TEXT"/> </ComplicationSlot> </Flavor> <Flavor id="sophisticated_flavor" displayName="flavor_sophisticated_label" screenReaderText="flavor_sophisticated_label"> <Configuration id="theme_color" optionId="1"/> <Configuration id="background_image" optionId="1"/> <Configuration id="show_hr" optionId="FALSE"/> <ComplicationSlot slotId="0"> <!-- Type here is set to empty to demonstrate how to hide a complication slot in Flavors. --> <DefaultProviderPolicy defaultSystemProvider="SUNRISE_SUNSET" defaultSystemProviderType="EMPTY"/> </ComplicationSlot> </Flavor> </Flavors>