你如何检查 Jetpack Compose 中两个选择器的值？

huangapple
go评论60阅读模式
英文:

how do I check the value of two pickers jetpack compose?

问题

以下是您提供的代码的翻译：

有一个弹出选择器，两名用户输入他们的体重。第一个选择器用于用户的当前体重，第二个选择器用于目标体重。在这些选择器中，用户选择千克和克。
我的代码如下

**UI**

```kotlin
when (state.pickerState) {

        PickerState.CURRENT_WEIGHT -> {
            DailyCalorieWeightPickerComponent(
                onConfirmClick = { kg, gr ->
                    onChangeCurrentWeight(kg, gr)
                    onChangePickerStatus(PickerState.NONE)
                },
                onCancelClick = {
                    onChangePickerStatus(PickerState.NONE)
                },
                currentGr = state.currentGr,
                currentKg = state.currentKg,
                goalKg = state.goalKg,
                goalGr = state.goalGr,
                isClickGoalWeight = false
            )
        }
        PickerState.GOAL_WEIGHT -> {
            DailyCalorieWeightPickerComponent(
                onConfirmClick = { kg, gr ->
                    onChangeGoalWeight(kg, gr)
                    onChangePickerStatus(PickerState.NONE)
                },
                onCancelClick = {
                    onChangePickerStatus(PickerState.NONE)
                },
                currentGr = state.currentGr,
                currentKg = state.currentKg,
                goalKg = state.goalKg,
                goalGr = state.goalGr,
                isClickGoalWeight = true
            )
        }

        PickerState.NONE -> {
            // 沉默是金
        }
    }

DailyCalorieWeightPickerComponent 组件

@Composable
fun DailyCalorieWeightPickerComponent(
    onConfirmClick: (Int, Int) -> Unit,
    onCancelClick: () -> Unit,
    currentKg: Int?,
    currentGr: Int?,
    goalKg: Int?,
    goalGr: Int?,
    isClickGoalWeight: Boolean
) {


    var kg by remember { mutableStateOf(value = 35) }
    var gr by remember { mutableStateOf(value = 0) }

    val kgRange = 35..200
    val grRange = 0..1000

    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Bottom
    ) {
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .background(Color.Gray)
                .padding(start = 0.dp, top = 30.dp, end = 0.dp, bottom = 0.dp),
            horizontalArrangement = Arrangement.Center,
            verticalAlignment = Alignment.CenterVertically
        ) {
            NumberPicker(
                value = kg,
                onValueChange = { newKg ->
                    kg = newKg
                },
                range = kgRange
            )
            Text(text = "千克")
            NumberPicker(
                value = gr,
                onValueChange = { newGr ->
                    gr = newGr

                },
                range = grRange
            )
            Text(text = "克")

        }
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .height(IntrinsicSize.Min)
                .background(Color.Gray)
                .padding(start = 0.dp, top = 15.dp, end = 0.dp, bottom = 15.dp),
            horizontalArrangement = Arrangement.Center,
            verticalAlignment = Alignment.CenterVertically
        ) {
            TextButton(onClick = {
                onCancelClick()
            }) {
                Text(
                    text = "取消",
                    fontSize = 16.sp,
                    fontWeight = FontWeight.Bold,
                    color = DefaultDYTColor,
                    modifier = Modifier.padding(8.dp)
                )
            }
            Divider(
                color = Color.White,
                modifier = Modifier
                    .padding(8.dp)
                    .fillMaxHeight()  // 填充最大高度
                    .width(1.dp)
            )

            TextButton(onClick = {
                onConfirmClick(kg, gr)
            }) {
                Text(
                    text = "确定",
                    fontSize = 16.sp,
                    fontWeight = FontWeight.Bold,
                    color = DefaultDYTColor,
                    modifier = Modifier.padding(8.dp)
                )
            }
        }
    }
}

我在这里尝试了一些内容，所以我已经在这个组件中获取了currentKg、currentGr、goalKg和goalGr的值，但现在我还没有在这段代码中使用它们。这样，用户可以选择他的目标体重和目标克数，以及他的当前体重和当前克数。正如您在代码中所看到的，值的范围是从35到200，克数的范围是从0到1000。我想要做的是，用户的目标体重永远不会大于他的当前体重，也就是说，我希望调整他的当前体重，使其大于目标体重。例如，用户选择了40千克20克的目标体重。在选择当前体重时，我希望从选择器中从41千克21克开始。同样，如果用户首先选择了当前体重，比如说40千克20克，当他再次点击选择目标体重时，选择器将打开，并且最大值将为39千克，每克可以选择19克。


<details>
<summary>英文:</summary>
There is a popup picker where two users enter their weight. The first picker is for the current weight of the user and the second is for the target weight. In these pickers, the user chooses kilos and grams.
My codes are like this
**UI**
when (state.pickerState) {
PickerState.CURRENT_WEIGHT -&gt; {
DailyCalorieWeightPickerComponent(
onConfirmClick = { kg, gr -&gt;
onChangeCurrentWeight(kg, gr)
onChangePickerStatus(PickerState.NONE)
},
onCancelClick = {
onChangePickerStatus(PickerState.NONE)
},
currentGr = state.currentGr,
currentKg = state.currentKg,
goalKg = state.goalKg,
goalGr = state.goalGr,
isClickGoalWeight = false
)
}
PickerState.GOAL_WEIGHT -&gt; {
DailyCalorieWeightPickerComponent(
onConfirmClick = { kg, gr -&gt;
onChangeGoalWeight(kg, gr)
onChangePickerStatus(PickerState.NONE)
},
onCancelClick = {
onChangePickerStatus(PickerState.NONE)
},
currentGr = state.currentGr,
currentKg = state.currentKg,
goalKg = state.goalKg,
goalGr = state.goalGr,
isClickGoalWeight = true
)
}
PickerState.NONE -&gt; {
// silence is golden
}
}
**DailyCalorieWeightPickerComponent component**
@Composable
fun DailyCalorieWeightPickerComponent(
onConfirmClick: (Int, Int) -&gt; Unit,
onCancelClick: () -&gt; Unit,
currentKg: Int?,
currentGr: Int?,
goalKg: Int?,
goalGr: Int?,
isClickGoalWeight: Boolean
) {
var kg by remember { mutableStateOf(value = 35) }
var gr by remember { mutableStateOf(value = 0) }
val kgRange = 35..200
val grRange = 0..1000
Column(
modifier = Modifier.fillMaxSize(),
verticalArrangement = Arrangement.Bottom
) {
Row(
modifier = Modifier
.fillMaxWidth()
.background(Color.Gray)
.padding(start = 0.dp, top = 30.dp, end = 0.dp, bottom = 0.dp),
horizontalArrangement = Arrangement.Center,
verticalAlignment = Alignment.CenterVertically
) {
NumberPicker(
value = kg,
onValueChange = { newKg -&gt;
kg = newKg
},
range = kgRange
)
Text(text = &quot;kg&quot;)
NumberPicker(
value = gr,
onValueChange = { newGr -&gt;
gr = newGr
},
range = grRange
)
Text(text = &quot;gr&quot;)
}
Row(
modifier = Modifier
.fillMaxWidth()
.height(IntrinsicSize.Min)
.background(Color.Gray)
.padding(start = 0.dp, top = 15.dp, end = 0.dp, bottom = 15.dp),
horizontalArrangement = Arrangement.Center,
verticalAlignment = Alignment.CenterVertically
) {
TextButton(onClick = {
onCancelClick()
}) {
Text(
text = &quot;cancel&quot;,
fontSize = 16.sp,
fontWeight = FontWeight.Bold,
color = DefaultDYTColor,
modifier = Modifier.padding(8.dp)
)
}
Divider(
color = Color.White,
modifier = Modifier
.padding(8.dp)
.fillMaxHeight()  //fill the max height
.width(1.dp)
)
TextButton(onClick = {
onConfirmClick(kg, gr)
}) {
Text(
text = &quot;okey&quot;,
fontSize = 16.sp,
fontWeight = FontWeight.Bold,
color = DefaultDYTColor,
modifier = Modifier.padding(8.dp)
)
}
}
}
}
I tried to do something here, so I already get the currentKg currentGr goalKg and goalGr values ​​in this component, but I don&#39;t use them in this code for now. In this way, the user can choose his target weight and target gram, and also his current weight and current gram. As you can see in the code, the values ​​are between 35 and 200, and grams are between 0 and 1000. What I want to do is that the user&#39;s target weight will never be greater than his current weight, that is, I want to adjust his current weight to be greater than the target weight. for example the user has selected his target weight of 40 kg and 20 g. While choosing the current weight, I want to start from 41 kg and 21 g from the picker. In the same way, if the user has selected his first current weight, let&#39;s say 40 kg and 20 gr, when he clicks to select his target weight again, the picker will open and the picker will have the maximum value of 39 kg and can select 19 gr per gram.
</details>
# 答案1
**得分**: 1
你需要在 `DailyCalorieWeightPickerComponent` 组件中使范围可定制化。
```kotlin
@Composable
fun DailyCalorieWeightPickerComponent(
onConfirmClick: (Int, Int) -> Unit,
onCancelClick: () -> Unit,
kgRange: IntRange, // 在这里传入范围
grRange: IntRange,
isClickGoalWeight: Boolean
) {
var kg by remember { mutableStateOf(value = 35) }
var gr by remember { mutableStateOf(value = 0) }
// 删除这里的范围
}

