UIScrollView CustomStickyHeader Resize height generates problems when scroll is too fast
I have been trying for a while to create a UIViewController that has a CustomStickyHeader and a UITableView. The idea I have been following is use the UITableView scrolling for changing the header view with the value of the contentOffset.
The layout for the ViewController (AlbumsViewController) looks like:
The UItableView Scrolling functions from the delegate are implemented like that:
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let endReached = contentTableView.contentOffset.y >= (contentTableView.contentSize.height - contentTableView.frame.size.height)
let isUP = lastContentOffset > scrollView.contentOffset.y
if scrollView.contentOffset.y < 0 {
headerHeightConstraint.constant += abs(scrollView.contentOffset.y)
}
else{
if !endReached{
if isUP{ // -> Finger moving Down ...
let newSize = headerHeightConstraint.constant + abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
else{
let newSize = headerHeightConstraint.constant - abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
if headerHeightConstraint.constant < headerView.minHeaderSize {
headerHeightConstraint.constant = headerView.minHeaderSize
}
}
else{
if headerHeightConstraint.constant > headerView.minHeaderSize {
}
}
}
//HeaderView Function for changing the alpha of a view
headerView.changeColorAlpha(headerHeight: headerHeightConstraint.constant)
lastContentOffset = scrollView.contentOffset.y
}
func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
private func animateHeader() {
self.headerHeightConstraint.constant = headerView.maxHeaderSize
UIView.animate(withDuration: 0.4, delay: 0.0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, options: [.curveEaseInOut], animations: {
self.headerView.changeColorAlpha(headerHeight: self.headerHeightConstraint.constant)
self.view.layoutIfNeeded()
}, completion: nil)
}
So far it works if i scroll gently and the result looks like that:
and fully "Collapsed" with the minimum height:
However, If i scroll fast, the scrollView gets to the end and, I suppose, scrollViewDidScroll is not called and the headerView's height gets partially "collapsed" like that:
What am I doing wrong?
Is there a better approach?
Thank you
ios swift swift4.2
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
add a comment |
I have been trying for a while to create a UIViewController that has a CustomStickyHeader and a UITableView. The idea I have been following is use the UITableView scrolling for changing the header view with the value of the contentOffset.
The layout for the ViewController (AlbumsViewController) looks like:
The UItableView Scrolling functions from the delegate are implemented like that:
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let endReached = contentTableView.contentOffset.y >= (contentTableView.contentSize.height - contentTableView.frame.size.height)
let isUP = lastContentOffset > scrollView.contentOffset.y
if scrollView.contentOffset.y < 0 {
headerHeightConstraint.constant += abs(scrollView.contentOffset.y)
}
else{
if !endReached{
if isUP{ // -> Finger moving Down ...
let newSize = headerHeightConstraint.constant + abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
else{
let newSize = headerHeightConstraint.constant - abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
if headerHeightConstraint.constant < headerView.minHeaderSize {
headerHeightConstraint.constant = headerView.minHeaderSize
}
}
else{
if headerHeightConstraint.constant > headerView.minHeaderSize {
}
}
}
//HeaderView Function for changing the alpha of a view
headerView.changeColorAlpha(headerHeight: headerHeightConstraint.constant)
lastContentOffset = scrollView.contentOffset.y
}
func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
private func animateHeader() {
self.headerHeightConstraint.constant = headerView.maxHeaderSize
UIView.animate(withDuration: 0.4, delay: 0.0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, options: [.curveEaseInOut], animations: {
self.headerView.changeColorAlpha(headerHeight: self.headerHeightConstraint.constant)
self.view.layoutIfNeeded()
}, completion: nil)
}
So far it works if i scroll gently and the result looks like that:
and fully "Collapsed" with the minimum height:
However, If i scroll fast, the scrollView gets to the end and, I suppose, scrollViewDidScroll is not called and the headerView's height gets partially "collapsed" like that:
What am I doing wrong?
Is there a better approach?
Thank you
ios swift swift4.2
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
add a comment |
I have been trying for a while to create a UIViewController that has a CustomStickyHeader and a UITableView. The idea I have been following is use the UITableView scrolling for changing the header view with the value of the contentOffset.
The layout for the ViewController (AlbumsViewController) looks like:
The UItableView Scrolling functions from the delegate are implemented like that:
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let endReached = contentTableView.contentOffset.y >= (contentTableView.contentSize.height - contentTableView.frame.size.height)
let isUP = lastContentOffset > scrollView.contentOffset.y
if scrollView.contentOffset.y < 0 {
headerHeightConstraint.constant += abs(scrollView.contentOffset.y)
}
else{
if !endReached{
if isUP{ // -> Finger moving Down ...
let newSize = headerHeightConstraint.constant + abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
else{
let newSize = headerHeightConstraint.constant - abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
if headerHeightConstraint.constant < headerView.minHeaderSize {
headerHeightConstraint.constant = headerView.minHeaderSize
}
}
else{
if headerHeightConstraint.constant > headerView.minHeaderSize {
}
}
}
//HeaderView Function for changing the alpha of a view
headerView.changeColorAlpha(headerHeight: headerHeightConstraint.constant)
lastContentOffset = scrollView.contentOffset.y
}
func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
private func animateHeader() {
self.headerHeightConstraint.constant = headerView.maxHeaderSize
UIView.animate(withDuration: 0.4, delay: 0.0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, options: [.curveEaseInOut], animations: {
self.headerView.changeColorAlpha(headerHeight: self.headerHeightConstraint.constant)
self.view.layoutIfNeeded()
}, completion: nil)
}
So far it works if i scroll gently and the result looks like that:
and fully "Collapsed" with the minimum height:
However, If i scroll fast, the scrollView gets to the end and, I suppose, scrollViewDidScroll is not called and the headerView's height gets partially "collapsed" like that:
What am I doing wrong?
Is there a better approach?
Thank you
ios swift swift4.2
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
I have been trying for a while to create a UIViewController that has a CustomStickyHeader and a UITableView. The idea I have been following is use the UITableView scrolling for changing the header view with the value of the contentOffset.
The layout for the ViewController (AlbumsViewController) looks like:
The UItableView Scrolling functions from the delegate are implemented like that:
func scrollViewDidScroll(_ scrollView: UIScrollView) {
let endReached = contentTableView.contentOffset.y >= (contentTableView.contentSize.height - contentTableView.frame.size.height)
let isUP = lastContentOffset > scrollView.contentOffset.y
if scrollView.contentOffset.y < 0 {
headerHeightConstraint.constant += abs(scrollView.contentOffset.y)
}
else{
if !endReached{
if isUP{ // -> Finger moving Down ...
let newSize = headerHeightConstraint.constant + abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
else{
let newSize = headerHeightConstraint.constant - abs(scrollView.contentOffset.y/75)
headerHeightConstraint.constant = newSize
}
if headerHeightConstraint.constant < headerView.minHeaderSize {
headerHeightConstraint.constant = headerView.minHeaderSize
}
}
else{
if headerHeightConstraint.constant > headerView.minHeaderSize {
}
}
}
//HeaderView Function for changing the alpha of a view
headerView.changeColorAlpha(headerHeight: headerHeightConstraint.constant)
lastContentOffset = scrollView.contentOffset.y
}
func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
if self.headerHeightConstraint.constant > headerView.maxHeaderSize {
animateHeader()
}
else if scrollView.contentOffset.y == 0{
animateHeader()
}
}
private func animateHeader() {
self.headerHeightConstraint.constant = headerView.maxHeaderSize
UIView.animate(withDuration: 0.4, delay: 0.0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0.5, options: [.curveEaseInOut], animations: {
self.headerView.changeColorAlpha(headerHeight: self.headerHeightConstraint.constant)
self.view.layoutIfNeeded()
}, completion: nil)
}
So far it works if i scroll gently and the result looks like that:
and fully "Collapsed" with the minimum height:
However, If i scroll fast, the scrollView gets to the end and, I suppose, scrollViewDidScroll is not called and the headerView's height gets partially "collapsed" like that:
What am I doing wrong?
Is there a better approach?
Thank you
ios swift swift4.2
ios swift swift4.2
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
asked Nov 21 '18 at 15:33
Reimond HillReimond Hill
466417
466417
add a comment |
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53415477%2fuiscrollview-customstickyheader-resize-height-generates-problems-when-scroll-is%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53415477%2fuiscrollview-customstickyheader-resize-height-generates-problems-when-scroll-is%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
