feat(顶部): 下拉隐藏输入框

jiaoyaning · jiaoyaning · commit 06831ec2f6e2 · 2022-08-11T11:48:37.000+08:00
diff --git a/app/build.gradle b/app/build.gradle
@@ -31,7 +31,9 @@ android {
     }
     kotlinOptions {
         jvmTarget = '11'
-        freeCompilerArgs += "-opt-in=kotlin.RequiresOptIn"
+        freeCompilerArgs += [
+                '-opt-in=kotlin.RequiresOptIn', '-Xjvm-default', 'compatibility'
+        ]
     }
     buildFeatures {
         compose true
diff --git a/app/src/main/java/com/jyn/composecalculator/ui/BottomBtnView.kt b/app/src/main/java/com/jyn/composecalculator/ui/BottomBtnView.kt
@@ -23,6 +23,12 @@ import com.jyn.composecalculator.ui.util.textClick
  * 底部按钮
  * Created by jiaoyaning on 2022/8/6.
  */
+val optionColumns = listOf(
+    listOf("INV", "sin", "ln", "π", "("),
+    listOf("RAD", "cos", "log", "e", ")"),
+    listOf("%", "tan", "√", "^", "!")
+)
+
 private val numberColumns = listOf(
     listOf("C", "7", "4", "1", "00"),
     listOf("%", "8", "5", "2", "0"),
@@ -35,7 +41,7 @@ private val numberColumns = listOf(
 fun BottomBtnView() {
     Row(
         Modifier
-            .padding(bottom = 10.dp)
+            .padding(bottom = if (!isPortrait) 0.dp else 10.dp)
             .fillMaxHeight(BOTTOM_FRACTION)
     ) {
         if (!isPortrait) {
@@ -46,6 +52,26 @@ fun BottomBtnView() {
                     .padding(10.dp),
                 horizontalArrangement = Arrangement.SpaceBetween
             ) {
+                optionColumns.forEach { numberColumn ->
+                    Column( //横排
+                        modifier = Modifier
+                            .padding(5.dp)
+                            .fillMaxHeight()
+                            .weight(1f),
+                        verticalArrangement = Arrangement.SpaceBetween
+                    ) {
+                        numberColumn.forEach {
+                            Box(
+                                modifier = Modifier
+                                    .padding(bottom = 10.dp)
+                                    .weight(1f)
+                                    .then(if (isPortrait) Modifier.aspectRatio(1f) else Modifier)
+                            ) {
+                                ItemBtn(text = it)
+                            }
+                        }
+                    }
+                }
             }
         }
 
diff --git a/app/src/main/java/com/jyn/composecalculator/ui/TopResultView.kt b/app/src/main/java/com/jyn/composecalculator/ui/TopResultView.kt
@@ -1,9 +1,9 @@
 package com.jyn.composecalculator.ui
 
+import androidx.activity.OnBackPressedCallback
+import androidx.activity.compose.LocalOnBackPressedDispatcherOwner
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.gestures.Orientation
-import androidx.compose.foundation.gestures.detectTapGestures
-import androidx.compose.foundation.indication
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyColumn
@@ -12,11 +12,12 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.*
 import androidx.compose.material.SwipeableDefaults.resistanceConfig
 import androidx.compose.material.TabRowDefaults.Divider
-import androidx.compose.material.ripple.LocalRippleTheme
 import androidx.compose.material3.Surface
-import androidx.compose.runtime.*
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.tooling.preview.Preview
@@ -26,11 +27,11 @@ import androidx.lifecycle.viewmodel.compose.viewModel
 import com.apkfuns.logutils.LogUtils
 import com.jyn.composecalculator.BOTTOM_FRACTION
 import com.jyn.composecalculator.DateViewModel
-import com.jyn.composecalculator.ui.theme.SecondaryRippleTheme
 import com.jyn.composecalculator.ui.view.InputText
 import com.jyn.composecalculator.ui.view.ItemText
 import com.jyn.composecalculator.ui.view.SlideIndicator
 import kotlinx.coroutines.launch
+import kotlin.math.abs
 
 /**
  * 上层结果
@@ -57,10 +58,7 @@ fun TopResultView() {
     val blockSizePx = with(LocalDensity.current) { -topHeight.toPx() }
     val anchors = mapOf(0f to false, blockSizePx to true)
 
-//    val coroutineScope = rememberCoroutineScope()
-//    coroutineScope.launch {
-//        state.animateTo(true, SwipeableDefaults.AnimationSpec)
-//    }
+    val coroutineScope = rememberCoroutineScope()
 
     Surface(
         modifier = Modifier
@@ -83,8 +81,27 @@ fun TopResultView() {
         tonalElevation = 3.dp,
         shadowElevation = 3.dp
     ) {
-        TextBox(process = 100 - (state.offset.value / blockSizePx * 100))
+        TextBox(process = state.offset.value / blockSizePx)
     }
+
+    val callback = remember {
+        object : OnBackPressedCallback(true) {
+            override fun handleOnBackPressed() {
+                if (!state.currentValue) {
+                    coroutineScope.launch {
+                        state.animateTo(true, SwipeableDefaults.AnimationSpec)
+                    }
+                }
+            }
+        }
+    }
+    val dispatcher = LocalOnBackPressedDispatcherOwner.current?.onBackPressedDispatcher
+    DisposableEffect(key1 = Unit, effect = {
+        dispatcher?.addCallback(callback)
+        onDispose {
+            callback.remove()
+        }
+    })
 }
 
 /**
@@ -106,10 +123,13 @@ fun TextBox(process: Float) {
             userScrollEnabled = true,
         ) {
             itemsIndexed(viewModel.results) { index, item ->
-                Box(modifier = Modifier.clickable {
-                    viewModel.inputText.value = item.input
-                    viewModel.resultText.value = item.result
-                }) {
+                Box(
+                    modifier = Modifier.clickable(
+                        indication = null,
+                        interactionSource = remember { MutableInteractionSource() }) {
+                        viewModel.inputText.value = item.input
+                        viewModel.resultText.value = item.result
+                    }) {
                     ItemText(input = item.input, result = item.result)
                     if (index < viewModel.results.size - 1) {
                         Divider()
@@ -118,12 +138,13 @@ fun TextBox(process: Float) {
             }
         }
 
-        InputText(viewModel.inputText.value)
+        InputText(process)
 
         Spacer(modifier = Modifier.height(5.dp))
 
         Box(
             modifier = Modifier
+                .padding(top = 15.dp, bottom = 15.dp * abs(1 - process))
                 .fillMaxWidth()
         ) {
             SlideIndicator(process)
diff --git a/app/src/main/java/com/jyn/composecalculator/ui/view/ItemTextView.kt b/app/src/main/java/com/jyn/composecalculator/ui/view/ItemTextView.kt
@@ -11,6 +11,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.text.ExperimentalTextApi
@@ -27,7 +28,7 @@ import com.jyn.composecalculator.DateViewModel
 
 
 @Composable
-fun InputText(input: String) {
+fun InputText(process: Float) {
     val viewModel = viewModel<DateViewModel>()
 
     val inputScrollState = rememberScrollState()
@@ -43,7 +44,9 @@ fun InputText(input: String) {
     }
 
     Column(
-        modifier = Modifier.height(viewModel.textBoxHeight),
+        modifier = Modifier
+            .height(viewModel.textBoxHeight * process)
+            .alpha(process),
         verticalArrangement = Arrangement.Center
     ) {
         Row(verticalAlignment = Alignment.CenterVertically) {
@@ -52,7 +55,7 @@ fun InputText(input: String) {
                     .weight(1f)
                     .horizontalScroll(inputScrollState)
                     .onSizeChanged { inputTextWidth.value = it.width },
-                text = input,
+                text = viewModel.inputText.value,
                 maxLines = 1,
                 fontSize = 50.sp,
                 textAlign = TextAlign.End,
@@ -79,39 +82,35 @@ fun InputText(input: String) {
 @Composable
 fun ItemText(input: String, result: String) {
     Column(
-        modifier = Modifier.padding(top = 10.dp, bottom = 10.dp),
+        modifier = Modifier.padding(top = 30.dp, bottom = 30.dp),
         verticalArrangement = Arrangement.Bottom
     ) {
-        SelectionContainer {
-            Text(
-                modifier = Modifier.fillMaxWidth(),
-                text = input,
-                fontSize = 23.sp,
-                maxLines = 1,
-                color = Color.Gray,
-                textAlign = TextAlign.End,
-                style = TextStyle(
-                    platformStyle = PlatformTextStyle(
-                        includeFontPadding = false
-                    )
+        Text(
+            modifier = Modifier.fillMaxWidth(),
+            text = input,
+            fontSize = 23.sp,
+            maxLines = 1,
+            color = Color.Gray,
+            textAlign = TextAlign.End,
+            style = TextStyle(
+                platformStyle = PlatformTextStyle(
+                    includeFontPadding = false
                 )
             )
-        }
+        )
 
-        SelectionContainer {
-            Text(
-                modifier = Modifier.fillMaxWidth(),
-                text = result,
-                fontSize = 33.sp,
-                maxLines = 1,
-                textAlign = TextAlign.End,
-                style = TextStyle(
-                    platformStyle = PlatformTextStyle(
-                        includeFontPadding = false
-                    )
+        Text(
+            modifier = Modifier.fillMaxWidth(),
+            text = result,
+            fontSize = 33.sp,
+            maxLines = 1,
+            textAlign = TextAlign.End,
+            style = TextStyle(
+                platformStyle = PlatformTextStyle(
+                    includeFontPadding = false
                 )
             )
-        }
+        )
     }
 }
 
diff --git a/app/src/main/java/com/jyn/composecalculator/ui/view/SlideIndicator.kt b/app/src/main/java/com/jyn/composecalculator/ui/view/SlideIndicator.kt
@@ -20,7 +20,7 @@ import com.jyn.composecalculator.ui.theme.black1
  */
 @Composable
 fun SlideIndicator(process: Float) {
-    var offsetProcess = process
+    var offsetProcess = 1 - process
     if (offsetProcess < 0) offsetProcess *= 10
     LogUtils.tag("SlideIndicator").i("process: $offsetProcess")
     val width = 30.dp
@@ -35,7 +35,7 @@ fun SlideIndicator(process: Float) {
         val centerX = size.width / 2
         val centerY = size.height / 2
 
-        val yOffset = maxOffset.toPx() * offsetProcess / 100
+        val yOffset = maxOffset.toPx() * offsetProcess
 
         val half = width.toPx() / 2
         val leftStart = centerX - half

Original file line number	Diff line number	Diff line change
`@@ -31,7 +31,9 @@ android {`
`31`	`31`	`}`
`32`	`32`	`kotlinOptions {`
`33`	`33`	`jvmTarget = '11'`
`34`		`- freeCompilerArgs += "-opt-in=kotlin.RequiresOptIn"`
	`34`	`+ freeCompilerArgs += [`
	`35`	`+ '-opt-in=kotlin.RequiresOptIn', '-Xjvm-default', 'compatibility'`
	`36`	`+ ]`
`35`	`37`	`}`
`36`	`38`	`buildFeatures {`
`37`	`39`	`compose true`