现在你已经在渲染组件时使用了当前和目标来设置范围：

when (state.pickerState) {
    PickerState.CURRENT_WEIGHT -> {
        DailyCalorieWeightPickerComponent(
            onConfirmClick = { kg, gr ->
                onChangeCurrentWeight(kg, gr)
                onChangePickerStatus(PickerState.NONE)
            },
            onCancelClick = {
                onChangePickerStatus(PickerState.NONE)
            },
            kgRange = (state.goalKg + 1)..200, // 从41开始
            grRange = (state.goalGram + 1)..1000,
            isClickGoalWeight = false
        )
    }
    PickerState.GOAL_WEIGHT -> {
        DailyCalorieWeightPickerComponent(
            onConfirmClick = { kg, gr ->
                onChangeGoalWeight(kg, gr)
                onChangePickerStatus(PickerState.NONE)
            },
            onCancelClick = {
                onChangePickerStatus(PickerState.NONE)
            },
            kgRange = 35 until state.currentKg, // 最大体重39kg
            grRange = 0 until state.currentGr,
            isClickGoalWeight = false
        )
    }
    PickerState.NONE -> {
        // 沉默是金
    }
}

希望这些翻译对你有帮助。

英文:

You have to make the range customisable in the DailyCalorieWeightPickerComponent component

