我是创建自定义视图的初学者。我尝试使用滚动视图和按钮创建自定义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)
}
}
}
答案 0 :(得分:1)
也许你应该有一个UICollectionView,每个按钮都有一个单元格。这是一种更好的方法,当屏幕旋转并改变宽度时,你可以再次将它布局。
这些单元格将向左偏移布局。你可以这样解决:
let pageNumberViewTotalWidth = 30 * count + (pageNumberViewDistance * count - 1)
self.collectionView.contentInset.left = (self.collectionView.frame.size.width - pageNumberViewTotalWidth) / 2
标签未显示,因为您将其框架的x设置为与页码视图的x相同。它的框架应该是相对于它的超级视图,在这种情况下是pageNumberView
。
答案 1 :(得分:1)
你的第一个问题"如何将scrollview的子视图居中?"
解决方案:假设您总共有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将被平等放置,看起来好像您已将它们居中。
第二个问题"为什么我只能在视图中看到1个标签?"
答案:因为你设置的标签框不正确
let label = UILabel(frame: CGRectMake(pageNumberViewX, 0, 30, 30))
这里label是pageNumberView的子视图所以你必须根据它的父视图是pageNumberView来设置它的框架,所以把它改成
let label = UILabel(frame: CGRectMake(0, 0, 30, 30))
第一次是正确的,因为pageNumberViewX在第一次迭代后为0,之后它变成了一些正值,这使得它的帧向右移动但是它的父宽度很小,因此它对你来说是不可见的。
第三个问题:"如果在滚动视图中看不到页码,如何滚动到所选页面?"
为此,您需要找到所选页面的框架:
您可以使用用于创建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)
}
}
}