fix: android auto responsive sheet size (#193)

* fix: android auto responsive sheet size

* feat: fix auto responsive sheet size

* feat: solution 1

this sets layout.height right after STATE.COLLAPSED is set to give an animation effect. sometimes janky.

* feat: solution 2

* feat: disable dragging on auto size animation

* refactor: simplify code, forget about animated size change

* chore: remove unused code

---------

Co-authored-by: lodev09 <lodev09@gmail.com>

Author: lovegaoshi

android/src/main/java/com/lodev09/truesheet/TrueSheetDialog.kt

@@ -210,7 +210,7 @@ class TrueSheetDialog(private val reactContext: ThemedReactContext, private val
   /**
    * Set the state based for the given size index.
    */
-  private fun setStateForSizeIndex(index: Int) {
+  fun setStateForSizeIndex(index: Int) {
     behavior.state = getStateForSizeIndex(index)
   }
 
@@ -263,29 +263,32 @@ class TrueSheetDialog(private val reactContext: ThemedReactContext, private val
   /**
    * Determines the state based from the given size index.
    */
-  private fun getStateForSizeIndex(index: Int) =
-    when (sizes.size) {
-      1 -> BottomSheetBehavior.STATE_EXPANDED
+  private fun getStateForSizeIndex(index: Int): Int {
+      return when (sizes.size) {
+          1 -> {
+              return BottomSheetBehavior.STATE_EXPANDED
+          }
 
-      2 -> {
-        when (index) {
-          0 -> BottomSheetBehavior.STATE_COLLAPSED
-          1 -> BottomSheetBehavior.STATE_EXPANDED
-          else -> BottomSheetBehavior.STATE_HIDDEN
-        }
-      }
+          2 -> {
+              when (index) {
+                  0 -> BottomSheetBehavior.STATE_COLLAPSED
+                  1 -> BottomSheetBehavior.STATE_EXPANDED
+                  else -> BottomSheetBehavior.STATE_HIDDEN
+              }
+          }
+
+          3 -> {
+              when (index) {
+                  0 -> BottomSheetBehavior.STATE_COLLAPSED
+                  1 -> BottomSheetBehavior.STATE_HALF_EXPANDED
+                  2 -> BottomSheetBehavior.STATE_EXPANDED
+                  else -> BottomSheetBehavior.STATE_HIDDEN
+              }
+          }
 
-      3 -> {
-        when (index) {
-          0 -> BottomSheetBehavior.STATE_COLLAPSED
-          1 -> BottomSheetBehavior.STATE_HALF_EXPANDED
-          2 -> BottomSheetBehavior.STATE_EXPANDED
           else -> BottomSheetBehavior.STATE_HIDDEN
-        }
       }
-
-      else -> BottomSheetBehavior.STATE_HIDDEN
-    }
+  }
 
   /**
    * Handle keyboard state changes and adjust maxScreenHeight (sheet max height) accordingly.
@@ -331,6 +334,15 @@ class TrueSheetDialog(private val reactContext: ThemedReactContext, private val
         1 -> {
           maxHeight = getSizeHeight(sizes[0])
           skipCollapsed = true
+
+          if (sizes[0] == "auto") {
+            // Force a layout update
+            sheetContainerView?.let {
+              val params = it.layoutParams
+              params.height = maxHeight
+              it.layoutParams = params
+            }
+          }
         }
 
         2 -> {
@@ -358,6 +370,7 @@ class TrueSheetDialog(private val reactContext: ThemedReactContext, private val
     when (sizes.size) {
       1 -> {
         when (state) {
+          BottomSheetBehavior.STATE_COLLAPSED -> SizeInfo(0, Utils.toDIP(behavior.maxHeight.toFloat()))
           BottomSheetBehavior.STATE_EXPANDED -> SizeInfo(0, Utils.toDIP(behavior.maxHeight.toFloat()))
           else -> null
         }

android/src/main/java/com/lodev09/truesheet/TrueSheetView.kt

@@ -324,7 +324,11 @@ class TrueSheetView(context: Context) :
   fun configureIfShowing() {
     if (sheetDialog.isShowing) {
       sheetDialog.configure()
-      sheetDialog.positionFooter()
+      sheetDialog.setStateForSizeIndex(currentSizeIndex)
+
+      UiThreadUtil.runOnUiThread {
+        sheetDialog.positionFooter()
+      }
     }
   }
 

example/src/components/sheets/PromptSheet.tsx

@@ -38,7 +38,7 @@ export const PromptSheet = forwardRef((props: PromptSheetProps, ref: Ref<TrueShe
       grabber={false}
       edgeToEdge
       name="prompt-sheet"
-      sizes={['auto', 'large']}
+      sizes={['auto']}
       contentContainerStyle={styles.content}
       blurTint="dark"
       backgroundColor={DARK}