Custom datePicker

Question

I notice that in the documentation (https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/datepicker?view=net-maui-8.0#Create%20a%20DatePicker)

I dent see any reference to Header or Title

How can I put a Title or Header to the datePicker?

What I want to do is this

 <Grid
     Margin="10"
     ColumnDefinitions="*,*"
     RowDefinitions="100,100,100,*">
     <inputLayout:SfTextInputLayout
         Grid.ColumnSpan="2"
         Hint="Coure name"
         IsHintAlwaysFloated="True"
         OutlineCornerRadius="8">
         <Entry />
     </inputLayout:SfTextInputLayout>

     <Button
         Grid.Row="1"
         Command="{Binding OpenPickerCommand}"
         HorizontalOptions="Start"
         Text="initial registration date"
         VerticalOptions="Start" />

     <Label
         Grid.Row="1"
         Grid.Column="1"
         Margin="0,10,0,0"
         Text="Initial date" />

     <Button
         Grid.Row="2"
         Command="{Binding OpenPickerCommand}"
         HorizontalOptions="Start"
         Text="End Registration date"
         VerticalOptions="Start" />

     <Label
         Grid.Row="2"
         Grid.Column="1"
         Margin="0,10,0,0"
         Text="End date" />

I have two buttons.

and two labels

both say Start registration date and end registration date.

I want to bind those selected dates to the labels (Those dates are registration date for courses)

public class Course {

    public int Id { get; set; }

    public string Name { get; set; }

    public string Description { get; set; }

    public string Teacher { get; set; }

    public DateOnly initialDate { get; set; } 

    public DateOnly endDate { get; set; }

I also wanted to know if is possible to select start date and end date with a Sigle DatePicker, to not clutter the ui

Answer 1

Hello,

For how to migrate Renderer to MAUI Handler, the official documentation has been made, please refer to Migrate a Xamarin.Forms custom renderer to a .NET MAUI handler for more details.

For the Windows platform, the corresponding native control is CalendarDatePicker. You could refer to the official API documentation to modify its properties.

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.