Comments (6)
@RareScrap Thank you! I will review your PR this weekend.
And it would be very nice to see the new example screen! If you are going to refactor examples please submit a separate PR 😀
from compose-collapsing-toolbar.
I have found a way to speed up this layout more than 60%. Thanks to this doc.
Passing progress as a lambda makes re-execute only layout and draw phases of Compose rather than trigger recomposition:
toolbar = {
val progress = { collapsingToolbarScaffoldState.toolbarState.progress }
// ...
},
I think we should implement an example screen with demonstration of this concept. It will be useful for creating complex toolbars.
But there are still two problems: one with Modifier.road()
and other with Modifier.clickable()
Road() issue
The problem is that Modifier.road()
triggers recomposition phase but in fact it affects only layout phase. For now I don't know how to fix this but I guess implementing LayoutModifier
might be a started point.
Clickable() strange behavior
In the code above lets look at toolbar composable lambda where MyCollapseAppBar
is placed:
MyCollapsedAppBar(
modifier = Modifier.clickable(onClick = { }), // TODO: Affects performance
progress = progress,
)
Clickable
modifier will trigger recomposition al entire MyCollapsedAppBar each time collapsingToolbarScaffoldState.toolbarState
is changed. But there is no any state reader in clickable. But the problem is gone if we move clickable
inside MyCollapsedAppBar
:
@Composable
private fun MyCollapsedAppBar(
modifier: Modifier = Modifier,
onClick: () -> Unit,
@FloatRange(from = 0.0, to = 1.0) progress: Float,
) {
// ...
MyAppBar(
modifier = Modifier.clickable(onClick = onClick), // Now MyCollapsedAppBar won't recomposing
title = {
Log.d("redraw", "collapsed bar title redrawing")
Text(
modifier = Modifier.alpha(progress),
text = "Collapsed app bar",
color = MaterialTheme.colors.onPrimary
)
}
)
// ...
}
For now I can't explain how it works. Maybe you can? It should be noted that this trick not work with Modifier.road()
.
I will try to play with collapsing toolbar modifiers but it will very helpful if you share your knowledge about this problems.
from compose-collapsing-toolbar.
Thank you @RareScrap , that would help the library to gain performance a lot! Maybe we can refer to the behavior of lambda version Modifier.graphicsLayer
to fix the road modifier issue. For clickable modifier, I will investigate what triggers recomposition.
from compose-collapsing-toolbar.
I have one thing to note here: since Row
, Column
, Box
are inline composable functions, they do not have their own recompose scope meaning that composable lambda passed to these functions will always recompose at the same time with their call sites.
from compose-collapsing-toolbar.
I'm happy to report that I have found a way to enormously improve the performance of CollapsingToolbarScaffold
(even with disabled AOT). The problem was that SubcomposeLayout
executes recomposition phase immediately after the measuring phase which allows measurement results to be used as an argument during recomposition. The implementation of CollapsingToolbarScaffold
is not depend on measurement results so using SubcomposeLayout
is unnecessary and inefficient here. That's why we can achieve our goal just using Layout
. Also modifiers won't trigger recomposition if Layout
is used.
I also want to implement an example activity with rich toolbar layout and create choosing page which allow to run different examples without manifest editing. What are you think?
from compose-collapsing-toolbar.
Closing the issue with your contribution! Please create another issue if the performance issue seems to persist 😃
from compose-collapsing-toolbar.
Related Issues (20)
- Retain offset/progress when toolbar's height is changed
- toolbar doesn't stay fully open when the screen is opened HOT 1
- Wrong initial scroll position when toolbar has dynamic height HOT 2
- Always visible toolbar navigation icon?
- ExitUntilCollapsed strategy does not set OffsetY in ScrollStrategy HOT 1
- SwipeRefresh as a child doesn't expand HOT 1
- Toolbar height remember issue
- How to use the pin modifier with ScrollStrategy.EnterAlways?
- Is it possible to hide the toolbar only by a set height? HOT 1
- Not able Collabs tool bar manully
- Is it possible to change the expanded state by scrolling the toolbar area?
- Feature of jumping between states expanded/collapsed HOT 1
- Full HOT 1
- Cash App $URL Change!
- Used without consent HOT 2
- Is the library still maintained?
- I have a way to deal with it temporarily
- Collapsing did not show screen bottom and did not scroll top
- CollapsingToolbarScaffold's body height is incorrect when restored from saved state with `ExitUntilCollapsed` scrolling strategy HOT 2
- Carl H. HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from compose-collapsing-toolbar.