Scroll 颤振滚动多窗口小部件

Scroll 颤振滚动多窗口小部件,scroll,controller,flutter,stack,widget,Scroll,Controller,Flutter,Stack,Widget,如果我有两个或更多可滚动的小部件,比如SingleChildScrollView, 如何使它们同时滚动 因为我会把它们叠在一起, 所以一个被另一个的容器覆盖 我是新来的,所以我现在没有很多选择。 我试过ScrollController,但它不工作。 我不知道如何在我的代码中正确地实现它 此外,如果可能,请附上一个简单的代码示例 以下是我尝试过的: class _MyHomePageState extends State<MyHomePage> { final ScrollCon

如果我有两个或更多可滚动的小部件,比如SingleChildScrollView, 如何使它们同时滚动

因为我会把它们叠在一起, 所以一个被另一个的容器覆盖

我是新来的,所以我现在没有很多选择。 我试过ScrollController,但它不工作。 我不知道如何在我的代码中正确地实现它

此外,如果可能,请附上一个简单的代码示例

以下是我尝试过的:

class _MyHomePageState extends State<MyHomePage> {

  final ScrollController _mycontroller = new ScrollController();


  @override
  Widget build(BuildContext context) {
    body:
      Container(
        height: 100,
        child:
          Stack( children: <Widget>[
            SingleChildScrollView(
              controller: _mycontroller,
              child: Column( children: <Widget>[
                Text('LEFT            '),
                Text('LEFT            '),
                Text('LEFT            '),
                Text('LEFT            '),
                Text('LEFT            '),
                Text('LEFT            '),
              ],)
            ),
            SingleChildScrollView(
              controller: _mycontroller,
              child: Column(children: <Widget>[
                Text('          RIGHT'),
                Text('          RIGHT'),
                Text('          RIGHT'),
                Text('          RIGHT'),
                Text('          RIGHT'),
                Text('          RIGHT'),
              ],)
            ),
          ])
      )
  }
}
如果我滚动其中一个,我希望两者一起滚动。 但即使它们有相同的控制器,它们仍然独立滚动。 我不确定我是否正确使用控制器


请告知。

在Flatter中,有11种不同类型的小部件可用于通过不同的任务实现滚动功能。要创建一个简单的垂直ScrollView,其中可以包含具有不同行为的不同类型的小部件,我们将使用SingleChildScrollView小部件。此小部件可以显示其内部的多个小部件

Try This code both the Column Scroll at same time use can use only one controller to scroll the Both Column.

  class _ConfirmEmailState extends State<ConfirmEmail> {

  final ScrollController _mycontroller = new ScrollController();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("hello"),
        ),
        body: Container(
          height: 100,
          child: ListView(children: <Widget>[
            Stack(children: <Widget>[
              SingleChildScrollView(
                  controller: _mycontroller,
                  child: Column(
                    children: <Widget>[
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                      Text('LEFT            '),
                    ],
                  )),
              Column(
                children: <Widget>[
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                  Text('          RIGHT'),
                ],
              )
            ]),
          ]),
        ));
  }
}
创建脚手架小部件->小部件构建区域中的安全区域小部件 在安全区域小部件中创建SingleChildScrollView小部件。现在我们将在SingleChildScrollView中创建一个列小部件,并将所有的多个小部件放在列小部件中。我们正在SingleChildScrollView中创建多容器小部件和图像小部件。“全部”将在此处轻松滚动。
发布您的代码,以便人们能够提供帮助you@farhana嘿,我添加了一些代码。这有帮助吗?嘿,你们为什么要使用堆栈,你们应该使用行小部件来保持你们的列向左或向右scraolable@farhana然后我将滚动整行。如果滚动条在不同的行或列中,作为它们的一个孩子呢?据我所知,你有两列左右都是滚动的。嘿!谢谢你的回答。我想这不是我想要的。在您的示例中,整个堆栈正在移动。我想要的是,作为一个单独的列表,它们可以一起滚动,即使它们没有放在一起。这样我就可以在方便的地方以我想要的任何方式放置这些列表,但仍然可以一起滚动,因为它们将共享信息。
class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
        body: SafeArea(
          child: 
        )
       )
      );
   }
 }
SingleChildScrollView(
  child: Column(
  children: <Widget>[

    Container(
      color: Colors.green, // Yellow
      height: 120.0,
    ),

    Image.network('https://flutter-examples.com/wp-content/uploads/2019/09/blossom.jpg',
       width: 300, height: 200, fit: BoxFit.contain),

    Image.network('https://flutter-examples.com/wp-content/uploads/2019/09/sample_img.png',
       width: 200, fit: BoxFit.contain),

    Container(
      color: Colors.pink, // Yellow
      height: 120.0,
    ),

    Text('Some Sample Text - 1', style: TextStyle(fontSize: 28)),

    Text('Some Sample Text - 2', style: TextStyle(fontSize: 28)),

    Text('Some Sample Text - 3', style: TextStyle(fontSize: 28)),

    Container(
      color: Colors.redAccent, // Yellow
      height: 120.0,
    ),

    Image.network('https://flutter-examples.com/wp-content/uploads/2019/09/blossom.jpg',
       width: 300, height: 200, fit: BoxFit.contain),

  ],
  ),
 ),