如何在Flutter中自定义数字选择器？

Question

我在我的应用程序中实现了数字选择器。我想修改数字的大小以及高亮值和未高亮值的颜色。我通过将其包装在Theme小部件中并修改accentcolor来修改高亮值，但不知道如何进行其他自定义修改？

Theme(
  data: Theme.of(context).copyWith(
    accentColor: Colors.red,
  ),
  child: NumberPicker.integer(
    initialValue: _currentPickerValue,
    minValue: 0,
    maxValue: 100,
    onChanged: (newValue) =>
      setState(() => _currentPickerValue = newValue))) 

- Floris Marpepa

Answer 1

我深入研究了代码，这是我发现的东西：

• selectedStyle = themeData.textTheme.headline.copyWith(color: themeData.accentColor);

• defaultStyle = themeData.textTheme.body1; 这些不被突出显示的内容

要更改大小、颜色或任何其他样式属性，请修改这些样式。

下面是一个示例代码：

final theme = Theme.of(context);
Theme(
      data: theme.copyWith(
        accentColor: Colors.black,// highlted color
          textTheme: theme.textTheme.copyWith(
            headline5: theme.textTheme.headline5.copyWith(..), //other highlighted style
            bodyText2: theme.textTheme.headline5.copyWith(...), //not highlighted styles
      )),
      child: NumberPicker.integer(...),
    ); 

- Harsh Bhikadia

---

非常感谢。我必须学会如何检查这些事情，而不会打扰别人。再次感谢您。 - Floris Marpepa

目前这已经过时了。对于未突出显示的数字，body1已被bodyText2替换。对于突出显示的数字，我可以使用headline5更改它们的大小，但不知何故无法更改颜色。 - MAA

Answer 2

将您的数字选择器包更新到最新版本。

new NumberPicker.integer(
                ...,
                selectedTextStyle: TextStyle(...),
                textStyle: TextStyle(...), //styles of the default text
          )

访问NumberPicker类以了解其属性。

- Rajitha Udayanga