0

I am developing an app to run on a raspberry pi 4.

I have a simple ListView, I am compiling for linux with 'flutter build linux' and to be able to scroll on a touch screen I have to move my finger on the scroll bar. If I scroll with the mouse wheel it works fine, but on a touch screen I necessarily have to do it on the scroll bar and not on the elements contained in the ListView.

However, if I build the app for use with flutter-pi, that is, build it as 'flutter build bundle', move it to the pi and then run it as 'flutter-pi my_app' then the listview scrolls on a touch screen. it works by hovering over items in the listview. For more details on how to compile for flutter-pi

And if I compile for the web, the scroll above the listview elements also works, it doesn't work when I compile for linux desktop app

My question is: Is there a way to scroll the listview by moving your finger over the elements in a native linux application and not through flutter-pi or web?

This is my code:

import 'package:flutter/material.dart';

Future<void> main() async {
   runApp(const MyApp2());
}
class MyApp2 extends StatelessWidget {
   const MyApp2({super.key});
  
  

   @override
   Widget build(BuildContext context) {
     var list2 = <Color>[];
     list2.add(Colors.black);
     list2.add(Colors.amber);
     list2.add(Color.fromARGB(255, 241, 150, 143));
     list2.add(Colors.blue);
     list2.add(Colors.pink);
     list2.add(Colors.blueAccent);
     return MaterialApp(
       title: 'ListView',
       home: Scaffold(
         body: ListView.builder(
               physics: const AlwaysScrollableScrollPhysics(),
               itemCount: list2.length,
               itemBuilder: (context, index) {
                 return Padding(
                   padding: const EdgeInsets.symmetric(vertical: 20),
                   child: Container(
                     color: list2[index],
                     height: 150,
                   ),
                 );
               }),
       ),
     );
   }
}
2
  • 2
    add scrollBehavior: const MaterialScrollBehavior().copyWith(dragDevices: {PointerDeviceKind.mouse, PointerDeviceKind.touch}) inside MaterialApp constructor Commented Jan 10, 2023 at 9:15
  • OMG, You're truly a lifesaver for me, thank you very much!! Commented Oct 10, 2024 at 12:54

1 Answer 1

0

As @pskink says, you have to use MaterialScrollBehavior, I leave the modified code to serve as an example

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';

Future<void> main() async {
  runApp(const MyApp2());
}


class MyApp2 extends StatelessWidget {
  const MyApp2({super.key});
  
  @override
  Widget build(BuildContext context) {
    var list2 = <Color>[];
    list2.add(Colors.black);
    list2.add(Colors.amber);
    list2.add(Color.fromARGB(255, 241, 150, 143));
    list2.add(Colors.blue);
    list2.add(Colors.pink);
    list2.add(Colors.blueAccent);
    return MaterialApp(
// THIS IS THE SCROLL BEHAVIOR
      scrollBehavior: const MaterialScrollBehavior().copyWith(dragDevices: {PointerDeviceKind.mouse, PointerDeviceKind.touch}),
      title: 'ListView',
      home: Scaffold(
        body: ListView.builder(
              physics: const AlwaysScrollableScrollPhysics(),
              itemCount: list2.length,
              itemBuilder: (context, index) {
                return Padding(
                  padding: const EdgeInsets.symmetric(vertical: 20),
                  child: Container(
                    color: list2[index],
                    height: 150,
                  ),
                );
              }),
      ),
    );
  }
}
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.