Full screen calendar with horizontal scroll on months.

[sethi-ishmeet]

Hi, I am evaluating multiple SwiftUI Customizable calendar libraries to use with my new app. I would want to achieve something like this image below. Would it be possible to achieve this using ElegantCalendar? If yes, what's the path should I be taking to do this? Happy to contribute as well if something is missing.

Thanks in advance.

[ThasianX]

If I'm being honest, the way that calendar is designed from a designer perspective doesn't make sense. The way ElegantCalendar does it is that when you click a date, you can add your own accessory view that shows below the calendar. For your case, you would probably want to use MonthlyCalendarView as it seems that you don't need a yearly calendar. This library currently doesn't support horizontal scrolling but it's not hard to support. If you want to contribute, it'd be pretty easy and I'd appreciate it. I think in MonthlyCalendarView, the view it uses is ElegantVList, which is basically vertical paging. You could add an axis to the configuration such that it would either use ElegantHList or ElegantVList depending on what's provided.

[sethi-ishmeet]

Thanks for the suggestion. Let me go look at the repo and I'll try to open a PR this week.

[sethi-ishmeet]

@ThasianX Can you help me with setting up the package project? I haven't worked on a Swift Package before. How should I open the package in Xcode? and then how should I run it in the app to test my changes?

[ThasianX]

Good question. Open Package.swift on Xcode 11 and you should be able start editing the source files with code completion. To test your changes, open the example project that directly references the local package. For better flow, you can edit the source files directly inside the example project but you may not get code completion. If you want to run it on your phone, you’re going to have to edit code signing else the simulator will do

[sethi-ishmeet]

Thanks @ThasianX for the detailed steps. I am able to make the monthly view work with Horizontal scroll. But to achieve that, I had to change the pagination between yearly view and monthly view to vertical. Please look at the gif below and let me know if this is acceptable.

[sethi-ishmeet]

Also, I'm unable to push a branch to this repository to open a Pull Request. Can you help me with the process to open pull request?

[ThasianX]

@sethi-ishmeet Yeah I guess that's fine. A horizontal paging yearly calendar view makes more sense tbh. To make a PR, u need to first fork this repo. Commit whatever changes u made in that fork. Push that up to your fork. Then go to your forked repo page on Github. You will see something like new branch. do u want to open a pull request. So click that and Github should guide you.

[ThasianX]

Also, thank you so much for taking the time to help out. You only learn by doing!

[sethi-ishmeet]

No worries. I have created a Pull Request.

[maray29]

Is it possible to preview the views in the source files? For instance Source -> Views -> Monthly has WeekView.swift with a preview setup but when either Package.swift or Example project open, the preview is not working with "active scheme does not build this file" error. I tried to google to find a solution for this but without success. It's a related question so I thought to ask here.

[ThasianX]

@maray29 There really is no good solution with Xcode 11. Xcode 12 does have a feature like that but unfortunately Xcode 11 doesn't. And the reason the views have previews is when I was first developing this library, it was just an xcodeproj. Made it easier for me to test every single view. I didn't know that making it a Swift Package would actually break the previews until I actually did it so lol.

[maray29]

@ThasianX thanks, I will try with beta4, seems it was fixed in the latest update. As a beginner it is very helpful to see the preview to understand what the code does, that's why I was trying to make it work.

Could you please point me in the right direction for creating a week view that displays the current week? I saw that in the source code there's WeekView but I cannot figure out how to recreate it in the project using the tools from ElegantCalendar library. Is it possible or it's necessary to change the source code in order to display the current week view?

[ThasianX]

@maray29 WeekView(calendarManager: .mock, week: Date()). Just make sure your Date is within the week range passed in.

[maray29]

@ThasianX thanks for your reply. I tried to use WeekView but it didn't really work. I ended up creating a WeeklyCalendarView (similar to Monthly and Yearly CalendarViews) and a separate WeeklyCalendarManager. Slowly I start to understand what the code does and learn a lot from it! Although I still cannot figure out how the background color is controlled. I can change it on MonthView but it still has a white background behind it. Is it possible to have a transparent background?

[ThasianX]

The background color is determined by whether the device is on light or dark mode. By default, the preview simulator is in light mode. I have this strict called DarkThemePreview where any views wrapped by it will have a black background. If u want other backgrounds, you can do like ‘.background(Color.red.edgesignoringsafearea(.all)’

[maray29]

I tried wrapping ExampleCalendarView with both LightThemePreview and DarkThemePreview and setting .background(Color.red.edgesignoringsafearea(.all) in LightDarkThemePreview.swift and it only changes a small top strip of background on YearlyCalendarView and no change on MonthlyCalendarView. Am doing something wrong?