Is it possible to make the background of a UIRefreshControl grow as the control grows?
I would like to have a colored background for the refresh control to match the top cell's background color. Changing the background color of the tableview is not acceptable because then empty cells at the bottom will also have the color, but I need them to stay white.
Apple's mail app shows this behavior. The refresh control's background matches the gray search bar, but empty cells at the bottom of the table view are still the normal white.
Here's an example screenshot of how the table looks showing the ugly white that appears as the refresh control is pulled:
You have to create a view with the bgColor and adding it with negative y origin in the tableView.
Warning:
- You have to insert this view at the bottom stack of tableView subviews
- You have to insert this view after setting the refreshControll: self.refreshControl = refreshControl;
If you do not insert this view this way you will not see the refresh control: he will be hidden below your view.
- (void)viewDidLoad
{
[super viewDidLoad];
// Background Color
UIColor *bgRefreshColor = [UIColor grayColor];
// Creating refresh control
refreshControl = [[UIRefreshControl alloc] init];
[refreshControl addTarget:self action:@selector(refresh) forControlEvents:UIControlEventValueChanged];
[refreshControl setBackgroundColor:bgRefreshColor];
self.refreshControl = refreshControl;
// Creating view for extending background color
CGRect frame = self.tableView.bounds;
frame.origin.y = -frame.size.height;
UIView* bgView = [[UIView alloc] initWithFrame:frame];
bgView.backgroundColor = bgRefreshColor;
bgView.autoresizingMask = UIViewAutoresizingFlexibleWidth;
// Adding the view below the refresh control
[self.tableView insertSubview:bgView atIndex:0]; // This has to be after self.refreshControl = refreshControl;
}
Swift version for easier copy-pasting :)
Swift 2
func viewDidLoad() {
super.viewDidLoad()
// Background Color
let backgroundColor = UIColor.grayColor()
// Creating refresh control
let refresh = UIRefreshControl()
refresh!.backgroundColor = backgroundColor
refresh!.addTarget(self, action: #selector(refresh), forControlEvents: UIControlEvents.ValueChanged)
refreshControl = refresh
// Creating view for extending background color
var frame = tableView.bounds
frame.origin.y = -frame.size.height
let backgroundView = UIView(frame: frame)
backgroundView.autoresizingMask = .FlexibleWidth
backgroundView.backgroundColor = backgroundColor
// Adding the view below the refresh control
tableView.insertSubview(backgroundView, atIndex: 0) // This has to be after refreshControl = refresh
}
Swift 3
func viewDidLoad() {
super.viewDidLoad()
// Background Color
let backgroundColor = .gray
// Creating refresh control
let refresh = UIRefreshControl()
refresh!.backgroundColor = backgroundColor
refresh!.addTarget(self, action: #selector(refresh), forControlEvents: .valueChanged)
refreshControl = refresh
// Creating view for extending background color
var frame = tableView.bounds
frame.origin.y = -frame.size.height
let backgroundView = UIView(frame: frame)
backgroundView.autoresizingMask = .flexibleWidth
backgroundView.backgroundColor = backgroundColor
// Adding the view below the refresh control
tableView.insertSubview(backgroundView, atIndex: 0) // This has to be after refreshControl = refresh
}