在ListWheelScrollView中获取子项的值

时间:2020-04-13 21:00:45

标签: flutter dart

我试图获取子文本小部件的值,或者即使有一种方法可以从我从中填充文本小部件的列表中获取值。当您滚动并且滚轮停止时,我想提取selectedItem的值。

由于使用无限滚动,因此无法将selectedItem的值映射到列表

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  FixedExtentScrollController fixedExtentScrollController =
      new FixedExtentScrollController();

// I would like to get one of these values
  List<String> numbers = [
    'one',
    'two',
    'three',
    'four',
    'five',
    'six',
    'seven',
    'eight',
    'nine'
  ];


  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      color: Colors.white,
      home: Center(
        child: Container(
          height: 800.0,
          width: 250.0,
          child: ListWheelScrollView.useDelegate(
            itemExtent: 100,
            controller: fixedExtentScrollController,
            physics: FixedExtentScrollPhysics(),
            onSelectedItemChanged: (_) {
              print(fixedExtentScrollController.selectedItem.);
            },
            childDelegate: ListWheelChildLoopingListDelegate(
              children: <Widget>[
                ...numbers.map((String number) {
                  return Container(
                    height: 100.0,
                    color: Colors.green,
                    child: Center(
                      child: Text( 
                        number,  //Here is the child value I would like to get
                        style: TextStyle(
                            fontSize: 24.0,
                            color: Colors.black,
                            fontWeight: FontWeight.normal,
                            fontStyle: FontStyle.normal,
                            decoration: TextDecoration.none),
                      ),
                    ),
                  );
                })
              ],
            ),
          ),
        ),
      ),
    );
  }
} 

1 个答案:

答案 0 :(得分:1)

检查documentation,可以使用onSelectedItemChanged

onSelectedItemChanged→值已更改 在中心项更改时调用的可选侦听器上。

可以将您的代码更改为以下内容:

onSelectedItemChanged: (i) {
    print(numbers[i]);
},

我希望这会有所帮助!