Hi, Alex here from rebeloper.com and welcome back to the channel and welcome
back to this awesome tutorial series where you can learn how you can have
SwiftUI like elements in UIKit. You heard that right not the other way
around like UIKit elements in SwiftUI, but SwiftUI like elements
in UIKit and today we are going to talk about padding. So let's jump right into it.
Okay! If you haven't already done so go ahead and click the link down below
to get the resources and to get to know where you can download a DuckUI and how
you can add it to your own projects and yeah maybe just install it through
cocoapods and talk UI is always evolving so yeah as you can see let's just go
ahead and take a look at our pod file lock here. I just opened that if root
Xcode. DuckUI currently is with 0.1.53. Now I do know that
the current version is much higher than that so let's install the latest version.
Let's open up terminal here and type in CD and the space and just drag and drop
the root folder as usual of your project and type in pod update. Okay! And with that
we will be able to use the latest version. You should always if you are
following along and you can see that there is a newer version and go ahead
and update your code, okay. So today we are going to talk about padding.
Basically we are going to learn how to pad UIStackView or DStacks and
how to pair other elements and that is kind of what we are going to do because
they are all evolving around UIStackViews because once we declare one
of our elements we just kind of wrap it around a stack view. Now that we have
this done let's just take a look at the current version of the app. Let's see
here let's go into pods and as you can see here we have our new dependencies
and let's go to our root view controller and yeah let's just create, yeah let me
just change this because this has been changed to bind. So let's just create stack.
So what we want to do is grab our container here and create let say a
vertical stack will be okay and I will add in here some views. Let me just see a
hello DuckUI label and hello DuckUI label 2 will be just perfect.
Okay. There we go and I will add some debugs here so we can better see what we have here.
So debug, there we go. Okay! Let's just build and run and see how this
looks at the moment and then we are going to of course add in some padding.
And yeah this is pretty simple to use. Let's just wait for this to build and we
continue from that, okay. So as you might have noticed we need to add a spacer
here and if you don't know what a spacer is go ahead and take a look at previous
videos but yeah that is what will pump these two labels up to the top, okay.
And yeah that is it. So let's add in here a padding for our stack. So what you need
to do is type in a dot and a padding and as you can see here we have some margins
and let's just, this is an array of margins. So let's just add in here
let see all margins because why not and let's add an amount of 12.
Let's hit commands R and see how that looks. Real nice as you can see here we
have 12, 12 and 12. Maybe let's add some debug here so we
can really see this padding or let's see let's see if it does, yeah. There we go.
Because this is constrained to all of it, it goes all the way down and here is a
space or just so you know, okay. So let's remove this debug and let's add a
padding for our hello DuckUI label too. Now this is kind of the other way around
so we are not adding the dot notation. It's basically kind of simple. So what we
want to do is select our container and just add a view with margins and a
mount. So hello DuckUI label 2 and setting here our debug and the margins again
let's see. Let's add all. All margins and the amount of that's way 32 just so
it's be really large. So let's hit command R, oh we need comma here. So let's
hit command R again and did you take care of it and yeah, there we go.
32, 32, 32. So that is all you need to know about padding. How to pad stack view and
how to pad other elements. Well basically other elements are
incorporated in UIStackView. Now that is it for today I hope you enjoyed this video.
If you did go ahead and give it a thumbs up, subscribe to the channel and
hit that notification bell because tomorrow we will be talking about
another way and easier, even easier way to layout our views in our projects and
that is it with layoutless. So I will see you in the next one.