@Composable
fun DailyCalorieWeightPickerComponent(
onConfirmClick: (Int, Int) -&gt; Unit,
onCancelClick: () -&gt; Unit,
kgRange: IntRange, // pass range here
grRange: IntRange,
isClickGoalWeight: Boolean
) {
var kg by remember { mutableStateOf(value = 35) }
var gr by remember { mutableStateOf(value = 0) }
//remove range here

Now you have set the ranges while rendering the component using current and target as

when (state.pickerState) {
PickerState.CURRENT_WEIGHT -&gt; {
DailyCalorieWeightPickerComponent(
onConfirmClick = { kg, gr -&gt;
onChangeCurrentWeight(kg, gr)
onChangePickerStatus(PickerState.NONE)
},
onCancelClick = {
onChangePickerStatus(PickerState.NONE)
},
kgRange = (state.goalKg + 1)..200, //start from 41
grRange = (state.goalGram + 1)..1000,
isClickGoalWeight = false
)
}
PickerState.GOAL_WEIGHT -&gt; {
DailyCalorieWeightPickerComponent(
onConfirmClick = { kg, gr -&gt;
onChangeGoalWeight(kg, gr)
onChangePickerStatus(PickerState.NONE)
},
onCancelClick = {
onChangePickerStatus(PickerState.NONE)
},
kgRange = 35 until state.currentKg, // maximum weight 39kg
grRange = 0 until state.currentGr,
isClickGoalWeight = false
)
}
PickerState.NONE -&gt; {
// silence is golden
}
}

huangapple
  • 本文由 发表于 2023年5月18日 02:34:56
  • 转载请务必保留本文链接：https://go.coder-hub.com/76275223.html
  • android-jetpack-compose
  • kotlin
  • picker
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定