DatePicker

A UI do aplicativo multiplataforma .NET (.NET MAUI) DatePicker invoca o controle seletor de data da plataforma e permite selecionar uma data.

DatePicker define oito propriedades:

  • MinimumDate do tipo DateTime, cujo padrão é o primeiro dia do ano 1900.
  • MaximumDate do tipo DateTime, cujo padrão é o último dia do ano 2100.
  • Date do tipo DateTime, a data selecionada, cujo padrão é o valor DateTime.Today.
  • Format do tipo string, uma cadeia de caracteres de formatação padrão ou personalizada .NET, cujo padrão é "D", o padrão de data longa.
  • TextColor do tipo Color, a cor usada para exibir a data selecionada.
  • FontAttributes do tipo FontAttributes, cujo padrão é FontAtributes.None.
  • FontFamily do tipo string, cujo padrão é null.
  • FontSize do tipo double, cujo padrão é -1,0.
  • CharacterSpacing, do tipo double é o espaçamento entre os caracteres do DatePicker texto.

Todas as oito propriedades são apoiadas por objetos BindableProperty, o que significa que elas podem ser estilizadas e as propriedades podem ser alvos de vinculações de dados. A propriedade Date possui um modo de ligação padrão BindingMode.TwoWay, o que significa que ela pode ser um destino de uma ligação de dados em um aplicativo que usa o padrão Model-View-ViewModel (MVVM).

Aviso

Ao definir MinimumDate e MaximumDate, certifique-se de que MinimumDate seja sempre menor ou igual a MaximumDate. Caso contrário, DatePicker gerará uma exceção.

O DatePicker garante que Date esteja entre MinimumDate e MaximumDate, inclusive. Se MinimumDate ou MaximumDate for definido de forma que Date não fique entre eles, DatePicker ajustará o valor de Date.

O DatePicker dispara um evento DateSelected quando o usuário seleciona uma data.

Criar um DatePicker

Quando um valor DateTime é especificado em XAML, o analisador XAML usa o método DateTime.Parse com um argumento CultureInfo.InvariantCulture para converter a cadeia de caracteres em um valor DateTime. As datas devem ser especificadas em um formato preciso: meses de dois dígitos, dias de dois dígitos e anos de quatro dígitos separados por barras:

<DatePicker MinimumDate="01/01/2022"
            MaximumDate="12/31/2022"
            Date="06/21/2022" />

Se a propriedade BindingContext de DatePicker for definida como uma instância de um viewmodel contendo propriedades do tipo DateTime denominadas MinDate, MaxDate e SelectedDate (por exemplo), você poderá instanciar o DatePicker assim:

<DatePicker MinimumDate="{Binding MinDate}"
            MaximumDate="{Binding MaxDate}"
            Date="{Binding SelectedDate}" />

Nesse exemplo, todas as três propriedades são inicializadas com as propriedades correspondentes no viewmodel. Como a propriedade Date tem um modo de ligação TwoWay, qualquer nova data selecionada pelo usuário é refletida automaticamente no viewmodel.

Se o DatePicker não contiver uma ligação em sua propriedade Date, seu aplicativo deverá anexar um manipulador ao evento DateSelected para ser informado quando o usuário selecionar uma nova data.

No código, você pode inicializar as propriedades MinimumDate, MaximumDate e Date com valores do tipo DateTime:

DatePicker datePicker = new DatePicker
{
    MinimumDate = new DateTime(2018, 1, 1),
    MaximumDate = new DateTime(2018, 12, 31),
    Date = new DateTime(2018, 6, 21)
};

Para obter informações sobre como definir propriedades de fonte, veja Fontes.

DatePicker e layout

É possível usar uma opção de layout horizontal irrestrita, como Center, Startou End com DatePicker:

<DatePicker ···
            HorizontalOptions="Center" />

No entanto, isso não é recomendado. Dependendo da configuração da propriedade Format, as datas selecionadas podem exigir larguras de exibição diferentes. Por exemplo, a cadeia de caracteres de formato "D" faz com que DateTime exiba datas em um formato longo e "Quarta-feira, 12 de setembro de 2018" requer uma largura de exibição maior do que "Sexta-feira, 4 de maio de 2018". Dependendo da plataforma, essa diferença pode fazer com que a visualização DateTime mude de largura no layout ou que a exibição fique truncada.

Dica

É melhor usar a configuração padrão HorizontalOptions de Fill com DatePicker e não usar uma largura de Auto ao colocar DatePicker em uma Grid célula.

Localizar um DatePicker no Windows

Para aplicativos direcionados ao Windows, garantir que DatePicker exiba datas em um formato localizado de acordo com as configurações do usuário, incluindo os nomes de meses e dias na caixa de diálogo do seletor, requer configuração específica no arquivo Package.appxmanifest do seu projeto. A localização dos elementos no manifesto do pacote melhora a experiência do usuário, aderindo às normas culturais da localidade do usuário.

A localização dos formatos de data e strings no <xref:Microsoft.Maui.Controls.DatePicker> requer a declaração dos idiomas suportados em seu arquivo Package.appxmanifest.

Siga essas etapas para configurar seu DatePicker para localização no Windows:

  1. Localize a seção Recursos.

    Navegue até a pasta Platforms\Windows do seu projeto e abra o arquivo Package.appxmanifest em um editor de código ou Visual Studio. Se estiver usando o Visual Studio, verifique se você está visualizando o XML bruto do arquivo. Procure a seção <Resources>, que inicialmente pode incluir:

    <Resources>
        <Resource Language="x-generate" />
    </Resources>
    
  2. Especifique os idiomas suportados.

    Substitua <Resource Language="x-generate"> por elementos <Resource /> para cada um dos seus idiomas com suporte. O código do idioma deve estar no formato de uma etiqueta de idioma BCP-47, como en-US para inglês (Estados Unidos), es-ES para espanhol (Espanha), fr-FR para francês (França) ou de-DE para alemão (Alemanha). Por exemplo, para adicionar suporte para inglês (Estados Unidos) e espanhol (Espanha), sua seção <Resources> deve ser modificada para ficar assim:

    <Resources>
        <Resource Language="en-US" />
        <Resource Language="es-ES" />
    </Resources>
    

Essa configuração garante que DatePicker exibirá formatos de data, meses e dias de acordo com a localidade do usuário, melhorando significativamente a usabilidade e acessibilidade do aplicativo em diferentes regiões.

Para obter mais informações sobre localização em aplicativos .NET MAUI, veja Localização.