Display Multiple Galleries for Calendar Help

[Anonymous]

I am attempting to build a calendar that links to a task list. I already have the app set up to view the task list, filter, search, view deatils, add, edit, etc. My enduser wants an option to view this list in a calendar view. The best way I could think to approach this was dual gallerys. By following an online tutorial https://mitra.computa.asia/article/msdn-building-interactive-calendar-view-powerapps I have the one set up correctly already to display the calendar by each month. That is fully functioning. Now I need to display the Task Name of each task on the appropriate due date on the calendar. I was able to accomplish this via a gallery on top of the calendar gallery, however the tasks are simply being displayed in the order of which they were entered into the CDS. They are being displayed in the appropriate color based on the status of the task and they are clickable that goes to a details screen. The issue is having task display on the right date. 

I am thinking that I need an IF statement to accomplish this but I  cannot seem to get this correct. Can anyone help me with this? 

Here are my variables:

1st Gallery:     CalendarGallery that has TextDay as a label that displays the number of that day in the month

2nd Gallery:     Task Gallery which is placed on top of the CalendarGallery and has TaskName as the label that displays each Task Name. I have it set to WrapCount 7. My variable names from CDS are as follows:

Table:   RIN TASK LIST

Needed Columns:     Task     Due_Date

Also there could possible be more then one task by date so there would need to be multiple tasks displayed. 

My other thought was that I might have to do an individual Gallery for each date of the month from the Calendar Gallery.

Can anyone help?  Shown below is what I have right now

[Anonymous · Accepted solution]

Hi @Anonymous

I can show you my app where I have achieved something similar in functionality also using the calendar view, it could help you get your desired result.

The calendar is used for employees vacation and if there is an event on a date it is highlighted. Clicking on a date will show you all details in a Gallery next to the callendar not on top of it.

If your datasource/collection for tasks has a date field which is only one date you are all set to do this. If your task list have a date range (few dates for one task) you will have to split it into each individual day, let me know if you want a function for this.

The circle that shows if there is an event on any date in the callendar is just simple circle with Visible function like this:

DateAdd(
  MM_Cal_firstDayInView,
  ThisItem.Value,
  Days
)
in 
ShowColumns(
  _PreparedVacationCollection,
  "Date"
)

My collection _PreparedVacationCollection has field date so it just checks if this date is in my collection if it is it returns True (so visible) if not it returns false (Not visible)

The gallery on the side simply filters the _PreparedVacationColelction to only show events on selected date.

Filter(
  _PreparedVacationCollection,
  Date = MM_Cal_selectionDate
)

MM_Cal_selectionDate is set when user clicks any of the date. (For this I have an invisible circle in calendar) The OnSelect is like this:

If( Month(DateAdd(MM_Cal_firstDayInView,ThisItem.Value,Days))<>Month(MM_Cal_firstDayOfMonth),
    0,
    MM_Cal_selectedCount = 1 && DateAdd(MM_Cal_firstDayInView,ThisItem.Value,Days) = MM_Cal_selectionDate,
    UpdateContext(
        {
            MM_Cal_selectedCount: 0,
            MM_Cal_SelectionDate:Blank()
        }
    ),
    UpdateContext(
        {
            MM_Cal_selectionDate: DateAdd(MM_Cal_firstDayInView,ThisItem.Value,Days),
            MM_Cal_selectedCount:  1
        }
    )
)

Basically, this OnSelect firs checks if user clicked on a date that is in this Month, if not then do not assign value. Then it checks if the selection was already made AND if user selected the same date, then it just removes the selected date.

Finally, if none of the above applied it selects the date and assigns it value.

[Anonymous]

Yes! I can absolutly make this work. Thank you so much!

[KReyes]

Hello,

I am trying to reproduce this and is not working for me (I am new working with power apps, it may be a mistake from my end). I have the calendar view set up, but I can not figure out how to filter the second gallery  to show the events for the selected date. What is MM_Cal? If is not too much trouble could you elaborate?

[Anonymous]

Hi @KReyes

If you want to have a gallery with a list of all events on selected day and already have a working callendar. Filter that Gallery with something like this:

Filter(_EventsDataSource,Date = MM_Cal_selectionDate)

MM_Cal is my own naming convention for variables to not get lost. MM stands for Main Menu, Cal stands for Calendar. I have a lot of calendars in this app that is why my variables have the MM_Cal prefix in this example.

[Anonymous]

Thanks for answering his question. 

[Fakhri]

"If your datasource/collection for tasks has a date field which is only one date you are all set to do this. If your task list have a date range (few dates for one task) you will have to split it into each individual day, let me know if you want a function for this."

Good day @Anonymous,

I was wondering if you could share how to achieve a calendar view with date range obtain from a datasource which has a start and end date. Appreciate your advice sir