Skip to content

Commit

Permalink
Support for Steppers with RSB built in (#1749)
Browse files Browse the repository at this point in the history
  • Loading branch information
yschimke authored Oct 9, 2023
1 parent d3bf52a commit 9400000
Show file tree
Hide file tree
Showing 10 changed files with 335 additions and 0 deletions.
5 changes: 5 additions & 0 deletions compose-material/api/current.api
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,11 @@ package com.google.android.horologist.compose.material {
method @androidx.compose.runtime.Composable @com.google.android.horologist.annotations.ExperimentalHorologistApi public static void SplitToggleChip(boolean checked, kotlin.jvm.functions.Function1<? super java.lang.Boolean,kotlin.Unit> onCheckedChanged, String label, kotlin.jvm.functions.Function0<kotlin.Unit> onClick, com.google.android.horologist.compose.material.ToggleChipToggleControl toggleControl, optional androidx.compose.ui.Modifier modifier, optional String? secondaryLabel, optional androidx.wear.compose.material.SplitToggleChipColors colors, optional boolean enabled, optional androidx.compose.foundation.interaction.MutableInteractionSource checkedInteractionSource, optional androidx.compose.foundation.interaction.MutableInteractionSource clickInteractionSource);
}

public final class StepperKt {
method @androidx.compose.runtime.Composable public static void Stepper(float value, kotlin.jvm.functions.Function1<? super java.lang.Float,kotlin.Unit> onValueChange, int steps, optional androidx.compose.ui.Modifier modifier, optional kotlin.jvm.functions.Function0<kotlin.Unit> decreaseIcon, optional kotlin.jvm.functions.Function0<kotlin.Unit> increaseIcon, optional kotlin.ranges.ClosedFloatingPointRange<java.lang.Float> valueRange, optional long backgroundColor, optional long contentColor, optional long iconColor, optional boolean enableRangeSemantics, kotlin.jvm.functions.Function1<? super androidx.compose.foundation.layout.BoxScope,kotlin.Unit> content);
method @androidx.compose.runtime.Composable public static void Stepper(int value, kotlin.jvm.functions.Function1<? super java.lang.Integer,kotlin.Unit> onValueChange, kotlin.ranges.IntProgression valueProgression, optional androidx.compose.ui.Modifier modifier, optional kotlin.jvm.functions.Function0<kotlin.Unit> decreaseIcon, optional kotlin.jvm.functions.Function0<kotlin.Unit> increaseIcon, optional long backgroundColor, optional long contentColor, optional long iconColor, optional boolean enableRangeSemantics, kotlin.jvm.functions.Function1<? super androidx.compose.foundation.layout.BoxScope,kotlin.Unit> content);
}

public final class TitleKt {
method @androidx.compose.runtime.Composable @com.google.android.horologist.annotations.ExperimentalHorologistApi public static void SecondaryTitle(@StringRes int textId, optional androidx.compose.ui.Modifier modifier, optional androidx.compose.ui.graphics.vector.ImageVector? icon, optional float iconSize, optional com.google.android.horologist.compose.material.IconRtlMode iconRtlMode);
method @androidx.compose.runtime.Composable @com.google.android.horologist.annotations.ExperimentalHorologistApi public static void SecondaryTitle(String text, optional androidx.compose.ui.Modifier modifier, optional androidx.compose.ui.graphics.vector.ImageVector? icon, optional long iconTint, optional float iconSize, optional com.google.android.horologist.compose.material.IconRtlMode iconRtlMode);
Expand Down
1 change: 1 addition & 0 deletions compose-material/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,7 @@ metalava {

dependencies {
api(projects.annotations)
api(projects.composeLayout)

api(libs.compose.foundation.foundation)
api(libs.compose.foundation.foundation.layout)
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,178 @@
/*
* Copyright 2023 The Android Open Source Project
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

package com.google.android.horologist.compose.material

import androidx.compose.foundation.layout.BoxScope
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.util.lerp
import androidx.wear.compose.material.MaterialTheme
import androidx.wear.compose.material.StepperDefaults
import androidx.wear.compose.material.contentColorFor
import com.google.android.horologist.compose.rotaryinput.RotaryDefaults
import com.google.android.horologist.compose.rotaryinput.onRotaryInputAccumulatedWithFocus
import kotlin.math.roundToInt

/**
* Wrapper for androidx.wear.compose.material.Stepper with default RSB scroll support.
*
* @see androidx.wear.compose.material.Stepper
*/
@Composable
public fun Stepper(
value: Float,
onValueChange: (Float) -> Unit,
steps: Int,
modifier: Modifier = Modifier,
decreaseIcon: @Composable () -> Unit = {
Icon(
StepperDefaults.Decrease,
stringResource(R.string.horologist_stepper_decrease_content_description),
)
},
increaseIcon: @Composable () -> Unit = {
Icon(
StepperDefaults.Increase,
stringResource(R.string.horologist_stepper_increase_content_description),
)
},
valueRange: ClosedFloatingPointRange<Float> = 0f..(steps + 1).toFloat(),
backgroundColor: Color = MaterialTheme.colors.background,
contentColor: Color = contentColorFor(backgroundColor),
iconColor: Color = contentColor,
enableRangeSemantics: Boolean = true,
content: @Composable BoxScope.() -> Unit,
) {
val isLowRes = RotaryDefaults.isLowResInput()

val currentStep = remember(value, valueRange, steps) {
snapValueToStep(
value,
valueRange,
steps,
)
}

val updateValue: (Int) -> Unit = { stepDiff ->
val newValue = calculateCurrentStepValue(currentStep + stepDiff, steps, valueRange)
if (newValue != value) onValueChange(newValue)
}

androidx.wear.compose.material.Stepper(
value,
onValueChange,
steps,
decreaseIcon,
increaseIcon,
modifier.onRotaryInputAccumulatedWithFocus(isLowRes = isLowRes, onValueChange = {
if (it < 0f) {
updateValue(1)
} else if (it > 0f) {
updateValue(-1)
}
}),
valueRange,
backgroundColor,
contentColor,
iconColor,
enableRangeSemantics,
content,
)
}

/**
* Wrapper for androidx.wear.compose.material.Stepper with default RSB scroll support.
*
* @see androidx.wear.compose.material.Stepper
*/
@Composable
public fun Stepper(
value: Int,
onValueChange: (Int) -> Unit,
valueProgression: IntProgression,
modifier: Modifier = Modifier,
decreaseIcon: @Composable () -> Unit = {
Icon(
StepperDefaults.Decrease,
stringResource(R.string.horologist_stepper_decrease_content_description),
)
},
increaseIcon: @Composable () -> Unit = {
Icon(
StepperDefaults.Increase,
stringResource(R.string.horologist_stepper_increase_content_description),
)
},
backgroundColor: Color = MaterialTheme.colors.background,
contentColor: Color = contentColorFor(backgroundColor),
iconColor: Color = contentColor,
enableRangeSemantics: Boolean = true,
content: @Composable BoxScope.() -> Unit,
) {
val isLowRes = RotaryDefaults.isLowResInput()
androidx.wear.compose.material.Stepper(
value,
onValueChange,
valueProgression,
decreaseIcon,
increaseIcon,
modifier.onRotaryInputAccumulatedWithFocus(isLowRes = isLowRes, onValueChange = {
if (it < 0f) {
val newValue = (value + valueProgression.step)
if (newValue <= valueProgression.last) {
onValueChange(newValue)
}
} else if (it > 0f) {
val newValue = (value - valueProgression.step)
if (newValue >= valueProgression.first) {
onValueChange(newValue)
}
}
}),
backgroundColor,
contentColor,
iconColor,
enableRangeSemantics,
content,
)
}

/**
* Calculates value of [currentStep] in [valueRange] depending on number of [steps]
*/
internal fun calculateCurrentStepValue(
currentStep: Int,
steps: Int,
valueRange: ClosedFloatingPointRange<Float>,
): Float = lerp(
valueRange.start,
valueRange.endInclusive,
currentStep.toFloat() / (steps + 1).toFloat(),
).coerceIn(valueRange)

/**
* Snaps [value] to the closest [step] in the [valueRange]
*/
internal fun snapValueToStep(
value: Float,
valueRange: ClosedFloatingPointRange<Float>,
steps: Int,
): Int = ((value - valueRange.start) / (valueRange.endInclusive - valueRange.start) * (steps + 1)).roundToInt()
.coerceIn(0, steps + 1)
2 changes: 2 additions & 0 deletions compose-material/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -21,4 +21,6 @@
<string description="State description of the SplitToggleChip. It lets the user know if the toggle is checked or not. [CHAR_LIMIT=NONE]" name="horologist_split_toggle_chip_off_state_description">Off</string>
<string description="State description of the ToggleButton. It lets the user know if the toggle is checked or not. [CHAR_LIMIT=NONE]" name="horologist_toggle_button_on_state_description">On</string>
<string description="State description of the ToggleButton. It lets the user know if the toggle is checked or not. [CHAR_LIMIT=NONE]" name="horologist_toggle_button_off_state_description">Off</string>
<string description="Content description of the Stepper Decrease Button. [CHAR_LIMIT=NONE]" name="horologist_stepper_decrease_content_description">Decrease</string>
<string description="Content description of the Stepper Increase Button. [CHAR_LIMIT=NONE]" name="horologist_stepper_increase_content_description">Increase</string>
</resources>
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
/*
* Copyright 2023 The Android Open Source Project
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

package com.google.android.horologist.compose.material

import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableFloatStateOf
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.wear.compose.material.Text
import com.google.android.horologist.screenshots.ScreenshotBaseTest
import com.google.android.horologist.screenshots.ScreenshotTestRule
import org.junit.Test

class StepperA11yTest :
ScreenshotBaseTest(
ScreenshotTestRule.screenshotTestRuleParams {
enableA11y = true
screenTimeText = {}
record = ScreenshotTestRule.RecordMode.Repair
},
) {

@Test
fun float() {
screenshotTestRule.setContent(takeScreenshot = true) {
var value by remember {
mutableFloatStateOf(0f)
}
Stepper(
value = value,
onValueChange = { value = it },
valueRange = 0f..100f,
steps = 9,
) {
Text("Value: $value")
}
}
}

@Test
fun int() {
screenshotTestRule.setContent(takeScreenshot = true) {
var value by remember {
mutableIntStateOf(0)
}
Stepper(
value = value,
onValueChange = { value = it },
valueProgression = IntProgression.fromClosedRange(0, 100, 10),
) {
Text("Value: $value")
}
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
/*
* Copyright 2023 The Android Open Source Project
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

package com.google.android.horologist.compose.material

import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableFloatStateOf
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.wear.compose.material.Text
import com.google.android.horologist.screenshots.ScreenshotBaseTest
import com.google.android.horologist.screenshots.ScreenshotTestRule
import org.junit.Test

class StepperTest : ScreenshotBaseTest(
params = ScreenshotTestRule.screenshotTestRuleParams {
screenTimeText = {}
},
) {

@Test
fun float() {
screenshotTestRule.setContent(takeScreenshot = true, roundScreen = true) {
var value by remember {
mutableFloatStateOf(0f)
}
Stepper(
value = value,
onValueChange = { value = it },
valueRange = 0f..100f,
steps = 9,
) {
Text("Value: $value")
}
}
}

@Test
fun int() {
screenshotTestRule.setContent(takeScreenshot = true, roundScreen = true) {
var value by remember {
mutableIntStateOf(0)
}
Stepper(
value = value,
onValueChange = { value = it },
valueProgression = IntProgression.fromClosedRange(0, 100, 10),
) {
Text("Value: $value")
}
}
}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 9400000

Please sign in to comment.