FrameDemo.swift

import SwiftUI

struct Frame: View {
    
    @State var isSimple = false
    
    //simple
    @State var width: CGFloat = 100.0
    @State var height: CGFloat = 100.0
    
    /* 参数设置必须遵守的原则：min <= ideal <= max
     此外，如果在给定维度中没有指定最小或最大约束，则框架将采用该维度中其子元素的大小调整行为。如果在一个维度中指定了这两个约束，则框架无条件地采用为其建议的尺寸。否则，任一维度的大小为：
     
     1. 如果指定了最小约束，并且父视图为框架建议的大小小于此视图的大小，则建议的大小不得小于该最小值；
     2. 如果指定了最大约束，并且父视图为框架建议的大小大于此视图的大小，则建议的大小不得大于该最大值；
     3. 否则，使用视图应有的尺寸大小（参见前面所列出的视图如何决定自己大小的类型）
     */
    //full
    @State var widthMin: CGFloat = 10.0
    @State var widthIdeal: CGFloat = 100.0
    @State var widthMax: CGFloat = 250.0
    @State var heightMin: CGFloat = 10.0
    @State var heightIdeal: CGFloat = 100.0
    @State var heightMax: CGFloat = 250.0
    
    @State var alignmentIndex = 0
    @State var alignmentsStr:[String] = [".center", ".leading", ".trailing", ".top", ".bottom", ".topLeading", ".topTrailing", ".bottomLeading", ".bottomTrailing"]
    @State var alignments:[Alignment] = [.center, .leading, .trailing, .top, .bottom, .topLeading, .topTrailing, .bottomLeading, .bottomTrailing]
    
    var body: some View {
        VStack{
            //demo
            VStack{
                if isSimple{
                    Text("Frame-Simple")
                        .frame(width: width, height: height, alignment: alignments[alignmentIndex])
                        .background(Color.orange)
                }else{
                    Text("Frame-Full方法方法付方法方法付方法方法付")
                        .frame(
                            minWidth: widthMin,
                            idealWidth: widthIdeal,
                            maxWidth: widthMax,
                            //                               minHeight: heightMin,
                            //                               idealHeight: heightIdeal,
                            //                               maxHeight: heightMax,
                            alignment: alignments[alignmentIndex])
                        .background(Color.orange)
                }
                
            }
            .frame(width:300, height:300)
            .background(Color.gray)
            
            
            //param control
            VStack{
                Toggle(isOn: $isSimple) {
                    Text("isSimple") 
                }
                if isSimple{
                    MSlider(title: "Width:", minValue: 10, maxValue: 250, value: $width)
                    MSlider(title: "Heidth:", minValue: 10, maxValue: 250, value: $height)
                }else{
                    MSlider(title: "minWidth:", minValue: 10, maxValue: 250, value: $widthMin)
                    MSlider(title: "idealWidth:", minValue: 10, maxValue: 250, value: $widthIdeal)
                    MSlider(title: "maxWidth:", minValue: 10, maxValue: 250, value: $widthMax)
                    MSlider(title: "minHeight:", minValue: 10, maxValue: 250, value: $heightMin)
                    MSlider(title: "idealHeight:", minValue: 10, maxValue: 250, value: $heightIdeal)
                    MSlider(title: "maxHeight:", minValue: 10, maxValue: 250, value: $heightMax)
                }
                
                Picker(selection: $alignmentIndex, label: Text("Alignment")) {
                    ForEach(0 ..< alignments.count){
                        Text("\(self.alignmentsStr[$0])").tag($0)
                    }
                }.pickerStyle(SegmentedPickerStyle())
            }.padding(10)
            Spacer()
            
        }.navigationBarTitle("Frame")
            .navigationBarBackButtonHidden(true)
            .navigationBarItems(leading: Text("LeftButton"), trailing: Text("RightButton"))
        
    }
}