Question

我是创建自定义视图的初学者。我尝试使用滚动视图和按钮创建自定义UIView，如下所示：

我在scrollView中添加一个视图（带有页码标签的视图），具体取决于页数。这应该是怎么回事？

目前它看起来像这样：

我的问题是如何将scrollview的子视图居中？接下来这个代码有什么问题？为什么我只能在视图中看到1个标签？而另一个并没有出现。如果在滚动视图中看不到页码，如何滚动到所选页面？

这是我的代码：

func addPageNumberViewWithCount(count: Int) {

        var pageNumberViewX: CGFloat! = 0
        let pageNumberViewDistance: CGFloat! = 10

        for i in 1...count {

            let pageNumberView = UIView(frame: CGRectMake(pageNumberViewX, 0, 30, 30))
            pageNumberView.backgroundColor = UIColor.redColor()
            pageNumberView.layer.cornerRadius = pageNumberView.frame.height / 2
            pageNumberView.layer.masksToBounds = true
            pageNumberView.clipsToBounds = true

            // add number label
            let label = UILabel(frame: CGRectMake(pageNumberViewX, 0, 30, 30))
            label.center = pageNumberView.center
            label.text = "\(i)"
            label.textAlignment = .Center
            pageNumberView.addSubview(label)

            // update x for next view
            pageNumberViewX = pageNumberView.frame.origin.x + pageNumberView.frame.width + pageNumberViewDistance

            // add view inside scrollview
            scrollView.addSubview(pageNumberView)


            if i == count {
                scrollView.contentSize = CGSizeMake(pageNumberViewX + pageNumberView.frame.width, 30)
            }

        }

    }

Answer 1

也许你应该有一个UICollectionView，每个按钮都有一个单元格。这是一种更好的方法，当屏幕旋转并改变宽度时，你可以再次将它布局。

这些单元格将向左偏移布局。你可以这样解决：

let pageNumberViewTotalWidth = 30 * count + (pageNumberViewDistance * count - 1)

self.collectionView.contentInset.left = (self.collectionView.frame.size.width - pageNumberViewTotalWidth) / 2

标签未显示，因为您将其框架的x设置为与页码视图的x相同。它的框架应该是相对于它的超级视图，在这种情况下是pageNumberView。

Answer 2

你的第一个问题＆＃34;如何将scrollview的子视图居中？＆＃34;

解决方案：假设您总共有50页，并且您希望在滚动视图中一次显示5个页面。

然后制作10个相等宽度的子视图，其中每个子视图宽度将等于集合视图的可见部分

   self.view.size.width - 2*(width of toggle button)

然后在每个容器视图中添加5个以相等距离放置的pageNumberView

   lets pageNumberViewWidth = container.width/5 - 2*margin

   now pageNumberView frame will be (margin,0,pageNumberViewWidth,height)

以这种方式，在每个容器视图中，您的pageNumberViews将被平等放置，看起来好像您已将它们居中。

第二个问题＆＃34;为什么我只能在视图中看到1个标签？＆＃34;

答案：因为你设置的标签框不正确

  let label = UILabel(frame: CGRectMake(pageNumberViewX, 0, 30, 30))

这里label是pageNumberView的子视图所以你必须根据它的父视图是pageNumberView来设置它的框架，所以把它改成

  let label = UILabel(frame: CGRectMake(0, 0, 30, 30))

第一次是正确的，因为pageNumberViewX在第一次迭代后为0，之后它变成了一些正值，这使得它的帧向右移动但是它的父宽度很小，因此它对你来说是不可见的。

第三个问题：＆＃34;如果在滚动视图中看不到页码，如何滚动到所选页面？＆＃34;

为此，您需要找到所选页面的框架：

您可以使用用于创建pageNumberView的偏移量来完成此操作。

（每个pageNumberView的宽度）* pageNumber =所需pageNumberView的起始点。

  let frame : CGRect = CGRectMake(calculated offset above, 0,30, 30)
 //where you want to scroll 

  self.scrollView.scrollRectToVisible(frame, animated:true)

我希望这可以帮助您解决问题

编辑第一个问题

func addPageNumberViewWithCount(count: Int) {

            var containerViewX: CGFloat! = 0
            let pageNumberViewDistance: CGFloat! = 10


            let pageNumberViewPerSubview = 5
            var numberOfSubview = count/pageNumberViewPerSubview

            if(count % pageNumberViewPerSubview > 0){
                numberOfSubview = numberOfSubview + 1
            }

            var pagesLeft = count

            for i in 1...numberOfSubview {

                var pageNumberViewX: CGFloat! = 0

                let containerView : UIView = UIView(frame:CGRectMake(containerViewX,0,scrollView.frame.size.width,scrollView.frame.size.height))

                if(pagesLeft < pageNumberViewPerSubview){
                    for k in 1...pagesLeft{

                    }
                }
                else{
                    for j in 1...pageNumberViewPerSubview{
                        let pageNumberView = UIView(frame: CGRectMake(pageNumberViewX, 0, 30, 30))
                        pageNumberView.backgroundColor = UIColor.redColor()
                        pageNumberView.layer.cornerRadius = pageNumberView.frame.height / 2
                        pageNumberView.layer.masksToBounds = true
                        pageNumberView.clipsToBounds = true

                        // add number label
                        let label = UILabel(frame: CGRectMake(0, 0, 30, 30))
                        label.text = "\(i)"
                        label.textAlignment = .Center
                        pageNumberView.addSubview(label)

                        // update x for next view
                        pageNumberViewX = pageNumberView.frame.origin.x + pageNumberView.frame.width + pageNumberViewDistance

                        containerView.addSubview(pageNumberView)
                    }

                    containerViewX = containerViewX + scrollView.frame.size.width
                    // add view inside scrollview
                    scrollView.addSubview(containerView)

                    pagesLeft = pagesLeft - pageNumberViewPerSubview
                }






                if i == count {
                    scrollView.contentSize = CGSizeMake(numberOfSubview*scrollView.frame.size.width, 30)
                }

            }

        }

如何使UIScrollView的子视图居中

2 个答案: