Представление календаря
Представление календаря позволяет пользователю просматривать календарь и взаимодействовать с ним, перемещаясь по месяцам, годам и десятилетиям. Пользователь может выбрать отдельную дату или диапазон дат. Не имеет поверхности выбора, и календарь всегда виден.
Выбор правильного элемента управления
Используйте представление календаря, чтобы пользователь мог выбрать дату или диапазон дат в постоянно отображаемом календаре.
Если необходимо предоставить пользователю возможность выбора нескольких дат одновременно, используйте представление календаря. Если необходимо предоставить пользователю возможность выбора одной даты и не нужно, чтобы календарь был виден всегда, рекомендуется использовать элементы управления Выбор даты календаря или Выбор даты.
Дополнительные сведения о выборе правильного элемента см. в статье Элементы управления датой и временем.
Примеры
Представление календаря состоит из 3 отдельных представлений: представление месяца, представление года и представление десятилетия. По умолчанию он запускается с открытым представлением месяца. Чтобы указать желаемое начальное представление, задайте свойство DisplayMode.
Пользователю необходимо нажать на заголовок в представлении месяца, чтобы открыть представление года, и нажать на заголовок в представлении года, чтобы открыть представление десятилетия. Чтобы вернуться в представление года, необходимо выбрать год в представление десятилетия, и выбрать месяц в представлении года, чтобы вернуться в представление месяца. С помощью двух стрелок возле заголовка можно перемещаться вперед или назад по месяцам, годам и десятилетиям.
UWP и WinUI 2
Сведения и примеры в этой статье оптимизированы для приложений, использующих Windows App SDK и WinUI 3, но обычно применимы к приложениям UWP, использующим WinUI 2. Сведения и примеры для конкретной платформы см. в справочнике по API UWP.
Этот раздел содержит сведения, необходимые для использования элемента управления в приложении UWP или WinUI 2.
API для этого элемента управления существуют в пространстве имен Windows.UI.Xaml.Controls .
- API UWP:класс CalendarView, событие SelectedDatesChanged
- Откройте приложение коллекции WinUI 2 и просмотрите CalendarView в действии. Приложения из коллекции WinUI 2 включают интерактивные примеры большинства элементов управления, возможностей и функций WinUI 2. Получите приложение из Microsoft Store или получите исходный код в GitHub.
Мы рекомендуем использовать последнюю версию WinUI 2 , чтобы получить самые актуальные стили и шаблоны для всех элементов управления. WinUI 2.2 или более поздней версии включает новый шаблон для этого элемента управления, использующий скругленные углы. Дополнительные сведения см. в разделе о радиусе угла.
Создание представления календаря
- Важные API:класс CalendarView, событие SelectedDatesChanged
Приложение коллекции WinUI 3 содержит интерактивные примеры большинства элементов управления, функций и функций WinUI 3. Получение приложения из Microsoft Store или получение исходного кода на GitHub
Этот пример демонстрирует, как создать простое представление календаря.
Созданное представление календаря будет выглядеть следующим образом:
Выбора дат
По умолчанию для свойства SelectionMode задано значение Single. Это позволяет пользователю выбрать дату в календаре. Установите для SelectionMode значение None, чтобы отключить выбор даты.
Установите для SelectionMode значение Multiple, чтобы пользователь мог выбрать несколько дат. Чтобы программным способом выбрать несколько дат, добавьте объекты DateTime/DateTimeOffset в коллекцию SelectedDates, как показано здесь:
calendarView1.SelectedDates.Add(DateTimeOffset.Now); calendarView1.SelectedDates.Add(new DateTime(1977, 1, 5)); Пользователь может отменить выбор даты, нажав эту дату в сетке календаря.
Можно обработать событие SelectedDatesChanged так, чтобы оно получало оповещение в случае изменения коллекции SelectedDates.
Важные сведения о значениях даты см. в разделе Значения DateTime и Calendar статьи «Элементы управления датой и временем».
Настройка вида представления календаря
Представление календаря состоит как из элементов XAML , определенных в ControlTemplate, так и визуальных элементов, обработанных непосредственно элементом управления.
- Элементы XAML, определенные в шаблоне элементов управления, включают границу, которая содержит элемент управления, заголовок, кнопки «Назад» и «Далее», а также элементы DayOfWeek. Можно задать стиль и изменить шаблон этих элементов, как и любого другого элемента управления XAML.
- Сетка календаря состоит из объектов CalendarViewDayItem. Задать стиль и изменить шаблон этих элементов невозможно, но для настройки их внешнего вида предоставляются различные свойства.
На данной диаграмме показаны элементы, которые составляют представление месяца в календаре. См. подробнее в разделе «Примечания» в описании класса CalendarViewDayItem.
В следующей таблице приведен список свойств, которые можно редактировать для изменения внешнего вида элементов календаря.
| Элемент | Свойства |
|---|---|
| DayOfWeek | DayOfWeekFormat |
| CalendarItem | CalendarItemBackground, CalendarItemBorderBrush, CalendarItemBorderThickness, CalendarItemForeground |
| DayItem | DayItemFontFamily, DayItemFontSize, DayItemFontStyle, DayItemFontWeight, HorizontalDayItemAlignment, VerticalDayItemAlignment, CalendarViewDayItemStyle |
| MonthYearItem (в представлениях года и десятилетия эквивалентно DayItem) | MonthYearItemFontFamily, MonthYearItemFontSize, MonthYearItemFontStyle, MonthYearItemFontWeight |
| FirstOfMonthLabel | FirstOfMonthLabelFontFamily, FirstOfMonthLabelFontSize, FirstOfMonthLabelFontStyle, FirstOfMonthLabelFontWeight, HorizontalFirstOfMonthLabelAlignment, VerticalFirstOfMonthLabelAlignment, IsGroupLabelVisible |
| FirstofYearDecadeLabel (в представлениях года и десятилетия эквивалентно FirstOfMonthLabel) | FirstOfYearDecadeLabelFontFamily, FirstOfYearDecadeLabelFontSize, FirstOfYearDecadeLabelFontStyle, FirstOfYearDecadeLabelFontWeight |
| Границы визуального состояния | FocusBorderBrush, HoverBorderBrush, PressedBorderBrush, SelectedBorderBrush, SelectedForeground, SelectedHoverBorderBrush, SelectedPressedBorderBrush |
| OutofScope | IsOutOfScopeEnabled, OutOfScopeBackground, OutOfScopeForeground |
| Сегодня | IsTodayHighlighted, TodayFontWeight, TodayForeground |
По умолчанию в представлении месяца отображается одновременно 6 недель. Чтобы изменить количество отображаемых недель, задайте свойство NumberOfWeeksInView. Минимальное количество отображаемых недель — 2; максимальное — 8.
По умолчанию представления года и десятилетия отображаются в сетке 4×4. Чтобы изменить количество строк или столбцов, вызовите SetYearDecadeDisplayDimensions с желаемым количеством строк и столбцов. Это изменит сетку для представлений и года, и десятилетия.
Здесь представления года и десятилетия устанавливаются для отображения в сетке 3×4.
calendarView1.SetYearDecadeDisplayDimensions(3, 4); По умолчанию минимальная дата, отображаемая в представлении календаря, —100 лет до текущей даты, а максимальная дата — 100 лет после текущей даты. Чтобы изменить минимальную и максимальную даты, отображаемые в календаре, задайте свойства MinDate и MaxDate.
calendarView1.MinDate = new DateTime(2000, 1, 1); calendarView1.MaxDate = new DateTime(2099, 12, 31); Обновление элементов дня в календаре
Каждый день в календаре представлен объектом CalendarViewDayItem. Для получения доступа к отдельному элементу дня и использования его свойств и методов, обработайте событие CalendarViewDayItemChanging и используйте свойство Item аргументов события для доступа к CalendarViewDayItem.
Чтобы запретить выбор дня в представлении календаря, установите для свойства CalendarViewDayItem.IsBlackout значение true.
Чтобы отобразить контекстные данные о плотности событий дня, вызовите метод CalendarViewDayItem.SetDensityColors. Можно отобразить от 0 до 10 шкал плотности для каждого дня и установить цвет для каждой шкалы.
Вот некоторые элементы дня в календаре. Дни 1 и 2 затемнены. Для дней 2, 3 и 4 установлены разные шкалы плотности.
Поэтапная отрисовка
Представление календаря может содержать большое количество объектов CalendarViewDayItem. Чтобы обеспечить быстрое реагирование пользовательского интерфейса и плавные переходы в календаре, представление календаря поддерживает поэтапную отрисовку. Позволяет разбить обработку элемента дня на этапы. Если день перемещен из представления до завершения выполнения всех этапов, время на попытку обработки и отрисовки этого элемента больше тратиться не будет.
Этот пример иллюстрирует поэтапную отрисовку представления календаря для планирования встреч.
- На этапе 0 отрисовывается элемент дня по умолчанию.
- На этапе 1 затемняются даты, которые нельзя забронировать. Сюда входят прошлые даты, воскресенья, а также полностью забронированные даты.
- На этапе 2 проверяется каждая встреча, забронированная на этот день. Для каждой подтвержденной встречи отображается зеленая шкала плотности, а для каждойнеподтвержденной встречи — синяя.
Класс Bookings в этом примере взят из несуществующего приложения резервирования встреч и не отображается.
private void CalendarView_CalendarViewDayItemChanging(CalendarView sender, CalendarViewDayItemChangingEventArgs args) < // Render basic day items. if (args.Phase == 0) < // Register callback for next phase. args.RegisterUpdateCallback(CalendarView_CalendarViewDayItemChanging); >// Set blackout dates. else if (args.Phase == 1) < // Blackout dates in the past, Sundays, and dates that are fully booked. if (args.Item.Date < DateTimeOffset.Now || args.Item.Date.DayOfWeek == DayOfWeek.Sunday || Bookings.HasOpenings(args.Item.Date) == false) < args.Item.IsBlackout = true; >// Register callback for next phase. args.RegisterUpdateCallback(CalendarView_CalendarViewDayItemChanging); > // Set density bars. else if (args.Phase == 2) < // Avoid unnecessary processing. // You don't need to set bars on past dates or Sundays. if (args.Item.Date >DateTimeOffset.Now && args.Item.Date.DayOfWeek != DayOfWeek.Sunday) < // Get bookings for the date being rendered. var currentBookings = Bookings.GetBookings(args.Item.Date); ListdensityColors = new List(); // Set a density bar color for each of the days bookings. // It's assumed that there can't be more than 10 bookings in a day. Otherwise, // further processing is needed to fit within the max of 10 density bars. foreach (booking in currentBookings) < if (booking.IsConfirmed == true) < densityColors.Add(Colors.Green); >else < densityColors.Add(Colors.Blue); >> args.Item.SetDensityColors(densityColors); > > > Получение примера кода
- Пример коллекции WinUI — просмотр всех элементов управления XAML в интерактивном формате.
Похожие статьи
- Элементы управления датой и временем
- Выбор даты в календаре
- Выбор даты
- Выбор времени
Устанавливаем Календарь на рабочий стол Windows 10
Ранее мы писали о том, как настроить календарь от Google в Windows 10. На этот раз предлагаем вашему вниманию способы, как вернуть на рабочий стол виджет Календаря и настроить его для корректной работы.
Важно отметить, что в Windows 10 нет виджетов, таких как в Windows 7. Разработчики сочли их бесполезными и ресурсозатратными. Поэтому вернуть на рабочий стол Календарь можно с помощью сторонних программ.
Читайте на SoftikBox: Как в операционной системе Windows 10 установить часы на рабочий стол?
Способы установки Календаря на рабочий стол в Windows 10
Если в Windows 7 нажать на значок часов, то появится небольшое окошко с отображением актуального времени и даты. В Windows 10 эта функция отключена. Однако, если вам нужен именно такой тип календаря, стоит внести некоторые изменения в системный реестр. Для этого выполняем следующее:
- Жмём «Win+R» и вводим «regedit».
- Откроется редактор реестра. Находим раздел «HKEY_LOCAL_MACHINE\Software\Microsoft\Windows\CurrentVersion\ImmersiveShell». Нажимаем на пустом месте правой кнопкой мыши и выбираем «Создать», «Параметр DWORD 32-бит». Вводим название «UseWin32TrayClockExperience» и значение «1».
- После внесения изменений перезагружаем систему. Проверяем результат, будет ли работать стандартный календарь.
О том, как работает этот метод, смотрите в видео:
Если вам нужен календарь на рабочий стол для Windows 10 в виде виджета, то без сторонней программы здесь не обойтись. Рекомендуем обратить внимание на Desktop Gadgets Installer. Эта программа совместима со всеми сборками Windows 10 и полностью безопасна. После её установки, нужно нажать правой кнопкой мыши на рабочем столе и выбрать «Вид», «Отображать гаджеты рабочего стола».
После нужно выбрать виджет «Календарь» и поместить его на рабочий стол.
Также можно воспользоваться софтом 8gadgetpack.net. С помощью этого приложения можно установить Календарь на рабочий стол. Кроме того, данный инструмент позволяет добавить гаджеты в меню «Пуск».
После установки этих программ, на рабочий стол Windows 10 можно будет разместить не только Календарь, но и другие виджеты.
О том, как установить виджеты после Creators Update смотрите в видео:
Настройка электронной почты и календаря
вWindows 10 есть встроенные приложения «почта» и «Календарь». Чтобы их открыть, введите Почта или Календарь в поле поиска на панели задач и выберите соответствующие значки из результатов поиска.
Представления себя приложениям «Почта» и «Календарь»
Вы нашли новые приложения, теперь пора извлечь из них пользу, добавив свои учетные записи. Если вы впервые открываете приложение «Почта» или «Календарь», следуйте инструкциям на странице приветствия. В противном случае выполните указанные ниже действия.
- В приложении «почта» или «Календарь» выберите Параметры в левом нижнем углу.
- Перейдите в раздел Управление учетными записями >Добавить учетную запись, а затем выберите учетную запись и следуйте инструкциям.
Начнется автоматическая синхронизация почты и календаря. Чтобы добавить дополнительные учетные записи, вернитесь в раздел » Параметры » .
Еще несколько полезных советов:
- Вам не придется добавлять одну учетную запись дважды — при добавлении учетной записи в одном приложении, другое приложение автоматически подключается к той же учетной записи.
- Для переключения между почтой и календарем выберите команду переключиться на электронную почту или Перейти в окно «Календарь » в левой верхней части окна.
- Чтобы просмотреть список контактов, связанных с вашими учетными записями, выберите Перейти к разделу «люди «, чтобы открыть приложение «люди».
- Удалите учетную запись в любое время, перейдя в настройки >Управление учетными записями. Выберите учетную запись, которую необходимо удалить, а затем нажмите Удалить учетную запись. Если вы входите на компьютер с помощью учетной записи Майкрософт, она автоматически добавляется к приложениям «Почта» и «Календарь». Ее невозможно удалить. Но при этом вы можете удалить любые другие учетные записи, которые вы сами добавили.
- Для получения дополнительных сведений об использовании приложений, включая справку по устранению неполадок, выберите параметры >Справка.
Советы по Windows 10: организуйте свой день с «Календарем»
Это приложение «Календарь». Оно бесплатное и уже предустановлено в Windows 10, так что ничего скачивать не нужно. Найдите его в списке приложений и откройте.
Приложение доступно в автономном режиме, так что вы можете увидеть текущее расписание даже без подключения к Интернету. В отличие от онлайн-календарей, которые вам приходится проверять в браузере, приложение «Календарь» не требует авторизации при каждом заходе.
Дадим два совета по использованию приложения.
Просматривайте несколько календарей в одном месте:
Чтобы лучше управлять своим временем и ничего не пропустить в течение дня, соберите все календари вместе, включая Outlook.com, Gmail, Yahoo, рабочий, учебный и другие аккаунты. Для этого в приложении «Календарь» зайдите в Параметры > Управление учетными записями > Добавить учетную запись.
Просматривайте сегодняшнее расписание за один клик:
Хотите вспомнить, что там запланировано сегодня? Приложение «Календарь» интегрировано в календарь на панели задач Windows 10, так что вы легко можете увидеть ближайшие встречи. Просто кликните на дате и времени и увидите расписание.