ios – Align UI elements like iMovie app in SwiftUI


I am trying to achieve layout similar to iMovie app (screenshot attached) using SwiftUI on iOS but am stuck. The following are the issues:

1. Player View height: I am embedding player view in an HStack which comprises of two VStacks (left and right menu buttons). I am tentatively setting frame width and aspect ratio of PlayerView as follows but I think need to determine the actual width based on screensize (using GeometryReader perhaps), or is there any other way out? The height of VStack buttons menu should equal the height of PlayerView. I don’t know how to set this constraint as well.

PlayerView (player: player)
                        .frame(maxWidth: 400)
                        .aspectRatio(16.0/9.0, contentMode: .fit)
                        .background {
                            Color.black
                        }

2. Bottom Timeline height: Height of bottom timeline can change if additional menu is shown (as happens in iMovie app). This will also change the height of the HStack containing PlayerView in which case the HStack width should also shrink proportionately.

enter image description here

Latest articles

spot_imgspot_img

Related articles

Leave a reply

Please enter your comment!
Please enter your name here

spot_imgspot_img