UIImageView не прокручивается внутри scrollView

Question

Я создаю скролл-просмотр с контролем страницы. Я добавил скроллвью к моему viewcontroller и внутри скроллвью есть UIImageView. Но по какой-то причине я не могу прокрутить его влево или вправо. Может кто-нибудь помочь мне решить эту проблему?

Мой код:

    var tutorialImages: [String] = ["1", "2", "3"]
var frame = CGRect.zero

func pageControll() {
    pageControllTutorial.numberOfPages = tutorialImages.count

    for i in 0..<tutorialImages.count {


        imageViewTutorial.frame = frame
        imageViewTutorial.image = UIImage(named: tutorialImages[i])
        scrollViewTutorial.addSubview(imageViewTutorial)
    }

    scrollViewTutorial.contentSize = CGSize(width: imageViewTutorial.frame.size.width * CGFloat(tutorialImages.count), height: imageViewTutorial.frame.size.height)

    scrollViewTutorial.delegate = self
}


func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
    var pageNumber = scrollView.contentOffset.x / scrollView.frame.size.width
    pageControllTutorial.currentPage = Int(pageNumber)
}

Answer 1

С небольшим фрагментом кода, который вы показали, вы делаете несколько вещей неправильно.

Основываясь на этой строке:

imageViewTutorial.image = UIImage(named: tutorialImages[I])

это выглядит как у вас есть UIImageView, и вы устанавливаете его свойство .image 3 раза, вместо того, чтобы создавать 3 различных представления изображений.

Кроме того, в вашем коде нет ничего, указывающего, как вы устанавливаете кадры видов изображений.

Я настоятельно рекомендую использовать автоматическую компоновку вместо явных рамок - это значительно упрощает дальнейшие действия.

Вот полный пример. Это создаст квадратное (в соотношении 1: 1) представление прокрутки на 20 пунктов сверху, с отступом 20 пунктов на каждой стороне и UIPageControl ниже. Затем он добавляет горизонтальный UIStackView к представлению прокрутки. Это представление стека будет содержать представления изображения. После добавления представлений изображения представление стека автоматически определит «прокручиваемую область» - нет необходимости вычислять .contentSize.

Вот как это будет выглядеть:

Все сделано в коде, поэтому просто назначьте класс контроллера пустого представления для SlidesExampleViewController ... никаких @IBOutlet или @IBAction необходимых подключений.

class SlidesExampleViewController: UIViewController, UIScrollViewDelegate {

    lazy var pageControl: UIPageControl = {
        let v = UIPageControl()
        v.backgroundColor = .brown
        return v
    }()

    lazy var scrollView: UIScrollView = {
        let v = UIScrollView(frame: .zero)
        v.backgroundColor = .yellow
        v.delegate = self
        return v
    }()

    lazy var stackView: UIStackView = {
        let v = UIStackView()
        v.axis = .horizontal
        v.alignment = .fill
        v.distribution = .fill
        v.spacing = 0
        return v
    }()

    let tutorialImages: [String] = ["1", "2", "3"]

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = .white

        scrollView.translatesAutoresizingMaskIntoConstraints = false
        stackView.translatesAutoresizingMaskIntoConstraints = false
        pageControl.translatesAutoresizingMaskIntoConstraints = false

        view.addSubview(scrollView)
        view.addSubview(pageControl)
        scrollView.addSubview(stackView)

        let v = view.safeAreaLayoutGuide
        let g = scrollView.contentLayoutGuide

        NSLayoutConstraint.activate([

            // constrain scroll view to top, leading, trailing with 20-pts "padding"
            scrollView.topAnchor.constraint(equalTo: v.topAnchor, constant: 20.0),
            scrollView.leadingAnchor.constraint(equalTo: v.leadingAnchor, constant: 20.0),
            scrollView.trailingAnchor.constraint(equalTo: v.trailingAnchor, constant: -20.0),

            // constrain scroll view height equal to scroll view width
            scrollView.heightAnchor.constraint(equalTo: scrollView.widthAnchor),

            // constrain stack view to all 4 sides of scroll view's contentLayoutGuide
            stackView.topAnchor.constraint(equalTo: g.topAnchor),
            stackView.bottomAnchor.constraint(equalTo: g.bottomAnchor),
            stackView.leadingAnchor.constraint(equalTo: g.leadingAnchor),
            stackView.trailingAnchor.constraint(equalTo: g.trailingAnchor),

            // constrain stack view height equal to scroll view height
            stackView.heightAnchor.constraint(equalTo: scrollView.heightAnchor),

            // constrain page control width to 80% of scroll view width
            pageControl.widthAnchor.constraint(equalTo: scrollView.widthAnchor, multiplier: 0.8),

            // constrain page control top to 8-pts below scroll view bottom
            pageControl.topAnchor.constraint(equalTo: scrollView.bottomAnchor, constant: 8.0),

            // constrain page control centerX to centerX of scroll view
            pageControl.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor, constant: 0.0),

        ])

        tutorialImages.forEach { name in
            if let img = UIImage(named: name) {
                let imgView = UIImageView(image: img)
                stackView.addArrangedSubview(imgView)
                imgView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
            }
        }

        pageControl.numberOfPages = tutorialImages.count

        scrollView.isPagingEnabled = true

    }

    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        let pageIndex = round(scrollView.contentOffset.x/view.frame.width)
        pageControl.currentPage = Int(pageIndex)
    }
}

Answer 2

Увеличить contentSize вида прокрутки как (количество изображений * ширина изображения), ожидая, что все изображения имеют одинаковый размер.

int startPosition = 0; установить изображение origin.x

1 image1.frame.origin.x = startPosition; startPosition = startPosition + image1.frame.size.width;

2 image2.frame.origin.x = startPosition; startPosition = startPosition + image2.frame.size.width;

3 image3.frame.origin.x = startPosition; startPosition = startPosition + image3.frame.size.width;

или вы можете поместить их в a для l oop, чтобы установить размер кадра изображения.

Answer 3

frame каждого UIImageView устанавливается в CGRect.zero, поэтому все они имеют 0 высоту и ширину, что означает, что ваши представления прокрутки contentSize также 0x0. Что касается вида прокрутки, здесь нет ничего, что можно прокрутить от до .

Сделайте это вместо:

let image = UIImage(named: tutorialImages[i])
imageViewTutorial.frame = CGRect(x: widthSoFar, y: 0, width: image.width, height: image.height)
imageViewTutorial.image = image
scrollViewTutorial.addSubview(imageViewTutorial)
widthSoFar += image.size.width

Инициализируйте widthSoFar снаружи для l oop до 0.