There's a behavior called (Behaviors > Basic Motion > ) Align To that can be used for various things:
(Don't take the dark edges the wrong way - I didn't quite line up the gif capture quite right. The animation is perfect.)
Thing is - you need some object to "align to" ! I used the Title Background in this example. You can use any kind of object that has a border or bounding box.
Usually Align To is automatically "snapped" to the alignment, but I set the Transition Parameter to Custom and set a Ramp behavior on the Custom Amount parameter. The Transition will go from a "default state" to the position of alignment over the Custom Amount range.
The example given by Rowie can be used for the exact same animation... setting up the alignments is a little more "manual".
For the flag arrangement, 3 rectangles can be used - two outside rects aligned to the center rect and all three have their Size parameters linked. Alignment is constant regardless of size changes:

Another option, the simplest actually, is to simply color a single Rectangle with a Gradient and use a Constant Interpolation for the gradient stops.
The Start X and End X are the edge measurements of the Rectangle (here — width = 1020). These values can be linked to the Rectangle > Object Attributes > Size > Width parameter (÷2) in order to auto-conform to size changes. (You can't use Object > Shape > Size > Width in the Link — different things are going on behind the scenes!)
There's really no one "right way" to do most things in Motion....
A note about Shapes in Motion, in general. Even if Outline is turned off, there is generally a 2 px offset between the painted fills of aligned shapes. These offsets generally have to be dealt with in Link and Align To behaviors.
HTH