Enable Drawer when expand API invoke to display drawer in Expanded St…

…ate. Added button in V2 Drawer Activity to expand directly
microsoft · May 19, 2023 · 9f9cebe · 9f9cebe
1 parent f558a18
commit 9f9cebe
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 7 deletions.
diff --git a/FluentUI.Demo/src/main/java/com/microsoft/fluentuidemo/demos/V2DrawerActivity.kt b/FluentUI.Demo/src/main/java/com/microsoft/fluentuidemo/demos/V2DrawerActivity.kt
@@ -13,6 +13,7 @@ import androidx.compose.foundation.verticalScroll
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.semantics.clearAndSetSemantics
 import androidx.compose.ui.semantics.contentDescription
@@ -78,7 +79,6 @@ private fun CreateActivityUI() {
     var selectedBehaviorType by remember { mutableStateOf(BehaviorType.BOTTOM_SLIDE_OVER) }
     Column(horizontalAlignment = Alignment.CenterHorizontally) {
         CreateDrawerWithButtonOnPrimarySurfaceToInvokeIt(
-            "Open Drawer",
             selectedBehaviorType,
             if (listContent)
                 getDrawerContent(selectedContent)
@@ -298,7 +298,6 @@ private fun CreateActivityUI() {
 
 @Composable
 private fun CreateDrawerWithButtonOnPrimarySurfaceToInvokeIt(
-    primaryScreenButtonText: String,
     behaviorType: BehaviorType,
     drawerContent: @Composable ((() -> Unit) -> Unit),
     expandable: Boolean = true,
@@ -309,13 +308,24 @@ private fun CreateDrawerWithButtonOnPrimarySurfaceToInvokeIt(
     val open: () -> Unit = {
         scope.launch { drawerState.open() }
     }
+    val expand: () -> Unit = {
+        scope.launch { drawerState.expand() }
+    }
     val close: () -> Unit = {
         scope.launch { drawerState.close() }
     }
-    PrimarySurfaceContent(
-        open,
-        text = primaryScreenButtonText
-    )
+    Row {
+        PrimarySurfaceContent(
+            open,
+            text = stringResource(id = R.string.drawer_open)
+        )
+        Spacer(modifier = Modifier.width(10.dp))
+        PrimarySurfaceContent(
+            expand,
+            text = stringResource(id = R.string.drawer_expand)
+        )
+    }
+
     Drawer(
         drawerState = drawerState,
         drawerContent = { drawerContent(close) },

diff --git a/FluentUI.Demo/src/main/res/values/strings.xml b/FluentUI.Demo/src/main/res/values/strings.xml
@@ -818,7 +818,7 @@
     <string name="card_description">Secondary copy for this banner can wrap to two lines if needed.</string>
     <!-- UI Label Button -->
     <string name="card_button">Button</string>
-    
+
     <!-- V2 Dialog -->
     <!-- UI Label to display the dialog -->
     <string name="show_dialog">Show Dialog</string>
@@ -835,4 +835,11 @@
     <!-- A sample description -->
     <string name="dialog_description">A dialog is a small window that prompts the user to make a decision or enter additional information.</string>
 
+    <!-- V2 Drawer -->
+    <!-- UI Label for Button which open Drawer-->
+    <string name="drawer_open">Open Drawer</string>
+    <!-- UI Label for Button which expand Drawer-->
+    <string name="drawer_expand">Expand Drawer</string>
+
+
 </resources>
diff --git a/fluentui_drawer/src/main/java/com/microsoft/fluentui/tokenized/drawer/Drawer.kt b/fluentui_drawer/src/main/java/com/microsoft/fluentui/tokenized/drawer/Drawer.kt
@@ -161,7 +161,9 @@ class DrawerState(
      * @throws [CancellationException] if the animation is interrupted
      */
     suspend fun expand() {
+        enable = true
         animationInProgress = true
+        delay(50)
         val targetValue = when {
             hasExpandedState -> DrawerValue.Expanded
             else -> DrawerValue.Open