Sobes.tech
Middle

Теңдөө деген эмне?

sobes.tech AI

AIден жооп

iOS өнүктүрүүдө тууралоо колдонмолору колдонуучу интерфейсинин элементтерин (UIViews) бири-бирине же алардын контейнерине (супервью) карата жайгаштыруу механизмдерине тиешелүү. Төмөнкү негизги ыкмалар:

  1. Фреймдер (Frames): Ар бир View үчүн позицияны жана өлчөмдү (x, y, width, height) аныктоо анын супервью координаттык системасында. Жөнөкөй, бекитилген макеттер үчүн ылайыктуу.

    let myView = UIView(frame: CGRect(x: 10, y: 20, width: 100, height: 50))
    // myView ылдыйкы сол бурчтан (10, 20) орунда жайгашат.
    
  2. Auto Layout: Элементтердин жайгашуусун декларативдүү системасы, эрежелер (констрейнттер) аркылуу аныкталган, Views ортосундагы мамилелерди белгилейт. Адаптивдүү макеттер үчүн ийкемдүү, экрандын ар кандай өлчөмдөрүнө жана ориентацияларына ылайыкташат.

    • Констрейнттер: Viewдин касиеттерине чектөөлөрдү коюу (мисалы, leading, trailing, top, bottom, centerY, centerX, width, height).
    • Констрейнттин артыкчылыгы: Сандык мааниси, конфликттерди чечүүдө маанилүүлүгүн көрсөтөт (1-1000).

    Мисал:

    let myView = UIView()
    myView.translatesAutoresizingMaskIntoConstraints = false // Auto Resizing Maskти өчүрүү
    superview.addSubview(myView)
    
    NSLayoutConstraint.activate([
        myView.leadingAnchor.constraint(equalTo: superview.leadingAnchor, constant: 20),
        myView.trailingAnchor.constraint(equalTo: superview.trailingAnchor, constant: -20),
        myView.topAnchor.constraint(equalTo: superview.topAnchor, constant: 80),
        myView.heightAnchor.constraint(equalToConstant: 100)
    ])
    

    Башка мисал:

    let myView = UIView()
    myView.translatesAutoresizingMaskIntoConstraints = false
    superview.addSubview(myView)
    
    NSLayoutConstraint.activate([
        myView.centerXAnchor.constraint(equalTo: superview.centerXAnchor),
        myView.centerYAnchor.constraint(equalTo: superview.centerYAnchor),
        myView.widthAnchor.constraint(equalToConstant: 200),
        myView.heightAnchor.constraint(equalToConstant: 150)
    ])
    

    VFL (Visual Format Language) колдонуу:

    let myView = UIView()
    myView.translatesAutoresizingMaskIntoConstraints = false
    superview.addSubview(myView)
    
    let views: [String: UIView] = ["myView": myView]
    let metrics: [String: CGFloat] = ["margin": 20]
    
    NSLayoutConstraint.activate(NSLayoutConstraint.constraints(withVisualFormat: "H:|-margin-[myView]-margin-|",
                                                               options: [],
                                                               metrics: metrics,
                                                               views: views))
    NSLayoutConstraint.activate(NSLayoutConstraint.constraints(withVisualFormat: "V:|-80-[myView(100)]",
                                                               options: [],
                                                               metrics: nil,
                                                               views: views))
    
  3. Автоматтык масштабдоо маскасы (Autoresizing Mask): Авто Layout алдынкы, жөнөкөй систем. Viewдин өлчөмү өзгөргөндө, ал кандайча кеңейип же кыскарарын аныктайт. Auto Layoutка караганда чектелүү, көбүнчө өчүрүлөт (translatesAutoresizingMaskIntoConstraints = false).

  4. Stack Views (UIStackView UIKitте, VStack/HStack/ZStack SwiftUIте): Контейнерлер, автоматтык түрдө өзүнүн балдарынын (arrangedSubviews) жайгашуусун жана өлчөмүн башкарган, белгиленген касиеттерге негизделген (axis, alignment, distribution, spacing). Линейдүү жана катмарлуу макеттерди түзүүдө жеңилдик берет.

    let stackView = UIStackView()
    stackView.axis = .vertical // Тартиптин багыты: вертикалдуу
    stackView.alignment = .center // Тартиптин багыты боюнча тууралоо: борбордо
    stackView.distribution = .equalSpacing // Просторду бөлүштүрүү
    stackView.spacing = 10 // элементтер ортосундагы аралык
    
    let label = UILabel()
    label.text = "Hello"
    let button = UIButton(type: .system)
    button.setTitle("Tap Me", for: .normal)
    
    stackView.addArrangedSubview(label)
    stackView.addArrangedSubview(button)
    
    superview.addSubview(stackView)
    // stackView үчүн констрейнттерди кошуу, аны супервьюгө жайгаштыруу үчүн
    

Тандоо макеттин татаалдыгына жана адаптация талаптарына жараша болот. Көпчүлүк заманбап тиркемелерде Auto Layout артыкчылыкка ээ, көбүнчө Stack Views менен бирге колдонулат.