我们如何将 UIScrollview 的滚动指示器的颜色更改为蓝色、绿色等?
我知道我们可以把它改成白色,黑色。但除了这些颜色。
非常感谢
不幸的是,你不能,当然你总是可以自己动手。这些是您的选择:
UIScrollViewIndicatorStyleDefault:
滚动指示器的默认样式,黑色带白色边框。这种风格适用于任何内容背景。
UIScrollViewIndicatorStyleBlack:
一种黑色且小于默认样式的指示器样式。这种风格适合白色内容背景。
UIScrollViewIndicatorStyleWhite:
指示器的样式是白色的并且比默认样式小。这种风格适合黑色内容背景。
这是更安全的Swift 3方法:
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let verticalIndicator = scrollView.subviews.last as? UIImageView
verticalIndicator?.backgroundColor = UIColor.green
}
两个 UIScrollView 指示器都是 UIScrollView 的子视图。因此,我们可以访问 UIScrollView 的子视图并更改子视图的属性。
1 .添加 UIScrollViewDelegate
@interface ViewController : UIViewController<UIScrollViewDelegate>
@end
2.在实现部分添加scrollViewDidScroll
-(void)scrollViewDidScroll:(UIScrollView *)scrollView1
{
//get refrence of vertical indicator
UIImageView *verticalIndicator = ((UIImageView *)[scrollView.subviews objectAtIndex:(scrollView.subviews.count-1)]);
//set color to vertical indicator
[verticalIndicator setBackgroundColor:[UIColor redColor]];
//get refrence of horizontal indicator
UIImageView *horizontalIndicator = ((UIImageView *)[scrollView.subviews objectAtIndex:(scrollView.subviews.count-2)]);
//set color to horizontal indicator
[horizontalIndicator setBackgroundColor:[UIColor blueColor]];
}
注意:- 因为每次滚动时这些指标都会更新(意味着重置为默认值)。所以,我们把这段代码放在 scrollViewDidScroll 委托方法中。
GitHub 上提供的演示 - https://github.com/developerinsider/UIScrollViewIndicatorColor
根据@Alex ( https://stackoverflow.com/a/58415249/3876285 ) 的回答,我发布了一些改进以更改滚动指示器的颜色。
extension UIScrollView {
var scrollIndicators: (horizontal: UIView?, vertical: UIView?) {
guard self.subviews.count >= 2 else {
return (horizontal: nil, vertical: nil)
}
func viewCanBeScrollIndicator(view: UIView) -> Bool {
let viewClassName = NSStringFromClass(type(of: view))
if viewClassName == "_UIScrollViewScrollIndicator" || viewClassName == "UIImageView" {
return true
}
return false
}
let horizontalScrollViewIndicatorPosition = self.subviews.count - 2
let verticalScrollViewIndicatorPosition = self.subviews.count - 1
var horizontalScrollIndicator: UIView?
var verticalScrollIndicator: UIView?
let viewForHorizontalScrollViewIndicator = self.subviews[horizontalScrollViewIndicatorPosition]
if viewCanBeScrollIndicator(view: viewForHorizontalScrollViewIndicator) {
horizontalScrollIndicator = viewForHorizontalScrollViewIndicator.subviews[0]
}
let viewForVerticalScrollViewIndicator = self.subviews[verticalScrollViewIndicatorPosition]
if viewCanBeScrollIndicator(view: viewForVerticalScrollViewIndicator) {
verticalScrollIndicator = viewForVerticalScrollViewIndicator.subviews[0]
}
return (horizontal: horizontalScrollIndicator, vertical: verticalScrollIndicator)
}
}
如果不添加.subviews[0]
,您将获得更深的视图,并且当您尝试更改指示器的颜色时,会出现奇怪的白色效果。那是因为它前面还有另一个视图:
通过添加.subviews[0]
到每个指标视图,一旦您尝试通过调用更改颜色:
override func scrollViewDidScroll(_ scrollView: UIScrollView) {
DispatchQueue.main.async() {
scrollView.scrollIndicators.vertical?.backgroundColor = UIColor.yourcolor
}
}
您将访问第一个视图并正确更改颜色:
感谢@Alex,他发布了一个很棒的解决方案
在IOS 13
试试这个
func scrollViewDidScroll(_ scrollView: UIScrollView){
if #available(iOS 13, *) {
(scrollView.subviews[(scrollView.subviews.count - 1)].subviews[0]).backgroundColor = UIColor.themeColor(1.0) //verticalIndicator
(scrollView.subviews[(scrollView.subviews.count - 2)].subviews[0]).backgroundColor = UIColor.themeColor(1.0) //horizontalIndicator
} else {
if let verticalIndicator: UIImageView = (scrollView.subviews[(scrollView.subviews.count - 1)] as? UIImageView) {
verticalIndicator.backgroundColor = UIColor.themeColor(1.0)
}
if let horizontalIndicator: UIImageView = (scrollView.subviews[(scrollView.subviews.count - 2)] as? UIImageView) {
horizontalIndicator.backgroundColor = UIColor.themeColor(1.0)
}
}
}
斯威夫特 2.0:
添加 UIScrollView 委托。
func scrollViewDidScroll(scrollView: UIScrollView){
let verticalIndicator: UIImageView = (scrollView.subviews[(scrollView.subviews.count - 1)] as! UIImageView)
verticalIndicator.backgroundColor = UIColor.greenColor()
let horizontalIndicator: UIImageView = (scrollView.subviews[(scrollView.subviews.count - 2)] as! UIImageView)
horizontalIndicator.backgroundColor = UIColor.blueColor()
}
试试这个它肯定会帮助你
for ( UIView *view in scrollBar.subviews ) {
if (view.tag == 0 && [view isKindOfClass:UIImageView.class])
{
UIImageView *imageView = (UIImageView *)view;
imageView.backgroundColor = [UIColor yellowColor];
}
}
解释:UIScrollBar 是子视图的集合。这里滚动条指示器(垂直/水平)是子视图之一,它是一个 UIImageView。因此,如果我们为 UIImageView 设置自定义颜色,它会影响滚动条指示器。
您可以更改指示器的图像,但您应该重复执行此操作
func scrollViewDidScroll(_ scrollView: UIScrollView) {
self.chageScrollIndicator()
}
func chageScrollIndicator (){
if let indicator = self.collection.subviews.last as? UIImageView {
let edge = UIEdgeInsets(top: 1.25,
left: 0,
bottom: 1.25,
right: 0)
indicator.image = UIImage(named: "ScrollIndicator")?.withRenderingMode(.alwaysTemplate).resizableImage(withCapInsets: edge)
indicator.tintColor = UIConfiguration.textColor
}
}
在IOS 13
由于 iOS13 滚动指示器有类 _UIScrollViewScrollIndicator,而不是 UIImageView。
许多人使用的代码像
let verticalIndicator: UIImageView = (scrollView.subviews[(scrollView.subviews.count - 1)] as! UIImageView)
这不是一个好主意,因为他们承诺最后一个子视图将是 UIImageView :)。现在不是,他们可能会崩溃。
您可以尝试以下代码来获取 scrollView 指标:
extension UIScrollView {
var scrollIndicators: (horizontal: UIView?, vertical: UIView?) {
guard self.subviews.count >= 2 else {
return (horizontal: nil, vertical: nil)
}
func viewCanBeScrollIndicator(view: UIView) -> Bool {
let viewClassName = NSStringFromClass(type(of: view))
if viewClassName == "_UIScrollViewScrollIndicator" || viewClassName == "UIImageView" {
return true
}
return false
}
let horizontalScrollViewIndicatorPosition = self.subviews.count - 2
let verticalScrollViewIndicatorPosition = self.subviews.count - 1
var horizontalScrollIndicator: UIView?
var verticalScrollIndicator: UIView?
let viewForHorizontalScrollViewIndicator = self.subviews[horizontalScrollViewIndicatorPosition]
if viewCanBeScrollIndicator(view: viewForHorizontalScrollViewIndicator) {
horizontalScrollIndicator = viewForHorizontalScrollViewIndicator
}
let viewForVerticalScrollViewIndicator = self.subviews[verticalScrollViewIndicatorPosition]
if viewCanBeScrollIndicator(view: viewForVerticalScrollViewIndicator) {
verticalScrollIndicator = viewForVerticalScrollViewIndicator
}
return (horizontal: horizontalScrollIndicator, vertical: verticalScrollIndicator)
}
}
如果您只需要一个(h 或 v 指示器) - 最好削减此功能并只保留您需要的一个(以提高性能)。
此外,最好在 DispatchQueue 中调用 update func,以保持滚动的平滑度。
func scrollViewDidScroll(_ scrollView: UIScrollView) {
DispatchQueue.main.async {
scrollView.updateCustomScrollIndicatorView()
}
}
这是滚动条颜色的改变方式:
//scroll view
UIScrollView *scView = [[UIScrollView alloc] init];
scView.frame = self.view.bounds; //scroll view occupies full parent views
scView.contentSize = CGSizeMake(400, 800);
scView.backgroundColor = [UIColor lightGrayColor];
scView.indicatorStyle = UIScrollViewIndicatorStyleBlack;
scView.showsHorizontalScrollIndicator = NO;
scView.showsVerticalScrollIndicator = YES;
scView.scrollEnabled = YES;
[self.view addSubview: scView];
如果你也想添加图片,这里是 Swift 3 的代码
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let verticalIndicator = scrollView.subviews.last as? UIImageView
verticalIndicator?.image = UIImage(named: "imageName")
}
这也适用于 UITableView 和 UICollectionView。
我最近遇到了同样的问题,所以我决定为它写一个类别。
https://github.com/stefanceriu/UIScrollView-ScrollerAdditions
[someScrollView setVerticalScrollerTintColor:someColor];
[someScrollView setHorizontalScrollerTintColor:someColor];`
它将它与原始图像混合,因此只有颜色会改变。另一方面,也可以对其进行修改以提供自定义图像供滚动条使用。
不久前我写了一篇关于这个的文章。不幸的是,此条的颜色由预定义的图像定义,因此如果您要更改条的颜色,则需要进行一些额外的工作。看看下面的链接,你肯定会在这里找到答案,因为我试图解决同样的问题。
http://leonov.co/2011/04/uiscrollviews-scrollbars-customization/
至于 iOS 13 的子视图发生了变化,所以添加了简单的 if,解决了这个问题。
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 13.0) {
UIView *verticalIndicator = [scrollView.subviews lastObject];
verticalIndicator.backgroundColor = [UIColor redColor];
} else {
UIImageView *verticalIndicator = [scrollView.subviews lastObject];
verticalIndicator.backgroundColor = [UIColor redColor];
}
}
这是我在 Swift 4 中所做的,类似于以前的答案。在我的情况下,我将图像重新着色为不可见,设置正确的角半径并且只执行一次此过程。
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let color = UIColor.red
guard
let verticalIndicator = scrollView.subviews.last as? UIImageView,
verticalIndicator.backgroundColor != color,
verticalIndicator.image?.renderingMode != .alwaysTemplate
else { return }
verticalIndicator.layer.masksToBounds = true
verticalIndicator.layer.cornerRadius = verticalIndicator.frame.width / 2
verticalIndicator.backgroundColor = color
verticalIndicator.image = verticalIndicator.image?.withRenderingMode(.alwaysTemplate)
verticalIndicator.tintColor = .clear
}
请在 iOS 渲染器上使用以下代码
private bool _layouted;
public override void LayoutSubviews()
{
base.LayoutSubviews();
if (!_layouted)
{
this.Layer.BorderColor = UIColor.Red.CGColor;
var Verticalbar = (UIImageView)this.Subviews[this.Subviews.Length - 1];
Verticalbar.BackgroundColor = Color.FromHex("#0099ff").ToUIColor();
var Horizontlebar = (UIImageView)this.Subviews[this.Subviews.Length - 2];
Horizontlebar.BackgroundColor = Color.FromHex("#0099ff").ToUIColor();
_layouted = true;
}
}
您可以使用自定义 UIScrollView 滚动条在滚动条中实现颜色。更多详情请看这里