How to build a macOS app for beginners (2023, Swift, SwiftUI, Xcode 15) - mac development course - العناوين المزدوجة
You want to make a Mac app but you don't know how to start?
I really like Mac OS, I personally started with iOS development.
But recently I got really into Mac development, especially since SwiftUI makes it very accessible for most people.
If you already know SwiftUI,
this is going to make the transitions quite easy as long as you know some of the tricks which I will show you today.
If you never have done any development for an Apple platform,
I would recommend you need to first get Xcode,
this is the software, the IDE that you need, I will link a video where you can get it.
You need to go into Swift, the programming language.
There's also a lot of material for Objective-C,
this the older version, especially if you want to go deeper and really fine-tune your apps with AppKit.
But for beginners, I wouldn't recommend this.
And also it takes a lot more time to learn and make apps with this.
So once you have Xcode, some fundamentals for surf, you can then learn about SwiftUI.
For this tutorial, I will assume some SwiftUI.
By the end of this tutorial,
we will have this small demo project which is macOS has a lot of apps if you want to make a native macOS app,
most of them are something to do with productivity,
for example here I'm making a task manager,
I'm going to go rather quickly for the data set up and setting up the views because I want to more focus on the specifics for macOS to give you a taste of what's possible and
you have some ideas where to look for.
Now with macOS you typically have a sidebar with a detail.
multiple columns here.
This is a specific view which is navigation split view that we are going to use for this.
I added here three groups of showing all the done task and the upcoming task.
Then as a test I added here also the possibility to add lists or groups because this is a little bit more data handling included
I'm going to make this very simple and only for the all section you're going to be able to change this to check here
The task is done
You can
also Change this
here Then some of the more specifics for macOS is for example keyboard
shortcuts I added here one for the new lists
So if I press comment A
you see I add your new list just add it something then something like right
click for deleting or duplicating or rename actions this is a lot like with
menus drop down menus I'll pop up with this kind of keyboard, a lot of the stuff is either on the toolbar.
So I added a plus button to create a new task.
And the search bar, for example, I can look for anything with the word crazy involved.
And then I close to the new C, all of that.
There's a lot of advanced search features, which I will not touch in this tutorial.
I put a lot of the other tutorials in the description, because I don't want to overwhelm you with all of the features.
At once, but you get an idea where to add and where to look for.
Other things that you might be interested in here are adding menus.
For example, in this case, I just added here a new menu for tasks.
And the buttoner didn't connect the button to this.
This is a little bit more tricky with SwiftUI, but they added some newer things which make it actually work now.
I did add a second type of window here with a dummy text for now.
You can also use right click into open new settings.
With macOS 13, they improved this quite a lot, so you can now have programmatically open new windows fairly easy.
And then something that every Mac app should have is a settings window.
So this is when you go under your name, under settings, you open this.
I didn't connect anything.
One thing you might want to connect is the possibility to add a menu bar.
So I just added here where we play in one,
more interesting is for example here, this from one of the task managers that I don't know that.
Take a look.
tick.
And you'll see you have here all recent ones directly accessible.
Super useful.
Other things might be adding widgets.
I don't persist any of the data, so this is really just dummy data.
But in the future video, I'm going to add data persistent, and we're using core data.
This is just useful because in this case, especially with this advanced searching, if you want to add filtering by dates.
All this is very nice with Core Data Connecting things.
Additionally, if you use Core Data together with iCloud Sync, you can allow the user to sync their data between different devices.
As long as you stay in the ecosystem,
a lot of users probably are either or,
I don't know if there's a lot of Android and Mac users, simply because they made the ecosystem connected.
Okay, now that you have of what Mac OS app you're going to build.
Let's start coding and create a project.
And I'm going to use here the Mac OS project template for app.
If you know you also want to have a companion iOS iPad OS app, you might as well choose your multi-platform.
This is also a very good idea to choose this if you want to later add subscriptions,
universe subscriptions, because then you can have a subscription that is shared between iOS and Mac OS.
I'm just going to go here for macOS to make it a little bit easier.
I'm naming this your task manager.
The interface is SwiftUI, language is Swift, I don't use any storage.
Now if you want to run this on the Mac, you need to have actually a developer account connected.
So going to the app,
target task manager,
and capabilities here,
you need to have a team used, otherwise you won't be able to build on macOS, but this can be a free developer account.
So just create one if you don't have one already.
Now we'll start to create some data.
And the first step, then we create the views, and then I will connect it in the app.
So see more make specific a little bit later.
If don't want to go through the setup phase of the models,
you can just go in the link in the description and download the project.
Okay.
So, I am...
going to create a new group for model and the two model files that I need to handle my data is one
Type is for the actual task,
so this is the struct identifiable,
which means I need to have an ID,
let ID is a UUID, then I need to have a title, so what are we showing, what do we have to do?
This is a string,
and I should change this to a var because the user might want to change the title,
then a var for is completed, this is a bool, then the U date, date until we have to finish our task of type date.
And you can also add more information for this task,
for details,
description, this is string, maybe even, optional, then let's just create an init and already created
here this default value of null for the And the completed is completed.
I to have a default of false because in the, I guess if you create a new task, it's not completed.
Okay.
Then to work with the previews in SwiftUI, I'm going to create some static, some dummy data to just join our app.
So this are static functions.
One, for example, where we create only one task instance.
Title image.
By milk then the due date.
I'm just going to show you shortly to use the calendar current instant
If you want to create a date that is in the future not just the current date
Date by adding to and I want to add a okay, so date which is the current date So I'm adding to the current date.
So this is new essence To the date component and this is I need to force a
notice I need to handle this and I'm using your force and practice because this is anyway and only inform my dummy data
So this creates me a date that is two days in the future.
Then I am just going to create a Example step function that creates me a task array.
This is for the list to show something there.
Before I do this, I'm also adding here a default for my due date.
And I also added a couple that is completed to true.
Let me have some variations.
Okay, this is the first model file.
I'm creating a second one for task group, again a struct task group identifiable.
ID is a UUID this again has a title or type string you can also add something
like creation date this is more interesting for sorting so maybe I should
not actually need to I wouldn't actually use this here or the title should be a
bar then the main thing is that the task group has some tasks connected so
the it has a property tasks of array of tasks let's write an init and the creation date is the current And actually,
I don't want to pass this here.
I am simply setting this in initializer.
And I'm also adding here a default value of an empty array for tasks.
OK, let's do the same and create static functions for one example instance of my default value.
task group.
And then a second one, for examples, which is an array of task group.
So in this case, I create three tasks, then an instance of a group.
And then I just had this three tasks to the group tasks, and return this group.
Then for the array,
I'm just going to,
the first one is the group that we just created and then I'm creating a new one with new list and I return this as an array.
And then the last thing I actually want to do is for my sidebar,
I have different sections that I want to let the user select and for this I use an enum.
So this is a new file, Swift task section.
So enum, task selection, identifiable.
So I have three cases, the all.
the done and the upcoming and then a case with a specific list.
Okay, now I need to, it complains about my ID.
I will turn your string.
This is a little bit more complicated because I choose your this type.
So switch self.
Oh.
Done.
Upcoming.
And then last case I used a UID string.
Then I need to have some display names that I show on the sidebar.
So where this play name string, again a switch self.
So I have here all.
done upcoming and in this case I used the task groups title.
Then I also need to have some icons, so this is icon name string.
This creates I show a star for all a check mark for done upcoming a calendar icon and for list it's the folder again.
I need to add a little bit more here, for example, I wanted to make this case iteratable.
This is again a little bit complicated because of the tasks.
I'm this down here.
I started about all cases and in this case I just return all done and And last,
because I need to use this with the selections, and it needs to be hashable, adding the protocol steps.
So left-hand sides, ID should be equal to the right-hand sides ID.
So if I compare two task selections, they're equal when the ID is the same.
Maybe moving this down, and it's complete.
So let's just make task group also hashable and task also hashable.
Okay, now it's happy.
I can now do the more interesting things and work on the views.
I want to have a sidebar view.
This is in this case,
it's a video view, sidebar view, and then in the main content is a task Let's start with the task list view.
So main thing I want to show here is a task.
So need to have an array of my data.
Let tasks is an array of task.
And also the title string.
Now in my preview, for example, I want to show all Now I use the tasks example, so this is the array.
The content is a list with my tasks, task in.
So here I would then show a text with the tasks.
This is the default values that I created.
Additionally, to the text, I also want to show an icon if it's a done task or not, image from system name.
Let's have a look and go on the Xcode library and the icons.
for circle so I can simply use a normal circle and we want to toggle and decide what to
show depending on the tasks is completed question mark so if it's completed I want to show another
I can then for the non-complete case we actually circle large circle dot fill dot circle
now we have two different ones in here okay let's keep this for now
And we're going to add the interactive modifications later where the user can change the text and if it's Boolean or not.
If it's completed or not.
Going to the sidebar view.
So again, I start here with the list and one thing I definitely want to show is the task selection.
all cases selection in I'm using a label because I added already the
information in the selections display name and the selections icon name okay
now we have here this free icons If you want to see this more on the style,
you can in the preview add a list style sidebar.
When we put this together in the navigation split view, this would be applied automatically.
The next thing I want to actually show here is the user created groups.
So let user created groups,
task group is an array of task group,
adding in this in the preview task group dot example, so it's an array, because now I have here another data for even for each.
user create a groups group in
And let's also use a label with title and this is the groups
Title and the system name is folder now everything is shown together in one list if you want to have
sections With a title
this is for example favorite I am using the 4hst content of each of the section
and then another section for the user created ones your groups.
Next thing I want to actually do is select something here.
List has selection property and I need to have a state property for
this as they're private or selection task selection for example you can start with
all cases then I use the selection property with a binding now here to my
selection this is not working because sometimes it doesn't record recognize the selection.
So I need to add here a tag with the selection.
See, no, you can select something.
I also have to do this with the second section.
So this is a tag with my task selection.
I use here list type and use this group.
I probably should not have made list in groups.
Okay, now this is good.
We can select something here and I want to now bring everything together in the content view with a navigation split view with sidebar in detail.
So the sidebar is the sidebar.
And the detail is the task list view.
As you see, I need to have here some data that I'm showing.
I am going to create another property here for this user created groups.
And state, private, more user created.
And again, I'm using here my dummy data.
Then for my task list view, I need to change what I'm showing here.
I actually selected in the sidebar view in order to know this.
I actually need to have the selection.
So need to pass this information one level higher, which means that it cannot be here state.
I have to change this binding and copy this because I need this.
Anyway, so this becomes a binding bar selection of type task selection changing this in the preview constant of all going back to the content view.
Now here I paste in my selection state that I get here.
So binding selection.
Now for the detail, it depends what I selected here.
selection statement.
If I have a list, I can use this and use the task group's title and the task group's tasks.
Now I need to show you something for all done and upcoming.
I don't really want to make this too complicated, so I'm going to trick the system and show some damage.
So at stage private bar all tasks and this is my examples array, so task this view All tasks then in the other two cases.
I'm going to filter this This is really just for our demo project to and I want to make this too complicated
So I'm filtering this here by saying only if the task is completed and the upcoming
I'm also doing this filtering but by saying it's not completed.
Let's test this and the all case I see everything done.
I see the done once because it's the it has the dot and upcoming as the Not done once
and then going to personal this is the one I create the other ones and the new
list doesn't have any so this is looking somewhat working we have some
information showing let's now add a little bit more interaction And the first one is here on my sidebar,
I want to add a button where it says new list,
which means in my sidebar list, here I need to add this on the bottom.
If you add this in the list,
it will be in the end of the list,
but if you add more groups than it just the user wants,
I want to make sure the user always sees it and not just when they're scrolling.
So I'm not adding this inside the list.
I'm using a trick to use the safe area inset, dot safe area inset edge button.
On iOS you have a two bar placement of button bar but on macOS we don't have this.
Okay, let's add a button, action and label, so it's down there, and the label title, and group.
with a plus dot circle.
Now macOS per default adds a border in the background to the button style so you can over change this to by using a button style of borderless.
This is not gray and then I can change the foreground's color to the accent color which I is using here the default one.
If you want to change this you can just go in the assets cutter look choosing this and going for this kind of color.
If I look at the preview and the content view you see it is very much on the bottom.
I'm going to use the pin function of the previews as this which means even if I move to the sidebar view.
I still have this preview, you can always go back to just the sidebar.
This is nicer to do, so I'm adding here padding, and I actually want to move this to the leading edge.
So I use a frame maximum width of infinity with an alignment of leading.
Okay, now the placement is great.
I have a nice styling, but what I actually want to do is do this properly.
So let's say I create here a new group and the user presses by creating a task group
with tight nail group and then I need to attach this to the
This that I'm showing here to the user created views user created me task groups append my new group
This is complaining because I it's not mutating Yeah,
and in order to make this mutating I need to again here use a binding so simply similar at binding bar.
We have to change this in for all of the initializers.
So I have to now use a constant for the binding, creating a new binding.
And in the content view, I also have to pass this as a binding now.
Okay, let's try.
I press here and add group and it is changed and we create here new groups.
Now in order to actually modify them,
in the sidebar view here I need to, instead of just showing a label, I want to show a text.
So I am creating an image stack with an image,
I still want to show the image of folder and then a text field new group with a binding to the groups.
Now this is going to cause problems,
because I don't have a year binding currently in this for each,
so we have to modify this by saying the for each works with binding to users,
user credit groups, and then I get here the binding back.
See, okay, sometimes the preview doesn't want to clean, clean the task.
Okay, now when I tap twice, I can enter the text field and change the type.
It doesn't continuously change it here and this preview, I need to go to the content view.
This is because I use the constant, so I add a new group changed.
Now this is working properly.
I am going to add here a keyboard shortcut in a little while, when we talk more specifically about the macOS stuff.
Before that I want to make this list here editable.
And because in the content view, I'm passing this here with this switch case and this direction.
This is a little bit more complicated to do the filtering.
So I'm going to create a second version of the task this view.
I was thinking I'll use the new observation framework,
but then again, if you run this on Mac OS, you to have the new Mac OS 14 instead.
you have, it's probably say it was safe for this way.
And then since I'm going to in the future use core data,
this is going to be a lot easier, you will see one of the reasons why core data is nice in this case.
Okay, so this task list here is just going to be the static one.
I am going to refactor and rename this to static taskless view and then we're
writing a new one
for Task list view similar to be for I'm going to copy the contents now one of the difference is that I want to change
Edit my task here.
So this needs to become an ad binding Well,
then we need to change this in here all Constance for task now the first thing I want to be able to do is actually add here
new tasks.
So using the toolbar to add a button, action and label with the label being and new task.
and the icon is plus.
So default is showing it on the trailing side of the window.
The nice thing with Xcode 15 that I'm using is that in the preview you can now see the window so you
directly see where the toolbar placement is.
Thank you whoever implemented this.
What's really nice?
Now the action I wanted to do is here tasks append creating a new task.
So this is not working in the preview because I again here I have a constant
array So I can modify this in order to see this
I need to use the task list view for my content view because of this filtering I can't use it for the other cases here,
but I can use it for the all case all and then using here binary all tasks so going to if you change if you go now to the all selection we have this plus button
and when you add here one it shows up later maybe you would need to do some programmatic scrolling otherwise the doesn't see it.
or also some focus management,
which I'm not going to touch, so you can make a text field active before we actually have this text field.
If this focus, I need to actually move from a label here to a text.
I want to actually modify whatever is in here and because I also want to show you some
other features I'm going to use create a new sub view this is new file task view I
want to modify something in here so this needs to be again a binding more task and
then in the preview let's create pass a constant from my example task.
Okay, I start with an h tag.
Basically, I wanted to modify what I already have here.
So let's grab the hidden image and the text, adding any preview or padding.
Unfortunately, I make a mess.
You don't have a plus button to zoom in.
I don't know why they didn't do it.
But anyways, one thing I want to do is when the user tabs on this icon, I want to toggle the state.
So I use a tab.
on tab gesture, performing.
And I wanted to do for this task, I'm going to change it's completed property by gently toggling it.
And the other thing is I'm changing the text to a text field new task.
And the binding is to the tasks
title now on Mac OS the text field has a border on the background you can change this by saying
plain text fields now okay let's test this and the task list view
so I am going to replace this h tag with my task view for this task where I need that binding Same thing as before,
instead of when I used it for each web binding,
I'm just making passing here the binding,
I return the binding,
I'm to do the content view,
let's test this in the alt section,
I select one of these on the icon and then I go to the done section and these are still there.
On iOS you would need to actually increase the touch target to make sure that you can actually not just but use as we have a mouse
We can make things very small So I don't have to here make this icon super big.
Okay now.
Let's see how everything works together By actually building this project.
So we have now a nice sidebar for the all section.
I can edit something I can add a new task and change the name to Buy cat food which I have to do today.
This the basics.
You can also check this and run this on iOS Okay,
and now I have to add this target going to task manager targets General supported destinations Then I add here one,
using the iPhone, an Able, and now I can choose an iPhone target.
I just realized that when you're choosing iOS, list is going to complain because it doesn't want to use.
That is because it needs to be an optional.
So I had to make here my binding selection optional and also my content view here, this also optional.
When you launch the app like this, you will see first the this list, somehow currently my simulator gives me problems.
Usually it would be the full height
Because I already I because here I started with a selection of all and will first show this view
And I guys I probably don't want to show anything so I would start with no That's why it has to be optional.
Like this, we start with the first view.
If I tap no on one of the section, I go to the detail showing all the tasks that are in this selection.
Now I'm going to leave here this optional.
This is one of the differences between macOS
where you want to have master and detail and you can always show for something in the detail whereas on iOS,
you have the stacks, is this used instead?
Because I'm going to continue working on it.
I'm going to make it a little bit simpler and keep the all selection, but as you see it's fairly easy to adapt for iOS.
Okay, let's now continue implementing some of the interesting features.
For example, search I want to have here search text field in the toolbar.
And you can do this with a searchable modifier.
I'm going to attach this here to my sidebar, and I need to have your binding to a search text here.
So again, I state private log search term string.
starting with an empty and now I can use this here.
This is per default added to the tool bar on the trailing side.
You can also modify this here with the additional parameter of placement.
For example I can say sidebar and now it's moved to the sidebar.
In this case it makes more sense in the tool bar because I want to filter all my tasks.
So I'm just going to remove this.
You can also move the position of this outside of the navigation view.
Searchable has a lot of advanced things like tokens and scope.
I will link some resources for this in the description.
I also have a tutorial for search.
Now I am going to make it go out quickly and we're going to filter the old tasks.
So depending on if I actually have a subject field,
if my search term is empty,
then I'm using the default selections that we int head and else if I have something that
I can filter I use something similar here with this filtering.
Only in this case, I use the title contains my search term.
Okay, let's try if I select something with crazy,
you see it searches and if I clear my text field, it goes back to show all so this is in this case.
There's a lot of other filters you could apply,
for example, instead of using here this done and upcoming, As a separate section, you could also add your filter options for this.
It's probably useful to have multiple filters included.
For example, you can use tokens to search for multiple terms in the text.
So something that contains crazy and that contains world.
this one.
Although we have search on iOS, I think it's even more important on macOS.
It's a productivity tool, you'd probably have a lot of data notes, you really want to allow the user to search more fine-grained.
Okay, now let's go to the more macOS specifics, for example keyboard shortcuts.
Here to my add group button in the sidebar,
I can add a keyboard shortcut, for key constant A with command, this be the keyboard shortcut command A.
I need to run this project now.
You see my mouse is not close to this button, if I press command I created a new group here.
Ideally you would add this kind of keyboard shortcuts not directly here.
On MacOS you would put it to one of these menu items.
Currently don't have any menu item for adding a group so let's have a look at how to add these menu items.
Many depend on each of these windows.
So, I have to go to my main app.
To this window group, you can attach a command modifier.
So, command menu means you're creating a new menu.
Maybe I'm just going to use this in this case.
This be task and adding a button, title this is add new.
Okay, let's see where this adds it.
You can also add your multiple, for example, after addition.
This is, for example, new items, maybe I should rename this different add new tasks.
One a new task, and which is...
Okay, let's see where these two are added.
So I have here new menu with add new task.
So this is the new commands menu that I created and the other one where I said new after replacement
you see now I have here add new group.
This is the one that this are the two cases either you add it to a specific place already or you create a new menu.
If you want to have your sub menus like autofill here it is, then you just use a Swift UI menu inside.
You can create as many as you want to.
You want the keyboard shortcut shown here like here undo command Z.
You need to append the...
keyboard shortcut to this menu item.
So instead of adding it here to this button, I would need to add it here.
Where did I add this?
Here is this keyboard shortcut.
Let's just use a different one of R.
Need to be a little bit paying attention to this because there's already quite a view that are taken.
So where did I add this here to task?
We'll see this keyboard shortcut coming up.
How you connect this data from your menu to your main window?
This is a little bit more complicated.
I'm not going to go into detail now, because this was one of the main issues with SwiftUI.
The one that I think works very well is now the newer property that pervitch is focused object.
This is, for example, if you have your view model and one of your views, this one you can then directly access.
So they added this for Mac OS 13.
It wasn't there for the laptop DC 2022, that's why you might not have heard of it, but it's very useful.
full.
The other one that you might want to look as is focused binding.
This is a little bit tricky because sometimes you want to toggle if it's enabled or disabled.
This works together with the modifier focus scene value.
It's a little bit more complicated because you need to attach it to the right views.
Additionally, you might want to use menu.
So for example,
in my sidebar view, here to my folder, the ones that the user could create, I want to actually allow them to delete them.
And you can use a context menu.
You also use a menu.
This would be done in a dropdown menu or pop-ups.
But context menu is just easier.
and generated here free text.
Let's try if you right click only let's just take out these menu items okay now if you can right click on one of these elements and you see this drop-down
menu They are looking disabled because I use your text and it automatically expects buttons.
So if you move to a button of saying delete,
destructive role, and then you want to delete this group from this list, if let index is.
user created groups dot first where this ID is equal to the groups ID,
then I can remove from the user created groups at this index.
instead of directly deleting this you could also show alert or confirmation
dialog this is first index okay let's try right-clicking delete and again it
doesn't do it because I am here my static things I'm just going to run this
now I create a new group right-click and it deletes this.
You can add more context menus with multiple subdivisions.
Sometimes request I found that a lot of the problems I
get is with multiple gestures because now I have your text field selection so sometimes it's just especially here.
It might not take my right click directly, so you need to be a little bit more aware of the competing gestures.
If want, you can also add this kind of context menu to the...
to hear my tasks to delete them because I didn't actually add this.
On iOS,
and this is what we don't have,
or edit mode, we don't have this on macOS, and instead of swipe on delete, you use kind of context menus.
One of the specifics for macOS, if you are serious about an app for macOS.
I recommend going for the human interface guidelines for macOS.
Then one of the newer things for macOS 14 that I know added is in the inspector
So this is for example here on Xcode I have here this inspector.
There can see more details.
A of the a lot of the times you probably want to have this kind of inspector earlier.
The thing is on macOS's this side.
in the detail view shown and on iOS this is the pop-up which is probably expected behavior.
So let's quickly do this and this inspector depends on the task So I'm going to use the task list view.
Similar to all the other pop-ups or alerts, you use a modifier in Spector.
Now I'm using your Macos 14.
If you are on a lower version, you probably leave this out because you can't test it.
I need to have a constant saying if I present this in Spector.
I thought it was just a nice addition so that's why I'm showing you at state private bar inspector is shown,
boom, false, and this is inspector is shown, and then I need to actually have you as something to draw in the inspector show some
detail.
Since I have here this inspector, I to actually toggle this inspector shown property.
And I'm going to use the toolbar.
Now we can use your toolbar.
item group with placement item group so I can place two of them in there so the
other one is inspector is shown toggling this show inspector and then let's just
check what I can do use is it something with sidebar yeah something like one of
these let's test this I have here now is additional button
In fair tap you see it opens the sidebar the first time it's having some issues with the animations and it's also
not Ideally here with this I would prefer to have this kind of line all the time
It's not sure how it's going to look as when it's released with Mac OS 14.
So maybe this is changing a little bit Okay, this is great now.
I your details area, but I need to show something.
And what I wanted to do, it's also not expendable, we need to talk about this.
And what I wanted to do is I'm going to add here a with more where we can show and hide this inspector.
In my task list, here for I want to have a button saying more is it just because here's my little more button.
Now what do I want to do?
I need to have a way of passing this information one level up where I have the inspector.
I try to add this vector here but then it was just weird.
I need to pass the selected task up, similar to before, but I also have it binding, I have now a selected task.
This is optional because maybe I don't have anything selected, fixing using the preview constant.nil.
When press on this button, my selected task becomes this task.
Then I go to task list where I need to have a property for selected task.
This is a state private bar because this view can open.
I'm only managing from here, where it's set in my task use, and where it's shown here in my spectrum.
So this is a task optional starting with nil.
Now I can pass this down to my use, selected task, and I finally have something here in my inspection.
If let selected task else, the else case is known, nothing selected, okay, maybe I should use a more nice or placeholder.
Here I'm going to use the selected tasks title.
Okay, now if I press more, you don't see anything because I need to actually show and hide this.
This is another thing, probably my sub view here also needs to change the inspector is shown property to make sure it's shown.
So I go again to the Matask view.
This is another binding.
Boolean in the preview constant false and in this case when I press on the more button I can set show inspectors shown to true.
I don't want to toggle this I always want to make sure it's shown if it's already shown and I don't believe in mind.
So then back in my task view I can now use the Inspector is shown here.
Now I press on More, it opens the sidebar with this detail.
Maybe we do a little bit more here.
You also maybe show the dates, the descriptions that I never did more details.
So, tasks, there's quite a lot of possibilities to do this.
One thing that you might have already noticed is that I can't expand this.
On macOS you always have to add flexible frames so I'm going to use a group so I can add this around everything frame.
frame min width of 100 maximum of infinity now you can the user can extend this okay i guess i have to run this
you should add this kind of frames to the sidebar to the windows whatever you need so if i expand
the sidebar this one works sometimes this is a bit strange you need to add flexible frames around
everything other things that i actually did not do is How do you study window title?
Let's talk a little bit about windows.
For example here, I want to change the title of my window to the title that I have here and you use the navigation title.
Let's try this.
I am now in my selection of all and this title is set to all.
It goes to the task manager.
This the default a name could also because in these views I actually did not use the title then because I talked about windows
If you want to for example have different window types,
you can create another window group This is the title and ID is interesting if you want to do programmatically open something For example,
you want to open one of your tasks or one of your groups in a new window.
You could use the ID would be then one of your information or what to show.
I'm going to, I'm making this very shortly now, special window.
Don't use the ID.
And I show here a text of special.
window.
Now let's run this.
Now if you go on the file new, previously this was just new window.
This is the main window, the one that you first, that is first declared in your main app file.
Now you see I have my new special window.
We have here this information.
Some things that you can do.
adding frames, again for minimum width and maximum, sometimes I should probably like 200, 300, 200.
You can also Something like the window,
the default window size, the default window position, for example if you want to have it on the leading edge always, let's try.
Now if I go into a new special window,
it actually adds it,
okay I zoomed in a lot,
it adds it on the leading edge, but you get the idea, it's a little bit more fine control of what the size is.
Position the window style,
or the toolbar style,
if you don't want to have the navigation title, For some of your data views, you to have an extended toolbar area.
You can decide this, or resizability of content, minimum size, content size.
All of these are quite new, I think, for macOS 13.
Last, if you want to open programmatically new window, just to add to somewhere.
you have to use the environment for open window,
or open window, okay maybe I just do this here, but you wouldn't call open window with ID and value.
I this is the one.
The ID is the one where you use berry set in the window group.
What kind of window type you want to open this with, and then you can also pass an additional value.
For example,
if you want to say which task you want to open or which task you want to open, you would use this value type.
Okay, just going to remove this.
I'm going to show you this with the project and I actually properly set this up.
So here I have a free column navigation split view and then if you right click here,
you see I added the open a new window and now this one is opened as a separate window,
so this is another window type and there because it's a different window type,
you can add here different toolbar items and also the menu is a little bit different.
And as you see, I opened it at the trailing edge, so with a default size, you can do a lot of things with this.
The types I didn't actually talk about yet is the settings window and the menu bar.
So for example here, I added a very plain menu type.
And you can add here any settings the possibility to show this menu.
So now it's gone.
Now it's shown Similar to the other windows you do this in the main app for example the settings
is a settings group text Settings Usually,
you would use your tab view of the forms,
then you can use menu bar extra,
this is the title of menu, this is what's shown in these icons here, and then again, you can add here buttons, do something, me.
now for my app i have here under custom manager settings and settings window window okay i did not
add any flexible frames so this is the result what happens if you don't add frames so here this is
the frame infinity and max height infinity let's try so you can extend this again opening my settings and now I can extend this.
I probably should also set some minimum values and then here I have this new menu item with my do something amazing button.
Especially for productivity apps, you probably want to have this kind of menus.
This one menu from TikTok,
this is another task manager,
and this is a quick look at all the tasks that are inside that are available in a rather small form factor.
Like this, you can access it from anywhere within your workflow.
Other things you can also do is adding widgets now from across 14 on the whole skin that also interactable.
So this is great.
I did not look into this but I have to you can do stuff like on Hoover and you Hoover over certain things Then you reveal them for example
You can hide or more buttons when you hover over you can help add help tips
So this is when you hover over something and it shows a little information like here show library
Then there's a lot of working with the file system.
This is a little bit depending on what the file format is for example you might want to drag in an
image that you want to use in your app or you want to export a document style document all your lists of the information.
There's a lot of things for SwiftUI like file export or file importer modifiers and also the new share button.
which directly also works nicely on iOS.
I'm going to stop at this point.
You build a macOS app with some default data but you already saw a lot of the more advanced features how to implement this,
what to look forward.
For example adding menus to keyboard shortcuts, right-clicking on The settings window, which on iOS would be showing us a pop-up.
If you're interested in going more into details of really implementing all of these things,
I would recommend you to have a look at one of my courses which is for Core Data and macOS.
In this course, you will build a more complex app with Core Data.
I find Core Data, I useful, especially for Data.
because you it makes it easier to link things to create very complex relationship to search for the storage solutions.
I know there's with data but I wouldn't be able to build all this functionality in with Swift data that I can do with core
data for example here something like sorting My notes,
by certain status of archived draft or review,
this kind of sorting fetch request is not possible,
especially not with these nice animations, and some of these filtering options I can't just make this work here.
For example,
searching for something with an attachment,
which in this case is giving me all the notes that have an image that start with that have the term help in them,
so that would be the only this one.
This is an advanced filtering, searching option, all this navigation stuff, and for this, I found code data just to be much more fun.
So if you're interested, check out the course.
Otherwise, I will have another tutorial there from the current project that we have with
this, not to name data, we're going to use code data in this case, and you will see how it will improve our data handling.
And the content view where I struggle to pass all the data with the filtering and the bindings
Core data is a solution that you can use to store data on your device together with iCloud sync
You can also allow the user to sync it between different devices.
So go check that one
لغة الترجمة
اختر لغة الترجمة
فتح المزيد من الميزات
قم بتثبيت ملحق Trancy لفتح المزيد من الميزات، بما في ذلك ترجمة العناوين الذكية، تعريفات الكلمات الذكية، تحليل القواعد النحوية الذكية، التحدث الذكي، وغيرها.
متوافق مع منصات الفيديو الرئيسية
يوفر Trancy دعمًا للعناوين المزدوجة في منصات مثل يوتيوب، نتفليكس، يوديمي، ديزني بلس، تيد، إيدكس، كيهان، كورسيرا، بالإضافة إلى ترجمة الكلمات/الجمل الذكية، وترجمة النصوص الغامرة بالكامل، وميزات أخرى لصفحات الويب العادية. إنه مساعد شامل لتعلم اللغة.
جميع متصفحات المنصة
يدعم Trancy جميع متصفحات المنصة، بما في ذلك ملحق متصفح Safari لنظام iOS.
أوضاع عرض متعددة
يدعم وضع المسرح، وضع القراءة، وضع المزج، وأوضاع عرض أخرى لتجربة ثنائية لغوية شاملة.
أوضاع تدريب متعددة
يدعم تدريب الجملة، والتقييم الشفهي، والاختيار من متعدد، والاستماع والكتابة، وأوضاع تدريب أخرى.
ملخص الفيديو الذكي
استخدم OpenAI للملخصات الذكية للفيديوهات والتمسك بالمحتوى الرئيسي بسرعة.
العناوين الذكية
قم بإنشاء عناوين يوتيوب ذكية ودقيقة في 3-5 دقائق فقط.
تعريفات الكلمات الذكية
انقر على الكلمات في العناوين للبحث عن تعريفات، باستخدام تعريفات ذكية مدعومة بالذكاء الاصطناعي.
تحليل القواعد النحوية الذكية
تحليل قواعد الجمل لفهم معاني الجمل بسرعة واجتياز نقاط القواعد النحوية الصعبة.
المزيد من ميزات الويب
بالإضافة إلى العناوين المزدوجة في الفيديو، يوفر Trancy أيضًا ترجمة الكلمات وترجمة النصوص الكاملة لصفحات الويب.