add-content-resizing-sample
louisehsu 5 days ago
parent 10aa6f746d
commit d22877f79b

@ -2,54 +2,93 @@ import Flutter
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
showScollView()
}
func showScollView() {
let scrollView = UIScrollView()
scrollView.isUserInteractionEnabled = true
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .systemGroupedBackground
showStyledScrollView()
}
let stackView = UIStackView()
stackView.axis = .vertical
stackView.distribution = .fill
stackView.backgroundColor = .yellow
stackView.translatesAutoresizingMaskIntoConstraints = false
func showStyledScrollView() {
let scrollView = UIScrollView()
let stackView = UIStackView()
stackView.axis = .vertical
stackView.spacing = 12 // Spacing between the "cards"
let engine1 = FlutterEngine(name: "one")
engine1.run()
let engine1 = FlutterEngine(name: "one")
engine1.run()
for index in 1...50 {
if (index == 10) {
let flutterViewController = FlutterViewController(engine: engine1, nibName: nil, bundle: nil)
flutterViewController.isAutoResizable = true
addChild(flutterViewController)
stackView.addArrangedSubview(flutterViewController.view)
flutterViewController.didMove(toParent: self)
for index in 1...50 {
if index == 10 {
// This is our Flutter view
let flutterViewController = FlutterViewController(engine: engine1, nibName: nil, bundle: nil)
flutterViewController.isAutoResizable = true
addChild(flutterViewController)
// The Flutter view's background should be clear to see the card behind it
flutterViewController.view.backgroundColor = .clear
// Wrap the Flutter view in a styled container "card"
let cardView = UIView()
cardView.backgroundColor = .systemBackground
cardView.layer.cornerRadius = 12
cardView.layer.masksToBounds = true
flutterViewController.view.translatesAutoresizingMaskIntoConstraints = false
cardView.addSubview(flutterViewController.view)
NSLayoutConstraint.activate([
flutterViewController.view.topAnchor.constraint(equalTo: cardView.topAnchor),
flutterViewController.view.leadingAnchor.constraint(equalTo: cardView.leadingAnchor),
flutterViewController.view.trailingAnchor.constraint(equalTo: cardView.trailingAnchor),
flutterViewController.view.bottomAnchor.constraint(equalTo: cardView.bottomAnchor)
])
stackView.addArrangedSubview(cardView)
flutterViewController.didMove(toParent: self)
} else {
let label = UILabel()
label.text = "Hello from iOS \(index)"
stackView.addArrangedSubview(label)
}
} else {
let label = UILabel()
label.text = "It's me, iOS \(index)"
label.translatesAutoresizingMaskIntoConstraints = false
let cardView = UIView()
cardView.backgroundColor = .systemBackground
cardView.layer.cornerRadius = 12
cardView.addSubview(label)
NSLayoutConstraint.activate([
label.topAnchor.constraint(equalTo: cardView.topAnchor, constant: 16),
label.bottomAnchor.constraint(equalTo: cardView.bottomAnchor, constant: -16),
label.leadingAnchor.constraint(equalTo: cardView.leadingAnchor, constant: 16),
label.trailingAnchor.constraint(equalTo: cardView.trailingAnchor, constant: -16)
])
stackView.addArrangedSubview(cardView)
}
}
// --- Auto Layout Setup ---
scrollView.translatesAutoresizingMaskIntoConstraints = false
stackView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(scrollView)
scrollView.addSubview(stackView)
// Set constraints for the scroll view to fill the main view
NSLayoutConstraint.activate([
scrollView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
scrollView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
scrollView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
scrollView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor)
])
// Set constraints for the stack view within the scroll view
NSLayoutConstraint.activate([
stackView.topAnchor.constraint(equalTo: scrollView.contentLayoutGuide.topAnchor, constant: 20),
stackView.bottomAnchor.constraint(equalTo: scrollView.contentLayoutGuide.bottomAnchor, constant: -20),
// Inset the stack view horizontally for the grouped look
stackView.leadingAnchor.constraint(equalTo: scrollView.frameLayoutGuide.leadingAnchor, constant: 20),
stackView.trailingAnchor.constraint(equalTo: scrollView.frameLayoutGuide.trailingAnchor, constant: -20)
])
}
scrollView.addSubview(stackView)
scrollView.layoutIfNeeded()
self.view.addSubview(scrollView)
scrollView.translatesAutoresizingMaskIntoConstraints = false
scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
stackView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
stackView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor).isActive = true
stackView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor).isActive = true
stackView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
}
}

Loading…
Cancel
Save