fix(Android, Fabric): jumping content with native header #2169
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
kkafar marked this conversation as resolved.
Show resolved
Hide resolved
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,189 @@ | ||
| package com.swmansion.rnscreens.utils | ||
|
|
||
| import android.app.Activity | ||
| import android.util.Log | ||
| import android.view.View | ||
| import androidx.appcompat.widget.Toolbar | ||
| import androidx.coordinatorlayout.widget.CoordinatorLayout | ||
| import com.facebook.react.bridge.ReactApplicationContext | ||
| import com.facebook.react.uimanager.PixelUtil | ||
| import com.google.android.material.appbar.AppBarLayout | ||
| import com.swmansion.rnscreens.ScreenStackHeaderConfig | ||
| import java.lang.ref.WeakReference | ||
|
|
||
| /** | ||
| * This class provides methods to create dummy layout (that mimics Screen setup), and to compute | ||
| * expected header height. It is meant to be accessed from C++ layer via JNI. | ||
| * See https://github.com/software-mansion/react-native-screens/pull/2169 | ||
| * for more detailed description of the issue this code solves. | ||
| */ | ||
| internal class ScreenDummyLayoutHelper(reactContext: ReactApplicationContext) { | ||
| // The state required to compute header dimensions. We want this on instance rather than on class | ||
| // for context access & being tied to instance lifetime. | ||
| private lateinit var coordinatorLayout: CoordinatorLayout | ||
| private lateinit var appBarLayout: AppBarLayout | ||
| private lateinit var dummyContentView: View | ||
| private lateinit var toolbar: Toolbar | ||
| private var defaultFontSize: Float = 0f | ||
| private var defaultContentInsetStartWithNavigation: Int = 0 | ||
|
|
||
| // LRU with size 1 | ||
| private var cache: CacheEntry = CacheEntry.EMPTY | ||
|
|
||
| // We do not want to be responsible for the context lifecycle. If it's null, we're fine. | ||
| // This same context is being passed down to our view components so it is destroyed | ||
| // only if our views also are. | ||
| private var reactContextRef: WeakReference<ReactApplicationContext> = WeakReference(reactContext) | ||
|
|
||
| init { | ||
|
|
||
| // We load the library so that we are able to communicate with our C++ code (descriptor & shadow nodes). | ||
| // Basically we leak this object to C++, as its lifecycle should span throughout whole application | ||
| // lifecycle anyway. | ||
| try { | ||
| System.loadLibrary(LIBRARY_NAME) | ||
| } catch (e: UnsatisfiedLinkError) { | ||
| Log.w(TAG, "Failed to load $LIBRARY_NAME") | ||
| } | ||
|
|
||
| WEAK_INSTANCE = WeakReference(this) | ||
| ensureDummyLayoutWithHeader(reactContext) | ||
| } | ||
|
|
||
| /** | ||
| * Initializes dummy view hierarchy with CoordinatorLayout, AppBarLayout and dummy View. | ||
| * We utilize this to compute header height (app bar layout height) from C++ layer when its needed. | ||
| */ | ||
| private fun ensureDummyLayoutWithHeader(reactContext: ReactApplicationContext) { | ||
| if (::coordinatorLayout.isInitialized) { | ||
| return | ||
| } | ||
|
|
||
| // We need to use activity here, as react context does not have theme attributes required by | ||
| // AppBarLayout attached leading to crash. | ||
| val contextWithTheme = | ||
| requireNotNull(reactContext.currentActivity) { "[RNScreens] Attempt to use context detached from activity" } | ||
|
|
||
| coordinatorLayout = CoordinatorLayout(contextWithTheme) | ||
|
|
||
| appBarLayout = AppBarLayout(contextWithTheme).apply { | ||
| layoutParams = CoordinatorLayout.LayoutParams( | ||
| CoordinatorLayout.LayoutParams.MATCH_PARENT, | ||
| CoordinatorLayout.LayoutParams.WRAP_CONTENT, | ||
| ) | ||
| } | ||
|
|
||
| toolbar = Toolbar(contextWithTheme).apply { | ||
kkafar marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| title = DEFAULT_HEADER_TITLE | ||
| layoutParams = AppBarLayout.LayoutParams( | ||
| AppBarLayout.LayoutParams.MATCH_PARENT, | ||
| AppBarLayout.LayoutParams.WRAP_CONTENT | ||
| ).apply { scrollFlags = 0 } | ||
| } | ||
|
|
||
| // We know the title text view will be there, cause we've just set title. | ||
| defaultFontSize = ScreenStackHeaderConfig.findTitleTextViewInToolbar(toolbar)!!.textSize | ||
| defaultContentInsetStartWithNavigation = toolbar.contentInsetStartWithNavigation | ||
|
|
||
| appBarLayout.addView(toolbar) | ||
|
|
||
| dummyContentView = View(contextWithTheme).apply { | ||
| layoutParams = CoordinatorLayout.LayoutParams( | ||
| CoordinatorLayout.LayoutParams.MATCH_PARENT, | ||
| CoordinatorLayout.LayoutParams.MATCH_PARENT | ||
| ) | ||
| } | ||
|
|
||
| coordinatorLayout.apply { | ||
| addView(appBarLayout) | ||
| addView(dummyContentView) | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * Triggers layout pass on dummy view hierarchy, taking into consideration selected | ||
| * ScreenStackHeaderConfig props that might have impact on final header height. | ||
| * | ||
| * @param fontSize font size value as passed from JS | ||
| * @return header height in dp as consumed by Yoga | ||
| */ | ||
| private fun computeDummyLayout(fontSize: Int, isTitleEmpty: Boolean): Float { | ||
| if (!::coordinatorLayout.isInitialized) { | ||
| Log.e(TAG, "[RNScreens] Attempt to access dummy view hierarchy before it is initialized") | ||
| return 0.0f | ||
| } | ||
|
|
||
| if (cache.hasKey(CacheKey(fontSize, isTitleEmpty))) { | ||
| return cache.headerHeight | ||
| } | ||
|
|
||
| val topLevelDecorView = requireActivity().window.decorView | ||
|
|
||
| // These dimensions are not accurate, as they do include status bar & navigation bar, however | ||
| // it is ok for our purposes. | ||
| val decorViewWidth = topLevelDecorView.width | ||
| val decorViewHeight = topLevelDecorView.height | ||
|
|
||
| val widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(decorViewWidth, View.MeasureSpec.EXACTLY) | ||
| val heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(decorViewHeight, View.MeasureSpec.EXACTLY) | ||
|
|
||
| if (isTitleEmpty) { | ||
| toolbar.title = "" | ||
| toolbar.contentInsetStartWithNavigation = 0 | ||
| } else { | ||
| toolbar.title = DEFAULT_HEADER_TITLE | ||
| toolbar.contentInsetStartWithNavigation = defaultContentInsetStartWithNavigation | ||
| } | ||
|
|
||
| val textView = ScreenStackHeaderConfig.findTitleTextViewInToolbar(toolbar) | ||
| textView?.textSize = if (fontSize != FONT_SIZE_UNSET) fontSize.toFloat() else defaultFontSize | ||
|
|
||
| coordinatorLayout.measure(widthMeasureSpec, heightMeasureSpec) | ||
|
|
||
| // It seems that measure pass would be enough, however I'm not certain whether there are no | ||
| // scenarios when layout violates measured dimensions. | ||
| coordinatorLayout.layout(0, 0, decorViewWidth, decorViewHeight) | ||
|
|
||
| val headerHeight = PixelUtil.toDIPFromPixel(appBarLayout.height.toFloat()) | ||
| cache = CacheEntry(CacheKey(fontSize, isTitleEmpty), headerHeight) | ||
| return headerHeight | ||
| } | ||
|
|
||
| private fun requireReactContext(): ReactApplicationContext { | ||
| return requireNotNull(reactContextRef.get()) { "[RNScreens] Attempt to require missing react context" } | ||
| } | ||
|
|
||
| private fun requireActivity(): Activity { | ||
| return requireNotNull(requireReactContext().currentActivity) { "[RNScreens] Attempt to use context detached from activity" } | ||
| } | ||
|
|
||
| companion object { | ||
| const val TAG = "ScreenDummyLayoutHelper" | ||
|
|
||
| const val LIBRARY_NAME = "react_codegen_rnscreens" | ||
|
|
||
| const val FONT_SIZE_UNSET = -1 | ||
|
|
||
| private const val DEFAULT_HEADER_TITLE: String = "FontSize123!#$" | ||
|
|
||
| // We access this field from C++ layer, through `getInstance` method. | ||
| // We don't care what instance we get access to as long as it has initialized | ||
| // dummy view hierarchy. | ||
| private var WEAK_INSTANCE = WeakReference<ScreenDummyLayoutHelper>(null) | ||
|
|
||
| @JvmStatic | ||
| fun getInstance(): ScreenDummyLayoutHelper? { | ||
| return WEAK_INSTANCE.get() | ||
| } | ||
| } | ||
| } | ||
|
|
||
| private data class CacheKey(val fontSize: Int, val isTitleEmpty: Boolean) | ||
|
|
||
| private class CacheEntry(val cacheKey: CacheKey, val headerHeight: Float) { | ||
| fun hasKey(key: CacheKey) = cacheKey.fontSize != Int.MIN_VALUE && cacheKey == key | ||
|
|
||
| companion object { | ||
| val EMPTY = CacheEntry(CacheKey(Int.MIN_VALUE, false), 0f) | ||
| } | ||
| } | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.